Merge pull request #359 from FalkorDB/fix-collapse

Fix #357 fix collapse

Author: Anchel123

app/components/code-graph.tsx

@@ -167,29 +167,38 @@ export function CodeGraph({
     }
 
     const deleteNeighbors = (nodes: Node[]) => {
+        
         if (nodes.length === 0) return;
-
+        
+        const expandedNodes: Node[] = []
+        
         graph.Elements = {
-            nodes: graph.Elements.nodes.map(node => {
+            nodes: graph.Elements.nodes.filter(node => {
+                if (!node.collapsed) return true
+                
                 const isTarget = graph.Elements.links.some(link => link.target.id === node.id && nodes.some(n => n.id === link.source.id));
+                
+                debugger
+
+                if (!isTarget) return true
 
-                if (!isTarget || !node.collapsed) return node
+                const deleted = graph.NodesMap.delete(Number(node.id))
 
-                if (node.expand) {
-                    node.expand = false
-                    deleteNeighbors([node])
+                if (deleted && node.expand) {
+                    expandedNodes.push(node)
                 }
 
-                graph.NodesMap.delete(Number(node.id))
-            }).filter(node => node !== undefined),
+                return false
+            }),
             links: graph.Elements.links
         }
+        
+        deleteNeighbors(expandedNodes)
 
         graph.removeLinks()
     }
 
     const handleExpand = async (nodes: Node[], expand: boolean) => {
-
         if (expand) {
             const elements = await onFetchNode(nodes.map(n => n.id))
 
@@ -219,7 +228,6 @@ export function CodeGraph({
         const chart = chartRef.current
 
         if (chart) {
-            const n = { name: node.properties.name, id: node.id }
 
             let chartNode = graph.Elements.nodes.find(n => n.id == node.id)
 
@@ -234,8 +242,8 @@ export function CodeGraph({
                 graph.visibleLinks(true, [chartNode!.id])
                 setData({ ...graph.Elements })
             }
-
-            setSearchNode(n)
+          
+            setSearchNode(chartNode)
             setTimeout(() => {
                 chart.zoomToFit(1000, 150, (n: NodeObject<Node>) => n.id === chartNode!.id);
             }, 0)
@@ -299,8 +307,7 @@ export function CodeGraph({
                                     <div className='flex gap-4'>
                                         <Input
                                             graph={graph}
-                                            value={searchNode.name || ""}
-                                            onValueChange={({ name }) => setSearchNode({ name })}
+                                            onValueChange={(node) => setSearchNode(node)}
                                             icon={<Search />}
                                             handleSubmit={handleSearchSubmit}
                                             node={searchNode}
@@ -405,7 +412,7 @@ export function CodeGraph({
                                     setSelectedObjects={setSelectedObjects}
                                     setPosition={setPosition}
                                     onFetchNode={onFetchNode}
-                                    deleteNeighbors={deleteNeighbors}
+                                    handleExpand={handleExpand}
                                     isShowPath={isShowPath}
                                     setPath={setPath}
                                     isPathResponse={isPathResponse}

app/components/graphView.tsx

@@ -2,7 +2,6 @@
 import ForceGraph2D from 'react-force-graph-2d';
 import { Graph, GraphData, Link, Node } from './model';
 import { Dispatch, RefObject, SetStateAction, useEffect, useRef, useState } from 'react';
-import { toast } from '@/components/ui/use-toast';
 import { Path } from '../page';
 
 export interface Position {
@@ -21,7 +20,7 @@ interface Props {
     setSelectedObjects: Dispatch<SetStateAction<Node[]>>
     setPosition: Dispatch<SetStateAction<Position | undefined>>
     onFetchNode: (nodeIds: number[]) => Promise<GraphData>
-    deleteNeighbors: (nodes: Node[]) => void
+    handleExpand: (nodes: Node[], expand: boolean) => void
     isShowPath: boolean
     setPath: Dispatch<SetStateAction<Path | undefined>>
     isPathResponse: boolean | undefined
@@ -48,7 +47,7 @@ export default function GraphView({
     setSelectedObjects,
     setPosition,
     onFetchNode,
-    deleteNeighbors,
+    handleExpand,
     isShowPath,
     setPath,
     isPathResponse,
@@ -132,28 +131,7 @@ export default function GraphView({
         lastClick.current = { date: now, name: node.name }
 
         if (isDoubleClick) {
-            const expand = !node.expand
-
-            if (expand) {
-                const elements = await onFetchNode([node.id])
-
-                if (elements.nodes.length === 0) {
-                    toast({
-                        title: `No neighbors found`,
-                        description: `No neighbors found`,
-                    })
-
-                    return
-                }
-            } else {
-                deleteNeighbors([node]);
-            }
-
-            node.expand = expand
-
-            setSelectedObj(undefined)
-            setData({ ...graph.Elements })
-
+            handleExpand([node], !node.expand)
         } else if (isShowPath) {
             setPath(prev => {
                 if (!prev?.start?.name || (prev.end?.name && prev.end?.name !== "")) {