From 59096a5644a868723da41ab0d1cc661b7ce00561 Mon Sep 17 00:00:00 2001 From: Jan-Henrik Bruhn Date: Tue, 21 Oct 2025 11:47:58 +0200 Subject: [PATCH] feat: maximize minimized groups on double-click MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Add double-click handler for minimized groups to quickly maximize them, providing a faster alternative to using the context menu. Implementation: - Add handleNodeDoubleClick callback in GraphEditor - Check if double-clicked node is a minimized group - Call toggleGroupMinimized to maximize the group - Wire handler to ReactFlow's onNodeDoubleClick prop This improves UX by allowing users to quickly expand minimized groups to see and edit individual relations within them. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude --- src/components/Editor/GraphEditor.tsx | 16 ++++++++++++++++ 1 file changed, 16 insertions(+) diff --git a/src/components/Editor/GraphEditor.tsx b/src/components/Editor/GraphEditor.tsx index afbf3c0..806d50a 100644 --- a/src/components/Editor/GraphEditor.tsx +++ b/src/components/Editor/GraphEditor.tsx @@ -822,6 +822,21 @@ const GraphEditor = ({ onNodeSelect, onEdgeSelect, onGroupSelect, onMultiSelect, setContextMenu(null); // Close context menu if open }, []); + // Handle node double-click - maximize minimized groups + const handleNodeDoubleClick = useCallback( + (_event: React.MouseEvent, node: Node) => { + // Check if this is a minimized group + if (node.type === 'group') { + const groupData = node.data as Group['data']; + if (groupData.minimized) { + // Toggle to maximize the group + toggleGroupMinimized(node.id); + } + } + }, + [toggleGroupMinimized], + ); + // Handle edge click - ReactFlow handles selection automatically const handleEdgeClick = useCallback(() => { setContextMenu(null); // Close context menu if open @@ -1058,6 +1073,7 @@ const GraphEditor = ({ onNodeSelect, onEdgeSelect, onGroupSelect, onMultiSelect, onNodesDelete={handleNodesDelete} onEdgesDelete={handleEdgesDelete} onNodeClick={handleNodeClick} + onNodeDoubleClick={handleNodeDoubleClick} onEdgeClick={handleEdgeClick} onNodeContextMenu={handleNodeContextMenu} onEdgeContextMenu={handleEdgeContextMenu}