cherry-pick 4c3ab584
This commit is contained in:
parent
db916b6098
commit
3c99bf455e
1 changed files with 3 additions and 84 deletions
|
|
@ -1,8 +1,7 @@
|
||||||
import { useCallback, useEffect, useState, useRef } from 'react'
|
import { useCallback, useEffect, useState } from 'react'
|
||||||
import { AsyncSelect } from '@/components/ui/AsyncSelect'
|
import { AsyncSelect } from '@/components/ui/AsyncSelect'
|
||||||
import { useSettingsStore } from '@/stores/settings'
|
import { useSettingsStore } from '@/stores/settings'
|
||||||
import { useGraphStore } from '@/stores/graph'
|
import { useGraphStore } from '@/stores/graph'
|
||||||
import { useBackendState } from '@/stores/state'
|
|
||||||
import {
|
import {
|
||||||
dropdownDisplayLimit,
|
dropdownDisplayLimit,
|
||||||
controlButtonVariant,
|
controlButtonVariant,
|
||||||
|
|
@ -18,16 +17,10 @@ import { getPopularLabels, searchLabels } from '@/api/lightrag'
|
||||||
const GraphLabels = () => {
|
const GraphLabels = () => {
|
||||||
const { t } = useTranslation()
|
const { t } = useTranslation()
|
||||||
const label = useSettingsStore.use.queryLabel()
|
const label = useSettingsStore.use.queryLabel()
|
||||||
const dropdownRefreshTrigger = useSettingsStore.use.searchLabelDropdownRefreshTrigger()
|
|
||||||
const [isRefreshing, setIsRefreshing] = useState(false)
|
const [isRefreshing, setIsRefreshing] = useState(false)
|
||||||
const [refreshTrigger, setRefreshTrigger] = useState(0)
|
const [refreshTrigger, setRefreshTrigger] = useState(0)
|
||||||
const [selectKey, setSelectKey] = useState(0)
|
const [selectKey, setSelectKey] = useState(0)
|
||||||
|
|
||||||
// Pipeline state monitoring
|
|
||||||
const pipelineBusy = useBackendState.use.pipelineBusy()
|
|
||||||
const prevPipelineBusy = useRef<boolean | undefined>(undefined)
|
|
||||||
const shouldRefreshPopularLabelsRef = useRef(false)
|
|
||||||
|
|
||||||
// Dynamic tooltip based on current label state
|
// Dynamic tooltip based on current label state
|
||||||
const getRefreshTooltip = useCallback(() => {
|
const getRefreshTooltip = useCallback(() => {
|
||||||
if (isRefreshing) {
|
if (isRefreshing) {
|
||||||
|
|
@ -61,61 +54,6 @@ const GraphLabels = () => {
|
||||||
initializeHistory()
|
initializeHistory()
|
||||||
}, [])
|
}, [])
|
||||||
|
|
||||||
// Force AsyncSelect to re-render when label changes externally (e.g., from entity rename/merge)
|
|
||||||
useEffect(() => {
|
|
||||||
setSelectKey(prev => prev + 1)
|
|
||||||
}, [label])
|
|
||||||
|
|
||||||
// Force AsyncSelect to re-render when dropdown refresh is triggered (e.g., after entity rename)
|
|
||||||
useEffect(() => {
|
|
||||||
if (dropdownRefreshTrigger > 0) {
|
|
||||||
setSelectKey(prev => prev + 1)
|
|
||||||
}
|
|
||||||
}, [dropdownRefreshTrigger])
|
|
||||||
|
|
||||||
// Monitor pipeline state changes: busy -> idle
|
|
||||||
useEffect(() => {
|
|
||||||
if (prevPipelineBusy.current === true && pipelineBusy === false) {
|
|
||||||
console.log('Pipeline changed from busy to idle, marking for popular labels refresh')
|
|
||||||
shouldRefreshPopularLabelsRef.current = true
|
|
||||||
}
|
|
||||||
prevPipelineBusy.current = pipelineBusy
|
|
||||||
}, [pipelineBusy])
|
|
||||||
|
|
||||||
// Helper: Reload popular labels from backend
|
|
||||||
const reloadPopularLabels = useCallback(async () => {
|
|
||||||
if (!shouldRefreshPopularLabelsRef.current) return
|
|
||||||
|
|
||||||
console.log('Reloading popular labels (triggered by pipeline idle)')
|
|
||||||
try {
|
|
||||||
const popularLabels = await getPopularLabels(popularLabelsDefaultLimit)
|
|
||||||
SearchHistoryManager.clearHistory()
|
|
||||||
|
|
||||||
if (popularLabels.length === 0) {
|
|
||||||
const fallbackLabels = ['entity', 'relationship', 'document', 'concept']
|
|
||||||
await SearchHistoryManager.initializeWithDefaults(fallbackLabels)
|
|
||||||
} else {
|
|
||||||
await SearchHistoryManager.initializeWithDefaults(popularLabels)
|
|
||||||
}
|
|
||||||
} catch (error) {
|
|
||||||
console.error('Failed to reload popular labels:', error)
|
|
||||||
const fallbackLabels = ['entity', 'relationship', 'document']
|
|
||||||
SearchHistoryManager.clearHistory()
|
|
||||||
await SearchHistoryManager.initializeWithDefaults(fallbackLabels)
|
|
||||||
} finally {
|
|
||||||
// Always clear the flag
|
|
||||||
shouldRefreshPopularLabelsRef.current = false
|
|
||||||
}
|
|
||||||
}, [])
|
|
||||||
|
|
||||||
// Helper: Bump dropdown data to trigger refresh
|
|
||||||
const bumpDropdownData = useCallback(({ forceSelectKey = false } = {}) => {
|
|
||||||
setRefreshTrigger(prev => prev + 1)
|
|
||||||
if (forceSelectKey) {
|
|
||||||
setSelectKey(prev => prev + 1)
|
|
||||||
}
|
|
||||||
}, [])
|
|
||||||
|
|
||||||
const fetchData = useCallback(
|
const fetchData = useCallback(
|
||||||
async (query?: string): Promise<string[]> => {
|
async (query?: string): Promise<string[]> => {
|
||||||
let results: string[] = [];
|
let results: string[] = [];
|
||||||
|
|
@ -164,12 +102,6 @@ const GraphLabels = () => {
|
||||||
currentLabel = '*'
|
currentLabel = '*'
|
||||||
}
|
}
|
||||||
|
|
||||||
// Scenario 1: Manual refresh - reload popular labels if flag is set (regardless of current label)
|
|
||||||
if (shouldRefreshPopularLabelsRef.current) {
|
|
||||||
await reloadPopularLabels()
|
|
||||||
bumpDropdownData({ forceSelectKey: true })
|
|
||||||
}
|
|
||||||
|
|
||||||
if (currentLabel && currentLabel !== '*') {
|
if (currentLabel && currentLabel !== '*') {
|
||||||
// Scenario 1: Has specific label, try to refresh current label
|
// Scenario 1: Has specific label, try to refresh current label
|
||||||
console.log(`Refreshing current label: ${currentLabel}`)
|
console.log(`Refreshing current label: ${currentLabel}`)
|
||||||
|
|
@ -190,7 +122,7 @@ const GraphLabels = () => {
|
||||||
console.log('Refreshing global data and popular labels')
|
console.log('Refreshing global data and popular labels')
|
||||||
|
|
||||||
try {
|
try {
|
||||||
// Re-fetch popular labels and update search history (if not already done)
|
// Re-fetch popular labels and update search history
|
||||||
const popularLabels = await getPopularLabels(popularLabelsDefaultLimit)
|
const popularLabels = await getPopularLabels(popularLabelsDefaultLimit)
|
||||||
SearchHistoryManager.clearHistory()
|
SearchHistoryManager.clearHistory()
|
||||||
|
|
||||||
|
|
@ -228,16 +160,7 @@ const GraphLabels = () => {
|
||||||
} finally {
|
} finally {
|
||||||
setIsRefreshing(false)
|
setIsRefreshing(false)
|
||||||
}
|
}
|
||||||
}, [label, reloadPopularLabels, bumpDropdownData])
|
}, [label])
|
||||||
|
|
||||||
// Handle dropdown before open - reload popular labels if needed
|
|
||||||
const handleDropdownBeforeOpen = useCallback(async () => {
|
|
||||||
const currentLabel = useSettingsStore.getState().queryLabel
|
|
||||||
if (shouldRefreshPopularLabelsRef.current && (!currentLabel || currentLabel === '*')) {
|
|
||||||
await reloadPopularLabels()
|
|
||||||
bumpDropdownData()
|
|
||||||
}
|
|
||||||
}, [reloadPopularLabels, bumpDropdownData])
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="flex items-center">
|
<div className="flex items-center">
|
||||||
|
|
@ -260,7 +183,6 @@ const GraphLabels = () => {
|
||||||
searchInputClassName="max-h-8"
|
searchInputClassName="max-h-8"
|
||||||
triggerTooltip={t('graphPanel.graphLabels.selectTooltip')}
|
triggerTooltip={t('graphPanel.graphLabels.selectTooltip')}
|
||||||
fetcher={fetchData}
|
fetcher={fetchData}
|
||||||
onBeforeOpen={handleDropdownBeforeOpen}
|
|
||||||
renderOption={(item) => (
|
renderOption={(item) => (
|
||||||
<div className="truncate" title={item}>
|
<div className="truncate" title={item}>
|
||||||
{item}
|
{item}
|
||||||
|
|
@ -301,9 +223,6 @@ const GraphLabels = () => {
|
||||||
|
|
||||||
// Update the label to trigger data loading
|
// Update the label to trigger data loading
|
||||||
useSettingsStore.getState().setQueryLabel(newLabel);
|
useSettingsStore.getState().setQueryLabel(newLabel);
|
||||||
|
|
||||||
// Force graph re-render and reset zoom/scale (must be AFTER setQueryLabel)
|
|
||||||
useGraphStore.getState().incrementGraphDataVersion();
|
|
||||||
}}
|
}}
|
||||||
clearable={false} // Prevent clearing value on reselect
|
clearable={false} // Prevent clearing value on reselect
|
||||||
debounceTime={500}
|
debounceTime={500}
|
||||||
|
|
|
||||||
Loading…
Add table
Reference in a new issue