yangdx
commited on
Commit
·
6b73e43
1
Parent(s):
64ebf4c
Remove useless tab visibility checks from graph components
Browse files
lightrag_webui/src/features/GraphViewer.tsx
CHANGED
@@ -1,5 +1,4 @@
|
|
1 |
import { useEffect, useState, useCallback, useMemo, useRef } from 'react'
|
2 |
-
import { useTabVisibility } from '@/contexts/useTabVisibility'
|
3 |
// import { MiniMap } from '@react-sigma/minimap'
|
4 |
import { SigmaContainer, useRegisterEvents, useSigma } from '@react-sigma/core'
|
5 |
import { Settings as SigmaSettings } from 'sigma/settings'
|
@@ -114,27 +113,15 @@ const GraphViewer = () => {
|
|
114 |
const moveToSelectedNode = useGraphStore.use.moveToSelectedNode()
|
115 |
const isFetching = useGraphStore.use.isFetching()
|
116 |
|
117 |
-
// Get tab visibility
|
118 |
-
const { isTabVisible } = useTabVisibility()
|
119 |
-
const isGraphTabVisible = isTabVisible('knowledge-graph')
|
120 |
-
|
121 |
const showPropertyPanel = useSettingsStore.use.showPropertyPanel()
|
122 |
const showNodeSearchBar = useSettingsStore.use.showNodeSearchBar()
|
123 |
const enableNodeDrag = useSettingsStore.use.enableNodeDrag()
|
124 |
|
125 |
-
// Handle component mount/unmount and tab visibility
|
126 |
-
useEffect(() => {
|
127 |
-
return () => {
|
128 |
-
// Only log, keep everything untouched
|
129 |
-
// This allows the WebGL context to persist across tab switches
|
130 |
-
console.log('GraphViewer is invisible, WebGL context is persisting')
|
131 |
-
}
|
132 |
-
}, [isGraphTabVisible])
|
133 |
-
|
134 |
// Initialize sigma settings once on component mount
|
135 |
// All dynamic settings will be updated in GraphControl using useSetSettings
|
136 |
useEffect(() => {
|
137 |
setSigmaSettings(defaultSigmaSettings)
|
|
|
138 |
}, [])
|
139 |
|
140 |
// Clean up sigma instance when component unmounts
|
|
|
1 |
import { useEffect, useState, useCallback, useMemo, useRef } from 'react'
|
|
|
2 |
// import { MiniMap } from '@react-sigma/minimap'
|
3 |
import { SigmaContainer, useRegisterEvents, useSigma } from '@react-sigma/core'
|
4 |
import { Settings as SigmaSettings } from 'sigma/settings'
|
|
|
113 |
const moveToSelectedNode = useGraphStore.use.moveToSelectedNode()
|
114 |
const isFetching = useGraphStore.use.isFetching()
|
115 |
|
|
|
|
|
|
|
|
|
116 |
const showPropertyPanel = useSettingsStore.use.showPropertyPanel()
|
117 |
const showNodeSearchBar = useSettingsStore.use.showNodeSearchBar()
|
118 |
const enableNodeDrag = useSettingsStore.use.enableNodeDrag()
|
119 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
120 |
// Initialize sigma settings once on component mount
|
121 |
// All dynamic settings will be updated in GraphControl using useSetSettings
|
122 |
useEffect(() => {
|
123 |
setSigmaSettings(defaultSigmaSettings)
|
124 |
+
console.log('Initialized sigma settings')
|
125 |
}, [])
|
126 |
|
127 |
// Clean up sigma instance when component unmounts
|
lightrag_webui/src/hooks/useLightragGraph.tsx
CHANGED
@@ -8,7 +8,6 @@ import { toast } from 'sonner'
|
|
8 |
import { queryGraphs } from '@/api/lightrag'
|
9 |
import { useBackendState } from '@/stores/state'
|
10 |
import { useSettingsStore } from '@/stores/settings'
|
11 |
-
import { useTabVisibility } from '@/contexts/useTabVisibility'
|
12 |
|
13 |
import seedrandom from 'seedrandom'
|
14 |
|
@@ -189,11 +188,7 @@ const useLightrangeGraph = () => {
|
|
189 |
const isFetching = useGraphStore.use.isFetching()
|
190 |
const nodeToExpand = useGraphStore.use.nodeToExpand()
|
191 |
const nodeToPrune = useGraphStore.use.nodeToPrune()
|
192 |
-
|
193 |
-
// Get tab visibility
|
194 |
-
const { isTabVisible } = useTabVisibility()
|
195 |
-
const isGraphTabVisible = isTabVisible('knowledge-graph')
|
196 |
-
|
197 |
// Track previous parameters to detect actual changes
|
198 |
const prevParamsRef = useRef({ queryLabel, maxQueryDepth, minDegree })
|
199 |
|
@@ -248,12 +243,6 @@ const useLightrangeGraph = () => {
|
|
248 |
if (!isFetching && !fetchInProgressRef.current &&
|
249 |
(paramsChanged || !useGraphStore.getState().graphDataFetchAttempted)) {
|
250 |
|
251 |
-
// Only fetch data if the Graph tab is visible and we haven't attempted a fetch yet
|
252 |
-
if (!isGraphTabVisible) {
|
253 |
-
console.log('Graph tab not visible, skipping data fetch');
|
254 |
-
return;
|
255 |
-
}
|
256 |
-
|
257 |
// Set flags
|
258 |
fetchInProgressRef.current = true
|
259 |
useGraphStore.getState().setGraphDataFetchAttempted(true)
|
@@ -316,15 +305,7 @@ const useLightrangeGraph = () => {
|
|
316 |
state.setGraphDataFetchAttempted(false)
|
317 |
})
|
318 |
}
|
319 |
-
}, [queryLabel, maxQueryDepth, minDegree, isFetching, paramsChanged,
|
320 |
-
|
321 |
-
// Update rendering state and handle tab visibility changes
|
322 |
-
useEffect(() => {
|
323 |
-
// When tab becomes visible
|
324 |
-
if (isGraphTabVisible) {
|
325 |
-
// We no longer reset the fetch attempted flag here to prevent continuous API calls
|
326 |
-
}
|
327 |
-
}, [isGraphTabVisible, rawGraph])
|
328 |
|
329 |
// Handle node expansion
|
330 |
useEffect(() => {
|
|
|
8 |
import { queryGraphs } from '@/api/lightrag'
|
9 |
import { useBackendState } from '@/stores/state'
|
10 |
import { useSettingsStore } from '@/stores/settings'
|
|
|
11 |
|
12 |
import seedrandom from 'seedrandom'
|
13 |
|
|
|
188 |
const isFetching = useGraphStore.use.isFetching()
|
189 |
const nodeToExpand = useGraphStore.use.nodeToExpand()
|
190 |
const nodeToPrune = useGraphStore.use.nodeToPrune()
|
191 |
+
|
|
|
|
|
|
|
|
|
192 |
// Track previous parameters to detect actual changes
|
193 |
const prevParamsRef = useRef({ queryLabel, maxQueryDepth, minDegree })
|
194 |
|
|
|
243 |
if (!isFetching && !fetchInProgressRef.current &&
|
244 |
(paramsChanged || !useGraphStore.getState().graphDataFetchAttempted)) {
|
245 |
|
|
|
|
|
|
|
|
|
|
|
|
|
246 |
// Set flags
|
247 |
fetchInProgressRef.current = true
|
248 |
useGraphStore.getState().setGraphDataFetchAttempted(true)
|
|
|
305 |
state.setGraphDataFetchAttempted(false)
|
306 |
})
|
307 |
}
|
308 |
+
}, [queryLabel, maxQueryDepth, minDegree, isFetching, paramsChanged, rawGraph, sigmaGraph])
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
309 |
|
310 |
// Handle node expansion
|
311 |
useEffect(() => {
|