tiennm99/goclaw
1
0 Fork 0
mirror of https://github.com/tiennm99/goclaw.git synced 2026-10-15 00:17:27 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(ui): KG graph review fixes — edge colors, fetch limit, double fitView

Browse Source 
- Fix hardcoded dark edge color on deselect — use neutral #64748b
- Reduce graph fetch limit 200→50 to match component render cap
- Fix O(n*m) node lookup on theme change — use Map for O(1)
- Remove double fitView (prop + manual call)
This commit is contained in:
viettranx committed 2026-03-30 16:53:14 +07:00
1 parent 88f4fa264a
commit 989e4f3123
2 files changed
+6 -5
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

ui/web/src/pages/memory/hooks/use-knowledge-graph.ts
+1 -1
View File
@@ -141,7 +141,7 @@ export function useKGGraph(agentId: string, userId?: string) {
queryKey: queryKeys.kg.graph(agentId, userId), queryKey: queryKeys.kg.graph(agentId, userId),
queryFn: async () => { queryFn: async () => {
if (!agentId) return { entities: [], relations: [] }; if (!agentId) return { entities: [], relations: [] };
const params: Record<string, string> = { limit: "200" }; const params: Record<string, string> = { limit: "50" };
if (userId) params.user_id = userId; if (userId) params.user_id = userId;
return http.get<KGGraphData>(`/v1/agents/${agentId}/kg/graph`, params); return http.get<KGGraphData>(`/v1/agents/${agentId}/kg/graph`, params);
}, },
ui/web/src/pages/memory/kg-graph-view.tsx
+5 -4
View File
@@ -179,9 +179,10 @@ function KGGraphViewInner({ entities: allEntities, relations: allRelations, onEn
useEffect(() => { useEffect(() => {
if (dataKey === layoutKey) { if (dataKey === layoutKey) {
// Theme change only — update node colors without re-layout // Theme change only — update node colors without re-layout
const freshMap = new Map(rawNodes.map((r) => [r.id, r.data]));
setNodes((prev) => prev.map((n) => { setNodes((prev) => prev.map((n) => {
const fresh = rawNodes.find((r) => r.id === n.id); const data = freshMap.get(n.id);
return fresh ? { ...n, data: fresh.data } : n; return data ? { ...n, data } : n;
})); }));
return; return;
} }
@@ -207,7 +208,7 @@ function KGGraphViewInner({ entities: allEntities, relations: allRelations, onEn
if (!selectedNodeId) { if (!selectedNodeId) {
setEdges((eds) => eds.map((e) => ({ setEdges((eds) => eds.map((e) => ({
...e, label: undefined, animated: false, ...e, label: undefined, animated: false,
style: { stroke: "#334155", strokeWidth: 1, opacity: 0.4 }, style: { stroke: "#64748b", strokeWidth: 2, opacity: 0.6 },
labelStyle: undefined, labelBgStyle: undefined, labelBgPadding: undefined, labelShowBg: undefined, labelStyle: undefined, labelBgStyle: undefined, labelBgPadding: undefined, labelShowBg: undefined,
}))); })));
return; return;
@@ -261,7 +262,7 @@ function KGGraphViewInner({ entities: allEntities, relations: allRelations, onEn
onNodesChange={onNodesChange} onEdgesChange={onEdgesChange} onNodesChange={onNodesChange} onEdgesChange={onEdgesChange}
onNodeClick={handleNodeClick} onPaneClick={handlePaneClick} onNodeClick={handleNodeClick} onPaneClick={handlePaneClick}
nodeTypes={nodeTypes} colorMode={colorMode} nodeTypes={nodeTypes} colorMode={colorMode}
fitView minZoom={0.1} maxZoom={3} minZoom={0.1} maxZoom={3}
nodesConnectable={false} nodesDraggable={true} elementsSelectable={true} nodesConnectable={false} nodesDraggable={true} elementsSelectable={true}
proOptions={{ hideAttribution: true }} proOptions={{ hideAttribution: true }}
> >