mirror of
https://github.com/OFFIS-ESC/constellation-analyzer
synced 2026-01-27 07:43:41 +00:00
feat: maximize minimized groups on double-click
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 <noreply@anthropic.com>
This commit is contained in:
parent
ace816f2a5
commit
59096a5644
1 changed files with 16 additions and 0 deletions
|
|
@ -822,6 +822,21 @@ const GraphEditor = ({ onNodeSelect, onEdgeSelect, onGroupSelect, onMultiSelect,
|
||||||
setContextMenu(null); // Close context menu if open
|
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
|
// Handle edge click - ReactFlow handles selection automatically
|
||||||
const handleEdgeClick = useCallback(() => {
|
const handleEdgeClick = useCallback(() => {
|
||||||
setContextMenu(null); // Close context menu if open
|
setContextMenu(null); // Close context menu if open
|
||||||
|
|
@ -1058,6 +1073,7 @@ const GraphEditor = ({ onNodeSelect, onEdgeSelect, onGroupSelect, onMultiSelect,
|
||||||
onNodesDelete={handleNodesDelete}
|
onNodesDelete={handleNodesDelete}
|
||||||
onEdgesDelete={handleEdgesDelete}
|
onEdgesDelete={handleEdgesDelete}
|
||||||
onNodeClick={handleNodeClick}
|
onNodeClick={handleNodeClick}
|
||||||
|
onNodeDoubleClick={handleNodeDoubleClick}
|
||||||
onEdgeClick={handleEdgeClick}
|
onEdgeClick={handleEdgeClick}
|
||||||
onNodeContextMenu={handleNodeContextMenu}
|
onNodeContextMenu={handleNodeContextMenu}
|
||||||
onEdgeContextMenu={handleEdgeContextMenu}
|
onEdgeContextMenu={handleEdgeContextMenu}
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue