Merge branch 'feat-node-expand' into improve-property-tooltip

lightrag_webui/src/components/graph/Settings.tsx

@@ -8,6 +8,7 @@ import Input from '@/components/ui/Input'
 import { controlButtonVariant } from '@/lib/constants'
 import { useSettingsStore } from '@/stores/settings'
 import { useBackendState } from '@/stores/state'
+import { useGraphStore } from '@/stores/graph'
 
 import { SettingsIcon, RefreshCwIcon } from 'lucide-react'
 import { useTranslation } from 'react-i18next';
@@ -114,7 +115,7 @@ const LabeledNumberInput = ({
 export default function Settings() {
   const [opened, setOpened] = useState<boolean>(false)
   const [tempApiKey, setTempApiKey] = useState<string>('')
-  const refreshLayout = useSettingsStore.use.refreshLayout()
+  const refreshLayout = useGraphStore.use.refreshLayout()
 
   const showPropertyPanel = useSettingsStore.use.showPropertyPanel()
   const showNodeSearchBar = useSettingsStore.use.showNodeSearchBar()

lightrag_webui/src/stores/graph.ts

@@ -72,6 +72,7 @@ interface GraphState {
   moveToSelectedNode: boolean
   isFetching: boolean
 
+  refreshLayout: () => void
   setSelectedNode: (nodeId: string | null, moveToSelectedNode?: boolean) => void
   setFocusedNode: (nodeId: string | null) => void
   setSelectedEdge: (edgeId: string | null) => void
@@ -89,7 +90,7 @@ interface GraphState {
   setIsFetching: (isFetching: boolean) => void
 }
 
-const useGraphStoreBase = create<GraphState>()((set) => ({
+const useGraphStoreBase = create<GraphState>()((set, get) => ({
   selectedNode: null,
   focusedNode: null,
   selectedEdge: null,
@@ -103,6 +104,17 @@ const useGraphStoreBase = create<GraphState>()((set) => ({
   graphLabels: ['*'],
   allDatabaseLabels: ['*'],
 
+  refreshLayout: () => {
+    const currentGraph = get().sigmaGraph;
+    if (currentGraph) {
+      get().clearSelection();
+      get().setSigmaGraph(null);
+      setTimeout(() => {
+        get().setSigmaGraph(currentGraph);
+      }, 10);
+    }
+  },
+
   setIsFetching: (isFetching: boolean) => set({ isFetching }),
   setSelectedNode: (nodeId: string | null, moveToSelectedNode?: boolean) =>
     set({ selectedNode: nodeId, moveToSelectedNode }),

lightrag_webui/src/stores/settings.ts

@@ -3,7 +3,6 @@ import { persist, createJSONStorage } from 'zustand/middleware'
 import { createSelectors } from '@/lib/utils'
 import { defaultQueryLabel } from '@/lib/constants'
 import { Message, QueryRequest } from '@/api/lightrag'
-import { useGraphStore } from '@/stores/graph'
 
 type Theme = 'dark' | 'light' | 'system'
 type Language = 'en' | 'zh'
@@ -11,7 +10,6 @@ type Tab = 'documents' | 'knowledge-graph' | 'retrieval' | 'api'
 
 interface SettingsState {
   // Graph viewer settings
-  refreshLayout: () => void
   showPropertyPanel: boolean
   showNodeSearchBar: boolean
 
@@ -59,37 +57,11 @@ interface SettingsState {
   setCurrentTab: (tab: Tab) => void
 }
 
-// Helper to get initial state from localStorage
-const getInitialState = () => {
-  try {
-    const stored = localStorage.getItem('settings-storage')
-    if (stored) {
-      const { state } = JSON.parse(stored)
-      return {
-        theme: state?.theme || 'system',
-        language: state?.language || 'zh'
-      }
-    }
-  } catch (e) {
-    console.error('Failed to parse settings from localStorage:', e)
-  }
-  return { theme: 'system', language: 'zh' }
-}
-
 const useSettingsStoreBase = create<SettingsState>()(
   persist(
     (set) => ({
-      ...getInitialState(),
+      theme: 'system',
-      refreshLayout: () => {
+      language: 'en',
-        const graphState = useGraphStore.getState();
-        const currentGraph = graphState.sigmaGraph;
-        graphState.clearSelection();
-        graphState.setSigmaGraph(null);
-        setTimeout(() => {
-          graphState.setSigmaGraph(currentGraph);
-        }, 10);
-      },
-
       showPropertyPanel: true,
       showNodeSearchBar: true,
 
@@ -211,10 +183,8 @@ const useSettingsStoreBase = create<SettingsState>()(
           state.graphLayoutMaxIterations = 15
         }
         if (version < 8) {
-          state.enableNodeDrag = true
-          state.enableHideUnselectedEdges = true
-          state.enableEdgeEvents = false
           state.graphMinDegree = 0
+          state.language = 'en'
         }
         return state
       }