improve: adjust layout of path node

src/components/Navigations/SideNavigation.js

@@ -3,14 +3,47 @@ import PermissionGuard from "../PermissionGuard";
 import PathNode from "./PathNode";
 import config from "../../config";
 import "./SideNavigation.css";
-import {fetch_} from "../../utils/requestUtils";
+import { fetch_ } from "../../utils/requestUtils";
+
 const SideNavigation = () => {
     const [paths, setPaths] = useState([]);
     const [loading, setLoading] = useState(false);
 
+    const handleDelete = (id) => {
+        fetch_(`${config.BACKEND_HOST}/api/path/${id}`, {
+            method: "DELETE",
+        },{
+            use_cache: false,
+            use_token: true,
+        }).then(() => {
+            setPaths((prevPaths) => prevPaths.filter((path) => path.id !== id));
+        })
+            .catch((error) => console.error(error));
+    };
+
+    const handleSave = (id, newName) => {
+        fetch_(`${config.BACKEND_HOST}/api/path/${id}`, {
+            method: "PUT",
+            body: JSON.stringify({ name: newName, parent_id: 1 }), // Update with actual parent_id
+        }, {
+            use_cache: false,
+            use_token: true,
+        }).then(() => {
+            setPaths((prevPaths) =>
+                prevPaths.map((path) =>
+                    path.id === id ? { ...path, name: newName } : path
+                )
+            );
+        })
+            .catch((error) => console.error("Failed to update path", error));
+    };
+
     useEffect(() => {
         setLoading(true);
-        fetch_(`${config.BACKEND_HOST}/api/path/`, {},{ use_cache: true, use_token:false })
+        fetch_(`${config.BACKEND_HOST}/api/path/`, {},{
+            use_cache: true,
+            use_token: false,
+        })
             .then((data) => {
                 setPaths(data);
             })
@@ -36,6 +69,8 @@ const SideNavigation = () => {
                         key={path.id}
                         path={path}
                         isRoot={false}
+                        onSave={handleSave} // Ensure this is passed
+                        onDelete={handleDelete}
                     />
                 ))}
             </ul>