refactor(node-renderer): simplify selectors, remove reselect, cleanup

packages/react/src/hooks/useVisibleNodes.ts

@@ -1,31 +1,20 @@
 import { getNodesInside } from '@xyflow/system';
-import { createSelector } from 'reselect';
 import { shallow } from 'zustand/shallow';
 
 import { useStore } from '../hooks/useStore';
 import type { Node, ReactFlowState } from '../types';
+import { useCallback } from 'react';
 
-const visibleNodeIdsSelector = createSelector(
-  [
-    (s: ReactFlowState) => s.nodes,
-    (s: ReactFlowState) => s.width,
-    (s: ReactFlowState) => s.height,
-    (s: ReactFlowState) => s.transform,
-    (_s: ReactFlowState, onlyRenderVisibleNodes: boolean) => onlyRenderVisibleNodes,
-  ],
-  (nodes, width, height, transform, onlyRenderVisible) =>
-    onlyRenderVisible
-      ? getNodesInside<Node>(nodes, { x: 0, y: 0, width, height }, transform, true).map((node) => node.id)
-      : nodes.map((node) => node.id),
-  {
-    memoizeOptions: {
-      resultEqualityCheck: shallow,
-    },
-  }
-);
+const selector = (onlyRenderVisible: boolean) => (s: ReactFlowState) => {
+  return onlyRenderVisible
+    ? getNodesInside<Node>(s.nodes, { x: 0, y: 0, width: s.width, height: s.height }, s.transform, true).map(
+        (node) => node.id
+      )
+    : Array.from(s.nodeLookup.keys());
+};
 
 function useVisibleNodeIds(onlyRenderVisible: boolean) {
-  const nodeIds = useStore((s: ReactFlowState) => visibleNodeIdsSelector(s, onlyRenderVisible));
+  const nodeIds = useStore(useCallback(selector(onlyRenderVisible), [onlyRenderVisible]), shallow);
 
   return nodeIds;
 }