diff --git a/src/components/NodeRenameModal.tsx b/src/components/NodeRenameModal.tsx index 8cea96a..b4989a8 100644 --- a/src/components/NodeRenameModal.tsx +++ b/src/components/NodeRenameModal.tsx @@ -1,6 +1,7 @@ import { Input, Modal } from "antd"; import { graphContext, type NodeContext } from "./Graph"; import { useContext, useState } from "react"; +import { useGraphLayersTreeStore } from "../stores/TreeStore"; export default function NodeRenameModal({ nodeContext, @@ -15,7 +16,8 @@ export default function NodeRenameModal({ return; } const [nodeName, setSelectedNodeName] = useState(nodeContext.nodeName); - const graphContextValue = useContext(graphContext)!; + const graphContextValue = useContext(graphContext)!; + const renameTreeNode = useGraphLayersTreeStore(state => state.rename); function renameNode() { const node = graphContextValue.graph.nodes.find(n => n.id === nodeContext.nodeId); @@ -24,6 +26,7 @@ export default function NodeRenameModal({ } node.label = nodeName; graphContextValue.setGraph(prev => ({ ...prev, nodes: graphContextValue.graph.nodes })); + renameTreeNode(nodeContext.nodeId, nodeName); openRenameModal(false); } diff --git a/src/stores/TreeStore.tsx b/src/stores/TreeStore.tsx index bd913e8..9bb1ceb 100644 --- a/src/stores/TreeStore.tsx +++ b/src/stores/TreeStore.tsx @@ -10,6 +10,7 @@ export interface TreeStore { tree: TreeDataNode[]; add: (childNode: NodeContext, parentNodeId: string | undefined) => void; remove: (nodeId: string) => void; + rename: (nodeId: string, newName: string) => void; reset: () => void; } @@ -90,6 +91,20 @@ export const useGraphLayersTreeStore = create()((set) => ({ tree: createTree([...state.rootNodes], nodesFlatById) } }), + rename: (nodeId, newName) => set((state) => { + const node = state.nodesFlatById.get(nodeId); + if (!node) { + return state; + } + const nodesFlatById = new Map(state.nodesFlatById); + nodesFlatById.set(nodeId, { ...node, title: newName }); + return { + ...state, + nodesFlatById, + rootNodes: [...state.rootNodes], + tree: createTree([...state.rootNodes], nodesFlatById), + }; + }), reset: () => set({ nodesFlatById: new Map(), parentIdByChildId: new Map(),