diff --git a/apps/x/apps/renderer/src/components/graph-view.tsx b/apps/x/apps/renderer/src/components/graph-view.tsx index e7fbefda..049e96ff 100644 --- a/apps/x/apps/renderer/src/components/graph-view.tsx +++ b/apps/x/apps/renderer/src/components/graph-view.tsx @@ -437,14 +437,20 @@ export function GraphView({ nodes, edges, isLoading, error, onSelectNode }: Grap const searchMatchingNodes = useMemo(() => { if (!searchQuery.trim()) return null const query = searchQuery.toLowerCase() - const set = new Set() + const directMatches = new Set() nodes.forEach((node) => { if (node.label.toLowerCase().includes(query) || node.id.toLowerCase().includes(query)) { - set.add(node.id) + directMatches.add(node.id) } }) - return set - }, [searchQuery, nodes]) + // Include immediate connections of matching nodes + const withConnections = new Set(directMatches) + edgeList.forEach((edge) => { + if (directMatches.has(edge.source)) withConnections.add(edge.target) + if (directMatches.has(edge.target)) withConnections.add(edge.source) + }) + return { matches: withConnections, directMatches } + }, [searchQuery, nodes, edgeList]) return (
@@ -530,7 +536,7 @@ export function GraphView({ nodes, edges, isLoading, error, onSelectNode }: Grap ? edge.source === activeNodeId || edge.target === activeNodeId : false const isSearchEdge = searchMatchingNodes - ? searchMatchingNodes.has(edge.source) && searchMatchingNodes.has(edge.target) + ? searchMatchingNodes.matches.has(edge.source) && searchMatchingNodes.matches.has(edge.target) : false let strokeOpacity = 0.4 let strokeWidth = 1 @@ -564,11 +570,18 @@ export function GraphView({ nodes, edges, isLoading, error, onSelectNode }: Grap const pos = displayPositions.get(node.id) if (!pos) return null const isConnected = connectedNodes ? connectedNodes.has(node.id) : true - const isSearchMatch = searchMatchingNodes ? searchMatchingNodes.has(node.id) : true - const isPrimary = activeNodeId === node.id || (searchMatchingNodes && isSearchMatch) + const isSearchMatch = searchMatchingNodes ? searchMatchingNodes.matches.has(node.id) : true + const isDirectMatch = searchMatchingNodes ? searchMatchingNodes.directMatches.has(node.id) : false + const isPrimary = activeNodeId === node.id || isDirectMatch let nodeOpacity = 1 if (searchMatchingNodes) { - nodeOpacity = isSearchMatch ? 1 : 0.15 + if (isDirectMatch) { + nodeOpacity = 1 + } else if (isSearchMatch) { + nodeOpacity = 0.5 + } else { + nodeOpacity = 0.1 + } } else if (activeNodeId) { nodeOpacity = isConnected ? 1 : 0.3 } @@ -593,10 +606,10 @@ export function GraphView({ nodes, edges, isLoading, error, onSelectNode }: Grap {searchMatchingNodes && ( - {searchMatchingNodes.size} + {searchMatchingNodes.directMatches.size} )} {searchQuery && (