Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix #357 fix collapse #359

Merged
merged 6 commits into from
Feb 6, 2025
Merged

Fix #357 fix collapse #359

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
1a2a087
Refactor CodeGraph and GraphView components to improve node expansion…
Anchel123 Jan 22, 2025
beac2ab
Merge branch 'staging' into fix-collapse
Anchel123 Jan 27, 2025
954f283
Merge branch 'staging' into fix-collapse
Anchel123 Feb 5, 2025
3281912
Merge branch 'staging' into fix-collapse
barakb Feb 5, 2025
7b75a2c
Merge branch 'staging' into fix-collapse
Anchel123 Feb 6, 2025
9799714
fix build
Anchel123 Feb 6, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
40 changes: 23 additions & 17 deletions app/components/code-graph.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -166,29 +166,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))

Expand Down Expand Up @@ -216,12 +225,11 @@ export function CodeGraph({

const handleSearchSubmit = (node: any) => {
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)

if (!chartNode?.visible) {
if (!chartNode) {
chartNode = graph.extend({ nodes: [node], edges: [] }).nodes[0]
Expand All @@ -233,8 +241,7 @@ export function CodeGraph({
graph.visibleLinks(true, [chartNode!.id])
setData({ ...graph.Elements })
}

setSearchNode(n)

setTimeout(() => {
chart.zoomToFit(1000, 150, (n: NodeObject<Node>) => n.id === chartNode!.id);
}, 0)
Expand Down Expand Up @@ -271,8 +278,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}
Expand Down Expand Up @@ -371,7 +377,7 @@ export function CodeGraph({
setSelectedObjects={setSelectedObjects}
setPosition={setPosition}
onFetchNode={onFetchNode}
deleteNeighbors={deleteNeighbors}
handleExpand={handleExpand}
isShowPath={isShowPath}
setPath={setPath}
isPathResponse={isPathResponse}
Expand Down
28 changes: 3 additions & 25 deletions app/components/graphView.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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 {
Expand All @@ -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
Expand All @@ -48,7 +47,7 @@ export default function GraphView({
setSelectedObjects,
setPosition,
onFetchNode,
deleteNeighbors,
handleExpand,
isShowPath,
setPath,
isPathResponse,
Expand Down Expand Up @@ -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 !== "")) {
Expand Down
Loading