From cdd69845c92ce5d6198614e8cee66e814fc78a5d Mon Sep 17 00:00:00 2001 From: yangdx Date: Tue, 15 Apr 2025 13:04:51 +0800 Subject: [PATCH] Remove grapOperation.ts --- .../components/graph/EditablePropertyRow.tsx | 16 +++++-- lightrag_webui/src/stores/graph.ts | 44 +++++++++---------- lightrag_webui/src/utils/graphOperations.ts | 41 ----------------- 3 files changed, 35 insertions(+), 66 deletions(-) delete mode 100644 lightrag_webui/src/utils/graphOperations.ts diff --git a/lightrag_webui/src/components/graph/EditablePropertyRow.tsx b/lightrag_webui/src/components/graph/EditablePropertyRow.tsx index f5cfe64f..87fc4073 100644 --- a/lightrag_webui/src/components/graph/EditablePropertyRow.tsx +++ b/lightrag_webui/src/components/graph/EditablePropertyRow.tsx @@ -2,7 +2,7 @@ import { useState, useEffect } from 'react' import { useTranslation } from 'react-i18next' import { toast } from 'sonner' import { updateEntity, updateRelation, checkEntityNameExists } from '@/api/lightrag' -import { updateGraphNode, updateGraphEdge } from '@/utils/graphOperations' +import { useGraphStore } from '@/stores/graph' import { PropertyName, EditIcon, PropertyValue } from './PropertyRowComponents' import PropertyEditDialog from './PropertyEditDialog' @@ -85,12 +85,22 @@ const EditablePropertyRow = ({ } await updateEntity(entityId, updatedData, true) - await updateGraphNode(nodeId, entityId, name, value) + try { + await useGraphStore.getState().updateNodeAndSelect(nodeId, entityId, name, value) + } catch (error) { + console.error('Error updating node in graph:', error) + throw new Error('Failed to update node in graph') + } toast.success(t('graphPanel.propertiesView.success.entityUpdated')) } else if (entityType === 'edge' && sourceId && targetId && edgeId && dynamicId) { const updatedData = { [name]: value } await updateRelation(sourceId, targetId, updatedData) - await updateGraphEdge(edgeId, dynamicId, sourceId, targetId, name, value) + try { + await useGraphStore.getState().updateEdgeAndSelect(edgeId, dynamicId, sourceId, targetId, name, value) + } catch (error) { + console.error(`Error updating edge ${sourceId}->${targetId} in graph:`, error) + throw new Error('Failed to update edge in graph') + } toast.success(t('graphPanel.propertiesView.success.relationUpdated')) } diff --git a/lightrag_webui/src/stores/graph.ts b/lightrag_webui/src/stores/graph.ts index c4c6a285..fb035cb9 100644 --- a/lightrag_webui/src/stores/graph.ts +++ b/lightrag_webui/src/stores/graph.ts @@ -136,7 +136,7 @@ interface GraphState { // Version counter to trigger data refresh graphDataVersion: number incrementGraphDataVersion: () => void - + // Methods for updating graph elements and UI state together updateNodeAndSelect: (nodeId: string, entityId: string, propertyName: string, newValue: string) => Promise updateEdgeAndSelect: (edgeId: string, dynamicId: string, sourceId: string, targetId: string, propertyName: string, newValue: string) => Promise @@ -252,40 +252,40 @@ const useGraphStoreBase = create()((set, get) => ({ // Get current state const state = get() const { sigmaGraph, rawGraph } = state - + // Validate graph state if (!sigmaGraph || !rawGraph || !sigmaGraph.hasNode(nodeId)) { return } - + try { const nodeAttributes = sigmaGraph.getNodeAttributes(nodeId) - + console.log('updateNodeAndSelect', nodeId, entityId, propertyName, newValue) - + // For entity_id changes (node renaming) with NetworkX graph storage if ((nodeId === entityId) && (propertyName === 'entity_id')) { // Create new node with updated ID but same attributes sigmaGraph.addNode(newValue, { ...nodeAttributes, label: newValue }) - + const edgesToUpdate: EdgeToUpdate[] = [] - + // Process all edges connected to this node sigmaGraph.forEachEdge(nodeId, (edge, attributes, source, target) => { const otherNode = source === nodeId ? target : source const isOutgoing = source === nodeId - + // Get original edge dynamic ID for later reference const originalEdgeDynamicId = edge const edgeIndexInRawGraph = rawGraph.edgeDynamicIdMap[originalEdgeDynamicId] - + // Create new edge with updated node reference const newEdgeId = sigmaGraph.addEdge( isOutgoing ? newValue : otherNode, isOutgoing ? otherNode : newValue, attributes ) - + // Track edges that need updating in the raw graph if (edgeIndexInRawGraph !== undefined) { edgesToUpdate.push({ @@ -294,14 +294,14 @@ const useGraphStoreBase = create()((set, get) => ({ edgeIndex: edgeIndexInRawGraph }) } - + // Remove the old edge sigmaGraph.dropEdge(edge) }) - + // Remove the old node after all edges are processed sigmaGraph.dropNode(nodeId) - + // Update node reference in raw graph data const nodeIndex = rawGraph.nodeIdMap[nodeId] if (nodeIndex !== undefined) { @@ -311,7 +311,7 @@ const useGraphStoreBase = create()((set, get) => ({ delete rawGraph.nodeIdMap[nodeId] rawGraph.nodeIdMap[newValue] = nodeIndex } - + // Update all edge references in raw graph data edgesToUpdate.forEach(({ originalDynamicId, newEdgeId, edgeIndex }) => { if (rawGraph.edges[edgeIndex]) { @@ -322,14 +322,14 @@ const useGraphStoreBase = create()((set, get) => ({ if (rawGraph.edges[edgeIndex].target === nodeId) { rawGraph.edges[edgeIndex].target = newValue } - + // Update dynamic ID mappings rawGraph.edges[edgeIndex].dynamicId = newEdgeId delete rawGraph.edgeDynamicIdMap[originalDynamicId] rawGraph.edgeDynamicIdMap[newEdgeId] = edgeIndex } }) - + // Update selected node in store set({ selectedNode: newValue, moveToSelectedNode: true }) } else { @@ -342,7 +342,7 @@ const useGraphStoreBase = create()((set, get) => ({ sigmaGraph.setNodeAttribute(String(nodeId), 'label', newValue) } } - + // Trigger a re-render by incrementing the version counter set((state) => ({ graphDataVersion: state.graphDataVersion + 1 })) } @@ -351,17 +351,17 @@ const useGraphStoreBase = create()((set, get) => ({ throw new Error('Failed to update node in graph') } }, - + updateEdgeAndSelect: async (edgeId: string, dynamicId: string, sourceId: string, targetId: string, propertyName: string, newValue: string) => { // Get current state const state = get() const { sigmaGraph, rawGraph } = state - + // Validate graph state if (!sigmaGraph || !rawGraph) { return } - + try { const edgeIndex = rawGraph.edgeIdMap[String(edgeId)] if (edgeIndex !== undefined && rawGraph.edges[edgeIndex]) { @@ -370,10 +370,10 @@ const useGraphStoreBase = create()((set, get) => ({ sigmaGraph.setEdgeAttribute(dynamicId, 'label', newValue) } } - + // Trigger a re-render by incrementing the version counter set((state) => ({ graphDataVersion: state.graphDataVersion + 1 })) - + // Update selected edge in store to ensure UI reflects changes set({ selectedEdge: dynamicId }) } catch (error) { diff --git a/lightrag_webui/src/utils/graphOperations.ts b/lightrag_webui/src/utils/graphOperations.ts deleted file mode 100644 index 5bc9c5ba..00000000 --- a/lightrag_webui/src/utils/graphOperations.ts +++ /dev/null @@ -1,41 +0,0 @@ -import { useGraphStore } from '@/stores/graph' - -/** - * Update node in the graph visualization - * This function is now a wrapper around the store's updateNodeAndSelect method - * - * @param nodeId - ID of the node to update - * @param entityId - ID of the entity - * @param propertyName - Name of the property being updated - * @param newValue - New value for the property - */ -export const updateGraphNode = async (nodeId: string, entityId: string, propertyName: string, newValue: string) => { - try { - // Call the store method that handles both data update and UI state - await useGraphStore.getState().updateNodeAndSelect(nodeId, entityId, propertyName, newValue) - } catch (error) { - console.error('Error updating node in graph:', error) - throw new Error('Failed to update node in graph') - } -} - -/** - * Update edge in the graph visualization - * This function is now a wrapper around the store's updateEdgeAndSelect method - * - * @param edgeId - ID of the edge - * @param dynamicId - Dynamic ID of the edge in sigma graph - * @param sourceId - ID of the source node - * @param targetId - ID of the target node - * @param propertyName - Name of the property being updated - * @param newValue - New value for the property - */ -export const updateGraphEdge = async (edgeId: string, dynamicId: string, sourceId: string, targetId: string, propertyName: string, newValue: string) => { - try { - // Call the store method that handles both data update and UI state - await useGraphStore.getState().updateEdgeAndSelect(edgeId, dynamicId, sourceId, targetId, propertyName, newValue) - } catch (error) { - console.error(`Error updating edge ${sourceId}->${targetId} in graph:`, error) - throw new Error('Failed to update edge in graph') - } -}