mirror of
https://github.com/tiennm99/goclaw.git
synced 2026-10-11 12:18:59 +00:00
fix(ui): KG graph review fixes — edge colors, fetch limit, double fitView
- 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:
1 parent
88f4fa264a
commit
989e4f3123
2 files changed
+6
-5
No files matched your search
@@ -141,7 +141,7 @@ export function useKGGraph(agentId: string, userId?: string) {
|
||||
queryKey: queryKeys.kg.graph(agentId, userId),
|
||||
queryFn: async () => {
|
||||
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;
|
||||
return http.get<KGGraphData>(`/v1/agents/${agentId}/kg/graph`, params);
|
||||
},
|
||||
|
||||
@@ -179,9 +179,10 @@ function KGGraphViewInner({ entities: allEntities, relations: allRelations, onEn
|
||||
useEffect(() => {
|
||||
if (dataKey === layoutKey) {
|
||||
// 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) => {
|
||||
const fresh = rawNodes.find((r) => r.id === n.id);
|
||||
return fresh ? { ...n, data: fresh.data } : n;
|
||||
const data = freshMap.get(n.id);
|
||||
return data ? { ...n, data } : n;
|
||||
}));
|
||||
return;
|
||||
}
|
||||
@@ -207,7 +208,7 @@ function KGGraphViewInner({ entities: allEntities, relations: allRelations, onEn
|
||||
if (!selectedNodeId) {
|
||||
setEdges((eds) => eds.map((e) => ({
|
||||
...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,
|
||||
})));
|
||||
return;
|
||||
@@ -261,7 +262,7 @@ function KGGraphViewInner({ entities: allEntities, relations: allRelations, onEn
|
||||
onNodesChange={onNodesChange} onEdgesChange={onEdgesChange}
|
||||
onNodeClick={handleNodeClick} onPaneClick={handlePaneClick}
|
||||
nodeTypes={nodeTypes} colorMode={colorMode}
|
||||
fitView minZoom={0.1} maxZoom={3}
|
||||
minZoom={0.1} maxZoom={3}
|
||||
nodesConnectable={false} nodesDraggable={true} elementsSelectable={true}
|
||||
proOptions={{ hideAttribution: true }}
|
||||
>
|
||||
|
||||
Reference in new issue
Block a user