-
Board: {name}
+ {!renameBoard && (
+ setRenameBoard(true)} className='text-2xl'>Board: {name}
+ )}
+ {renameBoard && (
+
+ )}
diff --git a/task_management_app/src/components/BoardDelete.tsx b/task_management_app/src/components/BoardDelete.tsx
new file mode 100644
index 0000000..f678797
--- /dev/null
+++ b/task_management_app/src/components/BoardDelete.tsx
@@ -0,0 +1,23 @@
+"use client"
+import { deleteBoard } from "@/app/actions/boardActions"
+import { useRouter } from "next/navigation";
+
+
+const BoardDelete = ({boardId}:{boardId:string}) => {
+ const router = useRouter();
+ async function handleDeleteBoard(){
+ await deleteBoard(boardId);
+ router.push('/');
+ }
+
+
+
+ return (
+
+ handleDeleteBoard()} className="bg-[tomato] p-2 text-white rounded-md font-semibold hover:opacity-90">Delete board
+
+
+ )
+}
+
+export default BoardDelete
\ No newline at end of file
diff --git a/task_management_app/src/components/Column.tsx b/task_management_app/src/components/Column.tsx
index eac0ab5..3ece2bb 100644
--- a/task_management_app/src/components/Column.tsx
+++ b/task_management_app/src/components/Column.tsx
@@ -2,6 +2,8 @@ import { Card, useMutation, useStorage } from '@/app/liveblocks.config';
import { shallow } from '@liveblocks/client';
import { ReactSortable } from 'react-sortablejs';
import NewCardForm from './forms/NewCardForm';
+import { FormEvent, useState } from 'react';
+import { BsThreeDots } from "react-icons/bs";
type ColumnProps = {
@@ -35,13 +37,48 @@ const Column = ({id, name}: ColumnProps) => {
})
})
- },[])
+ }, []);
+
+ const updateColumn = useMutation(({storage}, id, newName) => {
+ const columns = storage.get('columns');
+ columns.find(c => c.toObject().id === id)?.set('name', newName)
+ }, []);
+
+ const [renameColumn, setRenameColumn] = useState(false);
+ function handleRenameColumn(ev: FormEvent){
+ ev.preventDefault();
+ const input = (ev.target as HTMLFormElement).querySelector('input')
+ if(input){
+ const newColumnName = input.value;
+ updateColumn(id, newColumnName)
+ setRenameColumn(false);
+ }
+ }
+
return (
-
{name}
- {columnCards && (
+ {!renameColumn && (
+
+
{name}
+ setRenameColumn(true)}>
+
+ )}
+ {renameColumn && (
+
+ Edit name:
+
+ Delete column
+ setRenameColumn(false)} className='w-full mt-4 text-xs uppercase font-bold text-gray-500 tracking-wider'>Cancel
+
+
+ )}
+
+ {!renameColumn && columnCards && (
<>
setTasksOrderForColumn(items, id)} group="cards" ghostClass='opacity-40' className='min-h-12'>
{columnCards.map(card => (
@@ -52,7 +89,10 @@ const Column = ({id, name}: ColumnProps) => {
>
)}
-
+ {!renameColumn && (
+
+ )}
+
)
diff --git a/task_management_app/src/components/EmailAccessList.tsx b/task_management_app/src/components/EmailAccessList.tsx
new file mode 100644
index 0000000..5ae7ec0
--- /dev/null
+++ b/task_management_app/src/components/EmailAccessList.tsx
@@ -0,0 +1,33 @@
+"use client"
+import { deleteBoard, removeEmailFromBoard } from "@/app/actions/boardActions";
+import { RoomAccesses } from "@liveblocks/node";
+import { useRouter } from "next/navigation";
+import { IoTrashOutline } from "react-icons/io5";
+
+
+
+
+const EmailAccessList = ({boardId, usersAccesses} : {boardId:string ,usersAccesses:RoomAccesses}) => {
+ const router = useRouter();
+ async function handleDelete(emailToDelete: string){
+ await removeEmailFromBoard(boardId, emailToDelete)
+ router.refresh();
+ }
+
+
+
+ return (
+
+ {Object.keys(usersAccesses).map(email => (
+
+ {email}
+ handleDelete(email)} className="p-2 bg-gray-100">
+
+
+
+ ))}
+
+ )
+}
+
+export default EmailAccessList
\ No newline at end of file
diff --git a/task_management_app/src/lib/liveblocksClient.ts b/task_management_app/src/lib/liveblocksClient.ts
index 186888c..776406f 100644
--- a/task_management_app/src/lib/liveblocksClient.ts
+++ b/task_management_app/src/lib/liveblocksClient.ts
@@ -2,4 +2,10 @@ import { Liveblocks } from "@liveblocks/node";
export const liveblocksClient = new Liveblocks({
secret: process.env.LIVEBLOCKS_SECRET_KEY || '',
-});
\ No newline at end of file
+});
+
+export function getLiveblocksClient(){
+ return new Liveblocks({
+ secret: process.env.LIVEBLOCKS_SECRET_KEY || '',
+ });
+}
\ No newline at end of file