diff --git a/frontend/components/dataflow/node-editor/FlowEditor.tsx b/frontend/components/dataflow/node-editor/FlowEditor.tsx
index 62211179..43da1205 100644
--- a/frontend/components/dataflow/node-editor/FlowEditor.tsx
+++ b/frontend/components/dataflow/node-editor/FlowEditor.tsx
@@ -60,11 +60,14 @@ function FlowEditorInner() {
onNodesChange,
onEdgesChange,
onConnect,
+ onNodeDragStart,
addNode,
showPropertiesPanel,
selectNodes,
selectedNodes,
removeNodes,
+ undo,
+ redo,
} = useFlowEditorStore();
/**
@@ -80,17 +83,37 @@ function FlowEditorInner() {
);
/**
- * 키보드 이벤트 핸들러 (Delete/Backspace 키로 노드 삭제)
+ * 키보드 이벤트 핸들러 (Delete/Backspace 키로 노드 삭제, Ctrl+Z/Y로 Undo/Redo)
*/
const onKeyDown = useCallback(
(event: React.KeyboardEvent) => {
+ // Undo: Ctrl+Z (Windows/Linux) or Cmd+Z (Mac)
+ if ((event.ctrlKey || event.metaKey) && event.key === "z" && !event.shiftKey) {
+ event.preventDefault();
+ console.log("⏪ Undo");
+ undo();
+ return;
+ }
+
+ // Redo: Ctrl+Y (Windows/Linux) or Cmd+Shift+Z (Mac) or Ctrl+Shift+Z
+ if (
+ ((event.ctrlKey || event.metaKey) && event.key === "y") ||
+ ((event.ctrlKey || event.metaKey) && event.shiftKey && event.key === "z")
+ ) {
+ event.preventDefault();
+ console.log("⏩ Redo");
+ redo();
+ return;
+ }
+
+ // Delete: Delete/Backspace 키로 노드 삭제
if ((event.key === "Delete" || event.key === "Backspace") && selectedNodes.length > 0) {
event.preventDefault();
console.log("🗑️ 선택된 노드 삭제:", selectedNodes);
removeNodes(selectedNodes);
}
},
- [selectedNodes, removeNodes],
+ [selectedNodes, removeNodes, undo, redo],
);
/**
@@ -170,6 +193,7 @@ function FlowEditorInner() {
onNodesChange={onNodesChange}
onEdgesChange={onEdgesChange}
onConnect={onConnect}
+ onNodeDragStart={onNodeDragStart}
onSelectionChange={onSelectionChange}
onDragOver={onDragOver}
onDrop={onDrop}
diff --git a/frontend/components/dataflow/node-editor/FlowToolbar.tsx b/frontend/components/dataflow/node-editor/FlowToolbar.tsx
index 183b7090..7bcb9443 100644
--- a/frontend/components/dataflow/node-editor/FlowToolbar.tsx
+++ b/frontend/components/dataflow/node-editor/FlowToolbar.tsx
@@ -25,6 +25,10 @@ export function FlowToolbar() {
isSaving,
selectedNodes,
removeNodes,
+ undo,
+ redo,
+ canUndo,
+ canRedo,
} = useFlowEditorStore();
const [showLoadDialog, setShowLoadDialog] = useState(false);
@@ -108,10 +112,10 @@ export function FlowToolbar() {
{/* 실행 취소/다시 실행 */}
-