refactor(delete): only trigger when some node or edge is selected #1987

example/src/Overview/index.tsx

@@ -200,7 +200,6 @@ const OverviewFlow = () => {
       maxZoom={Infinity}
       onNodesDelete={onNodesDelete}
       onEdgesDelete={onEdgesDelete}
-      deleteKeyCode={null}
     >
       <MiniMap nodeStrokeColor={nodeStrokeColor} nodeColor={nodeColor} nodeBorderRadius={2} />
       <Controls />

src/hooks/useGlobalKeyHandler.ts

@@ -43,35 +43,44 @@ export default ({ deleteKeyCode, multiSelectionKeyCode }: HookParams): void => {
       const edgesToRemove = [...selectedEdges, ...connectedEdges];
       const edgeIdsToRemove = edgesToRemove.map((e) => e.id);
 
-      if (hasDefaultNodes) {
+      if (hasDefaultEdges || hasDefaultNodes) {
-        nodesToRemove.forEach((node) => {
-          nodeInternals.delete(node.id);
-        });
-      }
-
         if (hasDefaultEdges) {
           store.setState({
-          nodeInternals: new Map(nodeInternals),
             edges: edges.filter((e) => !edgeIdsToRemove.includes(e.id)),
           });
         }
 
+        if (hasDefaultNodes) {
+          nodesToRemove.forEach((node) => {
+            nodeInternals.delete(node.id);
+          });
+
+          store.setState({
+            nodeInternals: new Map(nodeInternals),
+          });
+        }
+      }
+
+      if (edgeIdsToRemove.length > 0) {
         onEdgesDelete?.(edgesToRemove);
-      onNodesDelete?.(nodesToRemove);
 
         if (onEdgesChange) {
           const edgeChanges: EdgeChange[] = edgeIdsToRemove.map((id) => ({
             id,
             type: 'remove',
           }));
-
           onEdgesChange(edgeChanges);
         }
+      }
+
+      if (nodesToRemove.length > 0) {
+        onNodesDelete?.(nodesToRemove);
 
         if (onNodesChange) {
           const nodeChanges: NodeChange[] = nodesToRemove.map((n) => ({ id: n.id, type: 'remove' }));
           onNodesChange(nodeChanges);
         }
+      }
 
       store.setState({ nodesSelectionActive: false });