Merge pull request #238 from shivam1646/main

Fix: persist hidden nodes on rotate

src/components/Graph/index.tsx

@@ -47,6 +47,7 @@ const GraphComponent = ({
 }: LayoutProps) => {
   const [minScale, setMinScale] = React.useState(0.4);
   const setGraphValue = useGraph(state => state.setGraphValue);
+  const setLoading = useGraph(state => state.setLoading);
   const setConfig = useConfig(state => state.setConfig);
   const centerView = useConfig(state => state.centerView);
   const loading = useGraph(state => state.loading);
@@ -85,12 +86,13 @@ const GraphComponent = ({
         const MIN_SCALE = Math.round((450_000 / areaSize) * 100) / 100;
         const scale = MIN_SCALE > 2 ? 1 : MIN_SCALE <= 0 ? 0.1 : MIN_SCALE;
 
+        setLoading(true);
         setMinScale(scale);
         setSize({ width: layout.width + 400, height: layout.height + 400 });
 
         requestAnimationFrame(() => {
           setTimeout(() => {
-            setGraphValue("loading", false);
+            setLoading(false);
             setTimeout(() => changeRatio > 100 && centerView(), 0);
           }, 0);
         });

src/containers/Editor/LiveEditor/GraphCanvas.tsx

@@ -11,6 +11,7 @@ export const GraphCanvas = ({ isWidget = false }: { isWidget?: boolean }) => {
 
   const collapsedNodes = useGraph(state => state.collapsedNodes);
   const collapsedEdges = useGraph(state => state.collapsedEdges);
+  const loading = useGraph(state => state.loading);
 
   React.useEffect(() => {
     const nodeList = collapsedNodes.map(id => `[id$="node-${id}"]`);
@@ -26,7 +27,7 @@ export const GraphCanvas = ({ isWidget = false }: { isWidget?: boolean }) => {
       selectedNodes.forEach(node => node.classList.add("hide"));
       selectedEdges.forEach(edge => edge.classList.add("hide"));
     }
-  }, [collapsedNodes, collapsedEdges]);
+  }, [collapsedNodes, collapsedEdges, loading]);
 
   return (
     <>

src/hooks/store/useGraph.tsx

@@ -17,6 +17,7 @@ export type Graph = typeof initialStates;
 
 interface GraphActions {
   setGraphValue: (key: keyof Graph, value: any) => void;
+  setLoading: (loading: boolean) => void;
   expandNodes: (nodeId: string) => void;
   collapseNodes: (nodeId: string) => void;
   collapseGraph: () => void;
@@ -32,6 +33,7 @@ const useGraph = create<Graph & GraphActions>((set, get) => ({
       collapsedEdges: [],
       [key]: value,
     }),
+  setLoading: loading => set({ loading }),
   expandNodes: nodeId => {
     const [childrenNodes, matchingNodes] = getOutgoers(
       nodeId,