From 005df0da114ebbd9f3c6c2622f47c6a054036a81 Mon Sep 17 00:00:00 2001
From: moklick <info@moritzklack.com>
Date: Tue, 16 May 2023 15:07:02 +0200
Subject: [PATCH] fix(useNodes,useEdges): prevent re-renderings

---
 packages/core/src/hooks/useEdges.ts | 4 +++-
 packages/core/src/hooks/useNodes.ts | 4 +++-
 2 files changed, 6 insertions(+), 2 deletions(-)

diff --git a/packages/core/src/hooks/useEdges.ts b/packages/core/src/hooks/useEdges.ts
index 78c0e36a..194f8805 100644
--- a/packages/core/src/hooks/useEdges.ts
+++ b/packages/core/src/hooks/useEdges.ts
@@ -1,10 +1,12 @@
+import { shallow } from 'zustand/shallow';
+
 import { useStore } from '../hooks/useStore';
 import type { Edge, ReactFlowState } from '../types';
 
 const edgesSelector = (state: ReactFlowState) => state.edges;
 
 function useEdges<EdgeData>(): Edge<EdgeData>[] {
-  const edges = useStore(edgesSelector);
+  const edges = useStore(edgesSelector, shallow);
 
   return edges;
 }
diff --git a/packages/core/src/hooks/useNodes.ts b/packages/core/src/hooks/useNodes.ts
index 8681b4fd..8d71b435 100644
--- a/packages/core/src/hooks/useNodes.ts
+++ b/packages/core/src/hooks/useNodes.ts
@@ -1,10 +1,12 @@
+import { shallow } from 'zustand/shallow';
+
 import { useStore } from '../hooks/useStore';
 import type { Node, ReactFlowState } from '../types';
 
 const nodesSelector = (state: ReactFlowState) => state.getNodes();
 
 function useNodes<NodeData>(): Node<NodeData>[] {
-  const nodes = useStore(nodesSelector);
+  const nodes = useStore(nodesSelector, shallow);
 
   return nodes;
 }