Merge pull request #247 from boostcampwm-2024/feature-historyState-fix

[Feature-historyState-fix] redo를 할 때 undo가 함께 트리거되던 문제 해결 / 그룹 선택 이동시 매번 history 갱신 되던 문제 해결

Author: Minju9187

client/src/components/MindMapCanvas/ToolMenu.tsx

@@ -19,7 +19,7 @@ type ToolMenuProps = {
   setDragmode: React.Dispatch<React.SetStateAction<boolean>>;
 };
 export default function ToolMenu({ dimensions, zoomIn, zoomOut, dragmode, setDragmode }: ToolMenuProps) {
-  const { data, selectNode, selectedNode, saveHistory, overrideNodeData } = useNodeListContext();
+  const { data, selectNode, selectedNode, overrideNodeData } = useNodeListContext();
   const intervalRef = useRef(null);
 
   const startZoom = (zoomFn) => {

client/src/components/MindMapCanvas/index.tsx

@@ -52,15 +52,14 @@ export default function MindMapCanvas({ showMinutes, handleShowMinutes }) {
   useWindowEventListener("keydown", (e) => {
     e.preventDefault();
     if (e.metaKey || e.ctrlKey) {
-      if (e.shiftKey && e.code === "KeyZ") redo();
-      switch (e.code) {
-        case "KeyZ":
-          undo();
-          break;
-        case "KeyR":
-          const url = window.location;
-          location.href = url.pathname + url.search;
-          break;
+      if (e.shiftKey && e.code === "KeyZ") {
+        redo();
+      } else if (e.code === "KeyZ") {
+        undo();
+      }
+      if (e.code === "KeyR") {
+        const url = window.location;
+        location.href = url.pathname + url.search;
       }
     }
 

client/src/konva_mindmap/components/MindMapNode.tsx

@@ -24,7 +24,7 @@ import useWindowEventListener from "@/hooks/useWindowEventListener";
 
 export default function MindMapNode({ data, parentNode, node, depth, dragmode, scale }: NodeProps) {
   const nodeRef = useRef<Konva.Group>(null);
-  const { saveHistory, updateNode, selectNode, selectedNode, selectedGroup, overrideNodeData, groupRelease } =
+  const { saveHistory, updateNode, selectNode, selectedNode, selectedGroup, setData, overrideNodeData, groupRelease } =
     useNodeListContext();
   const handleSocketEvent = useConnectionStore.getState().handleSocketEvent;
   const [isEditing, setIsEditing] = useState(false);
@@ -82,7 +82,7 @@ export default function MindMapNode({ data, parentNode, node, depth, dragmode, s
 
     if (selectedGroup.length) {
       const groupMove = getMovedNodesLocation(data, selectedGroup, node, dx, dy, currentPos);
-      overrideNodeData(groupMove);
+      setData(groupMove);
       return;
     }
 

client/src/store/NodeListProvider.tsx

@@ -14,6 +14,7 @@ import useLoading, { MindMapLoadingHook } from "@/hooks/useLoading";
 export type NodeListContextType = {
   stage: RefObject<Konva.Stage>;
   data: NodeData | null;
+  setData: React.Dispatch<React.SetStateAction<NodeData | null>>;
   selectedNode: SelectedNode | null;
   history: string[];
   updateNode: (id: number, node: Partial<Node>) => void;
@@ -151,6 +152,7 @@ export default function NodeListProvider({ children }: { children: ReactNode })
     <NodeListContext.Provider
       value={{
         data,
+        setData,
         updateNode,
         overrideNodeData,
         undoData,