Merge pull request #1374 from danielaskdd/fix-neo4j-graph-edit
Fix Neo4j node and edge edit problem
This commit is contained in:
@@ -1 +1 @@
|
|||||||
__api_version__ = "0150"
|
__api_version__ = "0151"
|
||||||
|
File diff suppressed because one or more lines are too long
2
lightrag/api/webui/index.html
generated
2
lightrag/api/webui/index.html
generated
@@ -8,7 +8,7 @@
|
|||||||
<link rel="icon" type="image/svg+xml" href="logo.png" />
|
<link rel="icon" type="image/svg+xml" href="logo.png" />
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
<title>Lightrag</title>
|
<title>Lightrag</title>
|
||||||
<script type="module" crossorigin src="/webui/assets/index-1fU28mRC.js"></script>
|
<script type="module" crossorigin src="/webui/assets/index-CK7D4HV6.js"></script>
|
||||||
<link rel="stylesheet" crossorigin href="/webui/assets/index-BJDb04H1.css">
|
<link rel="stylesheet" crossorigin href="/webui/assets/index-BJDb04H1.css">
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
@@ -2,7 +2,7 @@ import { useState, useEffect } from 'react'
|
|||||||
import { useTranslation } from 'react-i18next'
|
import { useTranslation } from 'react-i18next'
|
||||||
import { toast } from 'sonner'
|
import { toast } from 'sonner'
|
||||||
import { updateEntity, updateRelation, checkEntityNameExists } from '@/api/lightrag'
|
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 { PropertyName, EditIcon, PropertyValue } from './PropertyRowComponents'
|
||||||
import PropertyEditDialog from './PropertyEditDialog'
|
import PropertyEditDialog from './PropertyEditDialog'
|
||||||
|
|
||||||
@@ -13,7 +13,10 @@ interface EditablePropertyRowProps {
|
|||||||
name: string // Property name to display and edit
|
name: string // Property name to display and edit
|
||||||
value: any // Initial value of the property
|
value: any // Initial value of the property
|
||||||
onClick?: () => void // Optional click handler for the property value
|
onClick?: () => void // Optional click handler for the property value
|
||||||
|
nodeId?: string // ID of the node (for node type)
|
||||||
entityId?: string // ID of the entity (for node type)
|
entityId?: string // ID of the entity (for node type)
|
||||||
|
edgeId?: string // ID of the edge (for edge type)
|
||||||
|
dynamicId?: string
|
||||||
entityType?: 'node' | 'edge' // Type of graph entity
|
entityType?: 'node' | 'edge' // Type of graph entity
|
||||||
sourceId?: string // Source node ID (for edge type)
|
sourceId?: string // Source node ID (for edge type)
|
||||||
targetId?: string // Target node ID (for edge type)
|
targetId?: string // Target node ID (for edge type)
|
||||||
@@ -30,7 +33,10 @@ const EditablePropertyRow = ({
|
|||||||
name,
|
name,
|
||||||
value: initialValue,
|
value: initialValue,
|
||||||
onClick,
|
onClick,
|
||||||
|
nodeId,
|
||||||
|
edgeId,
|
||||||
entityId,
|
entityId,
|
||||||
|
dynamicId,
|
||||||
entityType,
|
entityType,
|
||||||
sourceId,
|
sourceId,
|
||||||
targetId,
|
targetId,
|
||||||
@@ -66,7 +72,7 @@ const EditablePropertyRow = ({
|
|||||||
setIsSubmitting(true)
|
setIsSubmitting(true)
|
||||||
|
|
||||||
try {
|
try {
|
||||||
if (entityType === 'node' && entityId) {
|
if (entityType === 'node' && entityId && nodeId) {
|
||||||
let updatedData = { [name]: value }
|
let updatedData = { [name]: value }
|
||||||
|
|
||||||
if (name === 'entity_id') {
|
if (name === 'entity_id') {
|
||||||
@@ -79,12 +85,22 @@ const EditablePropertyRow = ({
|
|||||||
}
|
}
|
||||||
|
|
||||||
await updateEntity(entityId, updatedData, true)
|
await updateEntity(entityId, updatedData, true)
|
||||||
await updateGraphNode(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'))
|
toast.success(t('graphPanel.propertiesView.success.entityUpdated'))
|
||||||
} else if (entityType === 'edge' && sourceId && targetId) {
|
} else if (entityType === 'edge' && sourceId && targetId && edgeId && dynamicId) {
|
||||||
const updatedData = { [name]: value }
|
const updatedData = { [name]: value }
|
||||||
await updateRelation(sourceId, targetId, updatedData)
|
await updateRelation(sourceId, targetId, updatedData)
|
||||||
await updateGraphEdge(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'))
|
toast.success(t('graphPanel.propertiesView.success.relationUpdated'))
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@@ -16,10 +16,12 @@ const PropertiesView = () => {
|
|||||||
const focusedNode = useGraphStore.use.focusedNode()
|
const focusedNode = useGraphStore.use.focusedNode()
|
||||||
const selectedEdge = useGraphStore.use.selectedEdge()
|
const selectedEdge = useGraphStore.use.selectedEdge()
|
||||||
const focusedEdge = useGraphStore.use.focusedEdge()
|
const focusedEdge = useGraphStore.use.focusedEdge()
|
||||||
|
const graphDataVersion = useGraphStore.use.graphDataVersion()
|
||||||
|
|
||||||
const [currentElement, setCurrentElement] = useState<NodeType | EdgeType | null>(null)
|
const [currentElement, setCurrentElement] = useState<NodeType | EdgeType | null>(null)
|
||||||
const [currentType, setCurrentType] = useState<'node' | 'edge' | null>(null)
|
const [currentType, setCurrentType] = useState<'node' | 'edge' | null>(null)
|
||||||
|
|
||||||
|
// This effect will run when selection changes or when graph data is updated
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
let type: 'node' | 'edge' | null = null
|
let type: 'node' | 'edge' | null = null
|
||||||
let element: RawNodeType | RawEdgeType | null = null
|
let element: RawNodeType | RawEdgeType | null = null
|
||||||
@@ -53,6 +55,7 @@ const PropertiesView = () => {
|
|||||||
selectedNode,
|
selectedNode,
|
||||||
focusedEdge,
|
focusedEdge,
|
||||||
selectedEdge,
|
selectedEdge,
|
||||||
|
graphDataVersion, // Add dependency on graphDataVersion to refresh when data changes
|
||||||
setCurrentElement,
|
setCurrentElement,
|
||||||
setCurrentType,
|
setCurrentType,
|
||||||
getNode,
|
getNode,
|
||||||
@@ -93,6 +96,7 @@ const refineNodeProperties = (node: RawNodeType): NodeType => {
|
|||||||
if (state.sigmaGraph && state.rawGraph) {
|
if (state.sigmaGraph && state.rawGraph) {
|
||||||
try {
|
try {
|
||||||
if (!state.sigmaGraph.hasNode(node.id)) {
|
if (!state.sigmaGraph.hasNode(node.id)) {
|
||||||
|
console.warn('Node not found in sigmaGraph:', node.id)
|
||||||
return {
|
return {
|
||||||
...node,
|
...node,
|
||||||
relationships: []
|
relationships: []
|
||||||
@@ -139,7 +143,8 @@ const refineEdgeProperties = (edge: RawEdgeType): EdgeType => {
|
|||||||
|
|
||||||
if (state.sigmaGraph && state.rawGraph) {
|
if (state.sigmaGraph && state.rawGraph) {
|
||||||
try {
|
try {
|
||||||
if (!state.sigmaGraph.hasEdge(edge.id)) {
|
if (!state.sigmaGraph.hasEdge(edge.dynamicId)) {
|
||||||
|
console.warn('Edge not found in sigmaGraph:', edge.id, 'dynamicId:', edge.dynamicId)
|
||||||
return {
|
return {
|
||||||
...edge,
|
...edge,
|
||||||
sourceNode: undefined,
|
sourceNode: undefined,
|
||||||
@@ -171,6 +176,9 @@ const PropertyRow = ({
|
|||||||
value,
|
value,
|
||||||
onClick,
|
onClick,
|
||||||
tooltip,
|
tooltip,
|
||||||
|
nodeId,
|
||||||
|
edgeId,
|
||||||
|
dynamicId,
|
||||||
entityId,
|
entityId,
|
||||||
entityType,
|
entityType,
|
||||||
sourceId,
|
sourceId,
|
||||||
@@ -181,7 +189,10 @@ const PropertyRow = ({
|
|||||||
value: any
|
value: any
|
||||||
onClick?: () => void
|
onClick?: () => void
|
||||||
tooltip?: string
|
tooltip?: string
|
||||||
|
nodeId?: string
|
||||||
entityId?: string
|
entityId?: string
|
||||||
|
edgeId?: string
|
||||||
|
dynamicId?: string
|
||||||
entityType?: 'node' | 'edge'
|
entityType?: 'node' | 'edge'
|
||||||
sourceId?: string
|
sourceId?: string
|
||||||
targetId?: string
|
targetId?: string
|
||||||
@@ -202,7 +213,10 @@ const PropertyRow = ({
|
|||||||
name={name}
|
name={name}
|
||||||
value={value}
|
value={value}
|
||||||
onClick={onClick}
|
onClick={onClick}
|
||||||
|
nodeId={nodeId}
|
||||||
entityId={entityId}
|
entityId={entityId}
|
||||||
|
edgeId={edgeId}
|
||||||
|
dynamicId={dynamicId}
|
||||||
entityType={entityType}
|
entityType={entityType}
|
||||||
sourceId={sourceId}
|
sourceId={sourceId}
|
||||||
targetId={targetId}
|
targetId={targetId}
|
||||||
@@ -265,7 +279,7 @@ const NodePropertiesView = ({ node }: { node: NodeType }) => {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className="bg-primary/5 max-h-96 overflow-auto rounded p-1">
|
<div className="bg-primary/5 max-h-96 overflow-auto rounded p-1">
|
||||||
<PropertyRow name={t('graphPanel.propertiesView.node.id')} value={node.id} />
|
<PropertyRow name={t('graphPanel.propertiesView.node.id')} value={String(node.id)} />
|
||||||
<PropertyRow
|
<PropertyRow
|
||||||
name={t('graphPanel.propertiesView.node.labels')}
|
name={t('graphPanel.propertiesView.node.labels')}
|
||||||
value={node.labels.join(', ')}
|
value={node.labels.join(', ')}
|
||||||
@@ -285,7 +299,8 @@ const NodePropertiesView = ({ node }: { node: NodeType }) => {
|
|||||||
key={name}
|
key={name}
|
||||||
name={name}
|
name={name}
|
||||||
value={node.properties[name]}
|
value={node.properties[name]}
|
||||||
entityId={node.properties['entity_id'] || node.id}
|
nodeId={String(node.id)}
|
||||||
|
entityId={node.properties['entity_id']}
|
||||||
entityType="node"
|
entityType="node"
|
||||||
isEditable={name === 'description' || name === 'entity_id'}
|
isEditable={name === 'description' || name === 'entity_id'}
|
||||||
/>
|
/>
|
||||||
@@ -350,10 +365,11 @@ const EdgePropertiesView = ({ edge }: { edge: EdgeType }) => {
|
|||||||
key={name}
|
key={name}
|
||||||
name={name}
|
name={name}
|
||||||
value={edge.properties[name]}
|
value={edge.properties[name]}
|
||||||
entityId={edge.id}
|
edgeId={String(edge.id)}
|
||||||
|
dynamicId={String(edge.dynamicId)}
|
||||||
entityType="edge"
|
entityType="edge"
|
||||||
sourceId={edge.source}
|
sourceId={edge.sourceNode?.properties['entity_id'] || edge.source}
|
||||||
targetId={edge.target}
|
targetId={edge.targetNode?.properties['entity_id'] || edge.target}
|
||||||
isEditable={name === 'description' || name === 'keywords'}
|
isEditable={name === 'description' || name === 'keywords'}
|
||||||
/>
|
/>
|
||||||
)
|
)
|
||||||
|
@@ -5,6 +5,8 @@ import { getGraphLabels } from '@/api/lightrag'
|
|||||||
import MiniSearch from 'minisearch'
|
import MiniSearch from 'minisearch'
|
||||||
|
|
||||||
export type RawNodeType = {
|
export type RawNodeType = {
|
||||||
|
// for NetworkX: id is identical to properties['entity_id']
|
||||||
|
// for Neo4j: id is unique identifier for each node
|
||||||
id: string
|
id: string
|
||||||
labels: string[]
|
labels: string[]
|
||||||
properties: Record<string, any>
|
properties: Record<string, any>
|
||||||
@@ -18,20 +20,34 @@ export type RawNodeType = {
|
|||||||
}
|
}
|
||||||
|
|
||||||
export type RawEdgeType = {
|
export type RawEdgeType = {
|
||||||
|
// for NetworkX: id is "source-target"
|
||||||
|
// for Neo4j: id is unique identifier for each edge
|
||||||
id: string
|
id: string
|
||||||
source: string
|
source: string
|
||||||
target: string
|
target: string
|
||||||
type?: string
|
type?: string
|
||||||
properties: Record<string, any>
|
properties: Record<string, any>
|
||||||
|
// dynamicId: key for sigmaGraph
|
||||||
dynamicId: string
|
dynamicId: string
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Interface for tracking edges that need updating when a node ID changes
|
||||||
|
*/
|
||||||
|
interface EdgeToUpdate {
|
||||||
|
originalDynamicId: string
|
||||||
|
newEdgeId: string
|
||||||
|
edgeIndex: number
|
||||||
|
}
|
||||||
|
|
||||||
export class RawGraph {
|
export class RawGraph {
|
||||||
nodes: RawNodeType[] = []
|
nodes: RawNodeType[] = []
|
||||||
edges: RawEdgeType[] = []
|
edges: RawEdgeType[] = []
|
||||||
|
// nodeIDMap: map node id to index in nodes array (SigmaGraph has nodeId as key)
|
||||||
nodeIdMap: Record<string, number> = {}
|
nodeIdMap: Record<string, number> = {}
|
||||||
|
// edgeIDMap: map edge id to index in edges array (SigmaGraph not use id as key)
|
||||||
edgeIdMap: Record<string, number> = {}
|
edgeIdMap: Record<string, number> = {}
|
||||||
|
// edgeDynamicIdMap: map edge dynamic id to index in edges array (SigmaGraph has DynamicId as key)
|
||||||
edgeDynamicIdMap: Record<string, number> = {}
|
edgeDynamicIdMap: Record<string, number> = {}
|
||||||
|
|
||||||
getNode = (nodeId: string) => {
|
getNode = (nodeId: string) => {
|
||||||
@@ -120,9 +136,13 @@ interface GraphState {
|
|||||||
// Version counter to trigger data refresh
|
// Version counter to trigger data refresh
|
||||||
graphDataVersion: number
|
graphDataVersion: number
|
||||||
incrementGraphDataVersion: () => void
|
incrementGraphDataVersion: () => void
|
||||||
|
|
||||||
|
// Methods for updating graph elements and UI state together
|
||||||
|
updateNodeAndSelect: (nodeId: string, entityId: string, propertyName: string, newValue: string) => Promise<void>
|
||||||
|
updateEdgeAndSelect: (edgeId: string, dynamicId: string, sourceId: string, targetId: string, propertyName: string, newValue: string) => Promise<void>
|
||||||
}
|
}
|
||||||
|
|
||||||
const useGraphStoreBase = create<GraphState>()((set) => ({
|
const useGraphStoreBase = create<GraphState>()((set, get) => ({
|
||||||
selectedNode: null,
|
selectedNode: null,
|
||||||
focusedNode: null,
|
focusedNode: null,
|
||||||
selectedEdge: null,
|
selectedEdge: null,
|
||||||
@@ -227,6 +247,140 @@ const useGraphStoreBase = create<GraphState>()((set) => ({
|
|||||||
graphDataVersion: 0,
|
graphDataVersion: 0,
|
||||||
incrementGraphDataVersion: () => set((state) => ({ graphDataVersion: state.graphDataVersion + 1 })),
|
incrementGraphDataVersion: () => set((state) => ({ graphDataVersion: state.graphDataVersion + 1 })),
|
||||||
|
|
||||||
|
// Methods for updating graph elements and UI state together
|
||||||
|
updateNodeAndSelect: async (nodeId: string, entityId: string, propertyName: string, newValue: string) => {
|
||||||
|
// 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({
|
||||||
|
originalDynamicId: originalEdgeDynamicId,
|
||||||
|
newEdgeId: newEdgeId,
|
||||||
|
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) {
|
||||||
|
rawGraph.nodes[nodeIndex].id = newValue
|
||||||
|
rawGraph.nodes[nodeIndex].labels = [newValue]
|
||||||
|
rawGraph.nodes[nodeIndex].properties.entity_id = newValue
|
||||||
|
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]) {
|
||||||
|
// Update source/target references
|
||||||
|
if (rawGraph.edges[edgeIndex].source === nodeId) {
|
||||||
|
rawGraph.edges[edgeIndex].source = newValue
|
||||||
|
}
|
||||||
|
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 {
|
||||||
|
// For non-NetworkX nodes or non-entity_id changes
|
||||||
|
const nodeIndex = rawGraph.nodeIdMap[String(nodeId)]
|
||||||
|
if (nodeIndex !== undefined) {
|
||||||
|
rawGraph.nodes[nodeIndex].properties[propertyName] = newValue
|
||||||
|
if (propertyName === 'entity_id') {
|
||||||
|
rawGraph.nodes[nodeIndex].labels = [newValue]
|
||||||
|
sigmaGraph.setNodeAttribute(String(nodeId), 'label', newValue)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Trigger a re-render by incrementing the version counter
|
||||||
|
set((state) => ({ graphDataVersion: state.graphDataVersion + 1 }))
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
console.error('Error updating node in graph:', error)
|
||||||
|
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]) {
|
||||||
|
rawGraph.edges[edgeIndex].properties[propertyName] = newValue
|
||||||
|
if(dynamicId !== undefined && propertyName === 'keywords') {
|
||||||
|
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) {
|
||||||
|
console.error(`Error updating edge ${sourceId}->${targetId} in graph:`, error)
|
||||||
|
throw new Error('Failed to update edge in graph')
|
||||||
|
}
|
||||||
|
}
|
||||||
}))
|
}))
|
||||||
|
|
||||||
const useGraphStore = createSelectors(useGraphStoreBase)
|
const useGraphStore = createSelectors(useGraphStoreBase)
|
||||||
|
@@ -1,175 +0,0 @@
|
|||||||
import { useGraphStore } from '@/stores/graph'
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Interface for tracking edges that need updating when a node ID changes
|
|
||||||
*/
|
|
||||||
interface EdgeToUpdate {
|
|
||||||
originalDynamicId: string
|
|
||||||
newEdgeId: string
|
|
||||||
edgeIndex: number
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Update node in the graph visualization
|
|
||||||
* Handles both property updates and entity ID changes
|
|
||||||
*
|
|
||||||
* @param nodeId - ID of the node to update
|
|
||||||
* @param propertyName - Name of the property being updated
|
|
||||||
* @param newValue - New value for the property
|
|
||||||
*/
|
|
||||||
export const updateGraphNode = async (nodeId: string, propertyName: string, newValue: string) => {
|
|
||||||
// Get graph state from store
|
|
||||||
const sigmaGraph = useGraphStore.getState().sigmaGraph
|
|
||||||
const rawGraph = useGraphStore.getState().rawGraph
|
|
||||||
|
|
||||||
// Validate graph state
|
|
||||||
if (!sigmaGraph || !rawGraph || !sigmaGraph.hasNode(String(nodeId))) {
|
|
||||||
return
|
|
||||||
}
|
|
||||||
|
|
||||||
try {
|
|
||||||
const nodeAttributes = sigmaGraph.getNodeAttributes(String(nodeId))
|
|
||||||
|
|
||||||
// Special handling for entity_id changes (node renaming)
|
|
||||||
if (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(String(nodeId), (edge, attributes, source, target) => {
|
|
||||||
const otherNode = source === String(nodeId) ? target : source
|
|
||||||
const isOutgoing = source === String(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({
|
|
||||||
originalDynamicId: originalEdgeDynamicId,
|
|
||||||
newEdgeId: newEdgeId,
|
|
||||||
edgeIndex: edgeIndexInRawGraph
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
// Remove the old edge
|
|
||||||
sigmaGraph.dropEdge(edge)
|
|
||||||
})
|
|
||||||
|
|
||||||
// Remove the old node after all edges are processed
|
|
||||||
sigmaGraph.dropNode(String(nodeId))
|
|
||||||
|
|
||||||
// Update node reference in raw graph data
|
|
||||||
const nodeIndex = rawGraph.nodeIdMap[String(nodeId)]
|
|
||||||
if (nodeIndex !== undefined) {
|
|
||||||
rawGraph.nodes[nodeIndex].id = newValue
|
|
||||||
rawGraph.nodes[nodeIndex].properties.entity_id = newValue
|
|
||||||
delete rawGraph.nodeIdMap[String(nodeId)]
|
|
||||||
rawGraph.nodeIdMap[newValue] = nodeIndex
|
|
||||||
}
|
|
||||||
|
|
||||||
// Update all edge references in raw graph data
|
|
||||||
edgesToUpdate.forEach(({ originalDynamicId, newEdgeId, edgeIndex }) => {
|
|
||||||
if (rawGraph.edges[edgeIndex]) {
|
|
||||||
// Update source/target references
|
|
||||||
if (rawGraph.edges[edgeIndex].source === String(nodeId)) {
|
|
||||||
rawGraph.edges[edgeIndex].source = newValue
|
|
||||||
}
|
|
||||||
if (rawGraph.edges[edgeIndex].target === String(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
|
|
||||||
useGraphStore.getState().setSelectedNode(newValue)
|
|
||||||
} else {
|
|
||||||
// For other properties, just update the property in raw graph
|
|
||||||
const nodeIndex = rawGraph.nodeIdMap[String(nodeId)]
|
|
||||||
if (nodeIndex !== undefined) {
|
|
||||||
rawGraph.nodes[nodeIndex].properties[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
|
|
||||||
*
|
|
||||||
* @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 (sourceId: string, targetId: string, propertyName: string, newValue: string) => {
|
|
||||||
// Get graph state from store
|
|
||||||
const sigmaGraph = useGraphStore.getState().sigmaGraph
|
|
||||||
const rawGraph = useGraphStore.getState().rawGraph
|
|
||||||
|
|
||||||
// Validate graph state
|
|
||||||
if (!sigmaGraph || !rawGraph) {
|
|
||||||
return
|
|
||||||
}
|
|
||||||
|
|
||||||
try {
|
|
||||||
// Find the edge between source and target nodes
|
|
||||||
const allEdges = sigmaGraph.edges()
|
|
||||||
let keyToUse = null
|
|
||||||
|
|
||||||
for (const edge of allEdges) {
|
|
||||||
const edgeSource = sigmaGraph.source(edge)
|
|
||||||
const edgeTarget = sigmaGraph.target(edge)
|
|
||||||
|
|
||||||
// Match edge in either direction (undirected graph support)
|
|
||||||
if ((edgeSource === sourceId && edgeTarget === targetId) ||
|
|
||||||
(edgeSource === targetId && edgeTarget === sourceId)) {
|
|
||||||
keyToUse = edge
|
|
||||||
break
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
if (keyToUse !== null) {
|
|
||||||
// Special handling for keywords property (updates edge label)
|
|
||||||
if(propertyName === 'keywords') {
|
|
||||||
sigmaGraph.setEdgeAttribute(keyToUse, 'label', newValue)
|
|
||||||
} else {
|
|
||||||
sigmaGraph.setEdgeAttribute(keyToUse, propertyName, newValue)
|
|
||||||
}
|
|
||||||
|
|
||||||
// Update edge in raw graph data using dynamic ID mapping
|
|
||||||
if (keyToUse && rawGraph.edgeDynamicIdMap[keyToUse] !== undefined) {
|
|
||||||
const edgeIndex = rawGraph.edgeDynamicIdMap[keyToUse]
|
|
||||||
if (rawGraph.edges[edgeIndex]) {
|
|
||||||
rawGraph.edges[edgeIndex].properties[propertyName] = newValue
|
|
||||||
}
|
|
||||||
} else if (keyToUse !== null) {
|
|
||||||
// Fallback: try to find edge by key in edge ID map
|
|
||||||
const edgeIndexByKey = rawGraph.edgeIdMap[keyToUse]
|
|
||||||
if (edgeIndexByKey !== undefined && rawGraph.edges[edgeIndexByKey]) {
|
|
||||||
rawGraph.edges[edgeIndexByKey].properties[propertyName] = newValue
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
} catch (error) {
|
|
||||||
console.error(`Error updating edge ${sourceId}->${targetId} in graph:`, error)
|
|
||||||
throw new Error('Failed to update edge in graph')
|
|
||||||
}
|
|
||||||
}
|
|
Reference in New Issue
Block a user