folder control

frontend/app/projects/[projectId]/folders/folder-edit-menu.tsx

@@ -6,13 +6,8 @@ import {
   DropdownItem,
 } from "@nextui-org/react";
 import { MoreVertical } from "lucide-react";
-import { FolderType } from "./layout";
 
-export default function FolderEditMenu(
+export default function FolderEditMenu({ folder, onEditClick, onDeleteClick }) {
-  folder: FolderType,
-  onEditClick: (folder: FolderType) => void,
-  onDeleteClick: (folderId: number) => void
-) {
   return (
     <Dropdown>
       <DropdownTrigger>

frontend/app/projects/[projectId]/folders/layout.tsx

@@ -156,6 +156,7 @@ export default function FoldersLayout({
   children: React.ReactNode;
   params: { projectId: number };
 }) {
+  const router = useRouter();
   const [folders, setFolders] = useState([]);
   const [selectedFolder, setSelectedFolder] = useState<FolderType>({});
 
@@ -205,6 +206,11 @@ export default function FoldersLayout({
     setIsFolderDialogOpen(true);
   };
 
+  const onDeleteClick = async (folderId: number) => {
+    await deleteFolder(folderId);
+    router.push(`/projects/${params.projectId}/folders`);
+  };
+
   useEffect(() => {
     async function fetchDataEffect() {
       try {
@@ -223,7 +229,6 @@ export default function FoldersLayout({
     fetchDataEffect();
   }, [folderId]);
 
-  const router = useRouter();
   return (
     <div className="flex w-full">
       <div className="w-64 min-h-screen border-r-1">
@@ -253,10 +258,9 @@ export default function FoldersLayout({
               }
               endContent={
                 <FolderEditMenu
-                  key={index}
                   folder={folder}
                   onEditClick={onEditClick}
-                  onDeleteClick={() => console.log("TODO")}
+                  onDeleteClick={onDeleteClick}
                 />
               }
             >