From f8a56960115208a4b313195e16d8698a50b2e160 Mon Sep 17 00:00:00 2001 From: kimnamheeee Date: Thu, 5 Dec 2024 00:20:08 +0900 Subject: [PATCH 1/3] =?UTF-8?q?fix=20:=20=EA=B7=B8=EB=A3=B9=20=EC=84=A0?= =?UTF-8?q?=ED=83=9D=20=EB=B0=8F=20=EC=9D=B4=EB=8F=99=EC=9D=B4=20=EB=A7=A4?= =?UTF-8?q?=EB=B2=88=20history=EB=A5=BC=20=EC=97=85=EB=8D=B0=EC=9D=B4?= =?UTF-8?q?=ED=8A=B8=20=ED=95=98=EB=8D=98=20=EB=AC=B8=EC=A0=9C=20=ED=95=B4?= =?UTF-8?q?=EA=B2=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- client/src/konva_mindmap/components/MindMapNode.tsx | 4 ++-- client/src/store/NodeListProvider.tsx | 2 ++ 2 files changed, 4 insertions(+), 2 deletions(-) diff --git a/client/src/konva_mindmap/components/MindMapNode.tsx b/client/src/konva_mindmap/components/MindMapNode.tsx index 78794d57..48d25c00 100644 --- a/client/src/konva_mindmap/components/MindMapNode.tsx +++ b/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(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; } diff --git a/client/src/store/NodeListProvider.tsx b/client/src/store/NodeListProvider.tsx index d6cd7d75..a85c88a0 100644 --- a/client/src/store/NodeListProvider.tsx +++ b/client/src/store/NodeListProvider.tsx @@ -14,6 +14,7 @@ import useLoading, { MindMapLoadingHook } from "@/hooks/useLoading"; export type NodeListContextType = { stage: RefObject; data: NodeData | null; + setData: React.Dispatch>; selectedNode: SelectedNode | null; history: string[]; updateNode: (id: number, node: Partial) => void; @@ -151,6 +152,7 @@ export default function NodeListProvider({ children }: { children: ReactNode }) Date: Thu, 5 Dec 2024 00:36:35 +0900 Subject: [PATCH 2/3] =?UTF-8?q?fix=20:=20redo=EB=A5=BC=20=ED=8A=B8?= =?UTF-8?q?=EB=A6=AC=EA=B1=B0=ED=95=A0=20=EB=95=8C=20undo=EB=8F=84=20?= =?UTF-8?q?=ED=95=A8=EA=BB=98=20=ED=8A=B8=EB=A6=AC=EA=B1=B0=EB=90=98?= =?UTF-8?q?=EB=8D=98=20=EB=AC=B8=EC=A0=9C=20=ED=95=B4=EA=B2=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../src/components/MindMapCanvas/ToolMenu.tsx | 2 +- client/src/components/MindMapCanvas/index.tsx | 17 ++++++++--------- 2 files changed, 9 insertions(+), 10 deletions(-) diff --git a/client/src/components/MindMapCanvas/ToolMenu.tsx b/client/src/components/MindMapCanvas/ToolMenu.tsx index 8ab338d8..a1fb1446 100644 --- a/client/src/components/MindMapCanvas/ToolMenu.tsx +++ b/client/src/components/MindMapCanvas/ToolMenu.tsx @@ -19,7 +19,7 @@ type ToolMenuProps = { setDragmode: React.Dispatch>; }; 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) => { diff --git a/client/src/components/MindMapCanvas/index.tsx b/client/src/components/MindMapCanvas/index.tsx index ce2020b1..347ab011 100644 --- a/client/src/components/MindMapCanvas/index.tsx +++ b/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; } } From 791ee9ee0415d4c0543c2ad5c0c5c2c9d4124b90 Mon Sep 17 00:00:00 2001 From: Minju9187 Date: Thu, 5 Dec 2024 01:43:12 +0900 Subject: [PATCH 3/3] =?UTF-8?q?feat=20:=20input=20=ED=99=9C=EC=84=B1?= =?UTF-8?q?=ED=99=94=20=EC=8B=9C=20=EC=9A=94=EC=86=8C=20=EC=A0=84=EC=B2=B4?= =?UTF-8?q?=EC=84=A0=ED=83=9D=20(=20=EC=88=98=EC=A0=95=20=EB=B0=94?= =?UTF-8?q?=EB=A1=9C=20=ED=95=A0=20=EC=88=98=20=EC=9E=88=EB=8F=84=EB=A1=9D?= =?UTF-8?q?=20)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- client/src/components/MindMapHeader/index.tsx | 11 ++++++++++- .../ControlSection/ListView/NodeItem.tsx | 7 +++++++ .../konva_mindmap/components/EditableTextInput.tsx | 9 +++++++++ 3 files changed, 26 insertions(+), 1 deletion(-) diff --git a/client/src/components/MindMapHeader/index.tsx b/client/src/components/MindMapHeader/index.tsx index 01a55644..1c3cb526 100644 --- a/client/src/components/MindMapHeader/index.tsx +++ b/client/src/components/MindMapHeader/index.tsx @@ -3,17 +3,25 @@ import Profile from "@/components/MindMapHeader/Profile"; import { useNodeListContext } from "@/store/NodeListProvider"; import { useConnectionStore } from "@/store/useConnectionStore"; import { Input } from "@headlessui/react"; -import { useState } from "react"; +import { useEffect, useRef, useState } from "react"; import { FaPencilAlt } from "react-icons/fa"; export default function MindMapHeader() { const { title, updateTitle } = useNodeListContext(); const originalContent = title; + const inputRef = useRef(null); const [editMode, setEditMode] = useState(false); const handleSocketEvent = useConnectionStore((state) => state.handleSocketEvent); const role = useConnectionStore((state) => state.currentRole); const currentJobStatus = useConnectionStore((state) => state.currentJobStatus); + useEffect(() => { + if (editMode && inputRef.current) { + inputRef.current.focus(); + inputRef.current.select(); + } + }, [editMode]); + function handleInputBlur() { if (!title.length) { setEditMode(false); @@ -48,6 +56,7 @@ export default function MindMapHeader() { {editMode ? ( updateTitle(e.target.value)} diff --git a/client/src/components/MindMapMainSection/ControlSection/ListView/NodeItem.tsx b/client/src/components/MindMapMainSection/ControlSection/ListView/NodeItem.tsx index ffa4eb16..42370f4e 100644 --- a/client/src/components/MindMapMainSection/ControlSection/ListView/NodeItem.tsx +++ b/client/src/components/MindMapMainSection/ControlSection/ListView/NodeItem.tsx @@ -47,6 +47,13 @@ export default function NodeItem({ node, parentNodeId, open, handleAccordion, op if (isSelected) openAccordion(); }, [isSelected]); + useEffect(() => { + if (isEditing && inputRef.current) { + inputRef.current.focus(); + inputRef.current.select(); + } + }, [isEditing]); + function handleAddButton() { selectNode({ nodeId: node.id, parentNodeId: parentNodeId }); addNode(data, { nodeId: node.id, parentNodeId: parentNodeId }, overrideNodeData, (newNodeId) => { diff --git a/client/src/konva_mindmap/components/EditableTextInput.tsx b/client/src/konva_mindmap/components/EditableTextInput.tsx index 2bb1f159..372cfd98 100644 --- a/client/src/konva_mindmap/components/EditableTextInput.tsx +++ b/client/src/konva_mindmap/components/EditableTextInput.tsx @@ -1,3 +1,4 @@ +import { useEffect, useRef } from "react"; import { Html } from "react-konva-utils"; interface EditableTextInputProps { @@ -23,11 +24,19 @@ export default function EditableTextInput({ focus, scale, }: EditableTextInputProps) { + const inputRef = useRef(null); const fontSize = scale >= 1 ? 16 : 16 / scale; + useEffect(() => { + if (inputRef.current && focus) { + inputRef.current.select(); + } + }, [focus]); + return (