feat: добавлена возможность удаления и редактирования самой доски

src/KBBoard/KBBoard.js

@@ -15,12 +15,16 @@ const KBBoard = () => {
     const [crCateg, setCrCateg] = useState(false);
     const [edTask, setEdTask] = useState(false);
     const [edCateg, setEdCateg] = useState(false);
+    const [edBoard, setEdBoard] = useState(false);
     const [delTask, setDelTask] = useState(false);
     const [delCateg, setDelCateg] = useState(false);
     const [asgnMember, setAsgnMember] = useState(false);
     const [assignAction, setAssignAction] = useState(false);
     const [addMemb, setAddMemb] = useState(false);
+    const [delBoards, setDelBoards] = useState(false);
 
+    const [boardTitle, setBoardTitle] = useState('');
+    const [boardDescription, setBoardDescription] = useState('');
     const [categoryTitle, setCategoryTitle] = useState('');
     const [taskTitle, setTaskTitle] = useState('');
     const [taskDescription, setTaskDescription] = useState('');
@@ -33,18 +37,19 @@ const KBBoard = () => {
     const [assignedMember, setAssignedMember] = useState(0);
     const [addedUsername, setAddedUsername] = useState('');
 
-
-
     const {
         loadBoardData,
         createTask,
+        checkOwner,
         createCategory,
+        editBoard,
         editTask,
         editCategory,
         deleteCategory,
         deleteTask,
         assignMember,
-        addMember
+        addMember,
+        deleteBoards
     } = useBoardLogic(id, setError, setInfo, setCategories, setLoading);
 
     useEffect(() => {
@@ -61,6 +66,11 @@ const KBBoard = () => {
         setCrCateg(!crCateg);
         setCategoryTitle('');
     }
+    const modalEditBoard = () => {
+        setEdBoard(!edBoard);
+        setBoardTitle(info.title);
+        setBoardDescription(info.description);
+    }
     const modalEditTask = (task, id_categ) => () => {
         setEdTask(!edTask);
         setTaskCategori(id_categ);
@@ -90,8 +100,12 @@ const KBBoard = () => {
     const modalAddMember = () => {
         setAddMemb(!addMemb);
     }
+    const modalDeleteBoards = () => {
+        setDelBoards(!delBoards);
+    }
     
 
+    
     const handleCreateCategory = async (e) => {
         e.preventDefault();
         await createCategory(categoryTitle, modalCrCateg);
@@ -100,6 +114,11 @@ const KBBoard = () => {
         e.preventDefault();
         await createTask(taskCategori, taskTitle, taskDescription, modalCrTask);
     };
+    const handleEditBoard = async (e) => {
+        e.preventDefault();
+        await editBoard(id, boardTitle, boardDescription, modalEditBoard);
+    };
+    
     const handleEditCategory = async (e) => {
         e.preventDefault();
         await editCategory(editedCateg.id, categoryTitle, modalEditCateg);
@@ -124,9 +143,12 @@ const KBBoard = () => {
         e.preventDefault();
         await addMember(addedUsername, id, modalAddMember);
     };
+    const handleDeleteBoards = async (e) => {
+        e.preventDefault();
+        await deleteBoards(id, modalDeleteBoards);
+    };
     
 
-
     return (
         <div className="app-container">
         	<Header />
@@ -150,9 +172,28 @@ const KBBoard = () => {
                     </div>
                 </div>
                 <div className="set-panel" >
-                    <button onClick={modalAddMember}>
-                        Добавить участника
-                    </button>
+                    {checkOwner(info?.owner?.id) ? (
+                        <>
+                            <button onClick={modalAddMember}>
+                                Добавить участника
+                            </button>
+                            <button onClick={null}>
+                                Выгнать участника
+                            </button>
+                            <button onClick={modalEditBoard}>
+                                Настройки доски
+                            </button>
+                            <button className='Important-button' onClick={modalDeleteBoards}>
+                                Удаление доски
+                            </button>
+                        </>
+                    ) : (
+                        <>
+                            <button onClick={null}>
+                                Покинуть доску
+                            </button>
+                        </>
+                    )}
                 </div>
                 <div className="board-panel" >
                     {categories.map((category) => (
@@ -255,6 +296,35 @@ const KBBoard = () => {
                     </div>
                 )}
 
+                {edBoard && (
+                    <div className="confirm-modal">
+                        <div className="modal-content">
+                            <div><h3>Изменение доски</h3></div>
+                            <form onSubmit={handleEditBoard}>
+                                <div>
+                                    <label >Название:</label>
+                                    <input
+                                        type="text"
+                                        value={boardTitle}
+                                        onChange={(e) => setBoardTitle(e.target.value)}
+                                        required
+                                    />
+                                    <label >Описание:</label>
+                                    <input
+                                        type="text"
+                                        value={boardDescription}
+                                        onChange={(e) => setBoardDescription(e.target.value)}
+                                    />
+                                </div>
+                                <button type="submit" disabled={loading}>
+                                    {loading ? 'Изменение...' : 'Изменить'}
+                                </button>
+                            </form>
+                            <button onClick={modalEditBoard}>Отменить</button>
+                        </div>
+                    </div>
+                )}
+
                 {edCateg && (
                     <div className="confirm-modal">
                         <div className="modal-content">
@@ -355,15 +425,31 @@ const KBBoard = () => {
                     </div>
                 )}
 
+                {delBoards && (
+                    <div className="confirm-modal">
+                        <div className="modal-content">
+                            <div><h3>Удаление доски</h3></div>
+                            <form onSubmit={handleDeleteBoards}>
+                                <label >Вы точно хотите удалить эту Канбан доску</label>
+                                <button onClick={modalDeleteBoards} type='reset'>Отменить</button>
+                                <button className="Important-button" type="submit" disabled={loading}>
+                                    {loading ? 'Удаление...' : 'Удалить'}
+                                </button>
+                            </form>
+                        </div>
+                    </div>
+                )}
+
+
                 {addMemb && (
                     <div className="confirm-modal">
                         <div className="modal-content">
-                            <div><h3>Удаление категории</h3></div>
+                            <div><h3>Добавление участников</h3></div>
                             <form onSubmit={handleAddMember}>
                                 <label >Введите логин человека которого хотитепригласить</label>
                                 <input
                                     type="text"
-                                    placeholder="Поиск по названию..."
+                                    placeholder="Поиск по логину..."
                                     value={addedUsername}
                                     onChange={(e) => setAddedUsername(e.target.value)}
                                 />
@@ -376,8 +462,6 @@ const KBBoard = () => {
                     </div>
                 )}
 
-
-
                 {asgnMember && (
                     <div className="confirm-modal">
                         {assignAction ? (