fix(react): dont show nodeTypes warning if not necessary #3923

packages/react/src/container/GraphView/useNodeOrEdgeTypesWarning.ts

@@ -1,27 +1,36 @@
 import { useEffect, useRef } from 'react';
 import { errorMessages } from '@xyflow/system';
 
-import type { EdgeTypes, NodeTypes } from '../../types';
 import { useStoreApi } from '../../hooks/useStore';
+import type { EdgeTypes, NodeTypes } from '../../types';
 
 const emptyTypes = {};
 
-/*
+/**
- * This hook warns the user if node or edgeTypes change.
+ * This hook warns the user if nodeTypes or edgeTypes changed.
+ * It is only used in development mode.
+ *
+ * @internal
  */
 export function useNodeOrEdgeTypesWarning(nodeOrEdgeTypes?: NodeTypes): void;
 export function useNodeOrEdgeTypesWarning(nodeOrEdgeTypes?: EdgeTypes): void;
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
 export function useNodeOrEdgeTypesWarning(nodeOrEdgeTypes: any = emptyTypes): any {
-  const updateCount = useRef(0);
+  const typesRef = useRef(nodeOrEdgeTypes);
   const store = useStoreApi();
 
   useEffect(() => {
     if (process.env.NODE_ENV === 'development') {
-      if (updateCount.current > 1) {
+      const usedKeys = new Set([...Object.keys(typesRef.current), ...Object.keys(nodeOrEdgeTypes)]);
-        store.getState().onError?.('002', errorMessages['error002']());
+
+      for (const key of usedKeys) {
+        if (typesRef.current[key] !== nodeOrEdgeTypes[key]) {
+          store.getState().onError?.('002', errorMessages['error002']());
+          break;
+        }
       }
-      updateCount.current += 1;
+
+      typesRef.current = nodeOrEdgeTypes;
     }
   }, [nodeOrEdgeTypes]);
 }