improve: change db schema for settings

src/components/PathManager.js

@@ -1,6 +1,6 @@
 
 import React, {useEffect, useState, useRef, useContext} from "react";
-import { useCreatePath, usePaths } from "../utils/path-queries";
+import {useCreatePath, usePath, usePaths} from "../utils/path-queries";
 import { useQueryClient } from "react-query";
 import "./PathManager.css";
 import {fetch_} from "../utils/request-utils";
@@ -9,7 +9,8 @@ import PathSettingModal from "./Modals/PathSettingModal";
 
 
 const PathManager = ({ currentPathId = 1, onPathChange }) => {
-    const [currentPath, setCurrentPath] = useState([{ name: "Root", id: 1 }]);
+    const { data: currentPath } = usePath(currentPathId);
+    const [currentFullPath, setCurrentFullPath] = useState([{ name: "Root", id: 1 }]);
     const [searchTerm, setSearchTerm] = useState("");
     const [dropdownActive, setDropdownActive] = useState(false);
 
@@ -25,7 +26,7 @@ const PathManager = ({ currentPathId = 1, onPathChange }) => {
         setIsPathSettingModalModalOpen(true);
     }
 
-    const buildPath = async (pathId) => {
+    const buildFullPath = async (pathId) => {
         const path = [];
         let current_id = pathId;
         while (current_id) {
@@ -47,21 +48,21 @@ const PathManager = ({ currentPathId = 1, onPathChange }) => {
 
     useEffect(() => {
         const init = async () => {
-            const path = await buildPath(currentPathId);
-            setCurrentPath(path);
+            const path = await buildFullPath(currentPathId);
+            setCurrentFullPath(path);
         };
         init();
     }, [currentPathId, queryClient]);
 
     const handlePathClick = (pathId, pathIndex) => {
-        const newPath = currentPath.slice(0, pathIndex + 1);
-        setCurrentPath(newPath);
+        const newPath = currentFullPath.slice(0, pathIndex + 1);
+        setCurrentFullPath(newPath);
         onPathChange(pathId);
     };
 
     const handleSubPathSelect = (subPath) => {
-        const updatedPath = [...currentPath, { name: subPath.name, id: subPath.id }];
-        setCurrentPath(updatedPath);
+        const updatedPath = [...currentFullPath, { name: subPath.name, id: subPath.id }];
+        setCurrentFullPath(updatedPath);
         onPathChange(subPath.id);
         setSearchTerm("");
         setDropdownActive(false);
@@ -113,14 +114,14 @@ const PathManager = ({ currentPathId = 1, onPathChange }) => {
         <div className="path-manager">
             <div className="path-manager-header field has-addons">
                 <div className="current-path control">
-                    {currentPath.map((path, index) => (
+                    {currentFullPath.map((path, index) => (
                         <span
                             key={path.id}
                             className="breadcrumb-item is-clickable"
                             onClick={() => handlePathClick(path.id, index)}
                         >
                             {path.name}
-                            {index < currentPath.length - 1 && " / "}
+                            {index < currentFullPath.length - 1 && " / "}
                         </span>
                     ))}
                 </div>
@@ -137,7 +138,7 @@ const PathManager = ({ currentPathId = 1, onPathChange }) => {
                     </button>
                     <PathSettingModal
                         isOpen={isPathSettingModalOpen}
-                        pathId={currentPathId}
+                        path={currentPath}
                         onClose={() => setIsPathSettingModalModalOpen(false)}
                     />
                 </div>