From 5da9f996982645c70c5e4a98008e30d13f1c869c Mon Sep 17 00:00:00 2001
From: Tunglies <77394545+Tunglies@users.noreply.github.com>
Date: Fri, 3 Apr 2026 21:20:02 +0800
Subject: [PATCH] fix: prevent TUN from being falsely disabled during startup

- Add 10s startup grace period before TUN auto-disable logic activates;
  service IPC may not be ready when the frontend first queries, causing
  a transient isServiceOk=false that incorrectly persists
- Replace placeholderData (which set isLoading=false with stale data)
  with a proper isStartingUp guard; query now polls every 2s during
  startup to catch service readiness quickly
- Add 'getSystemState' to refresh-verge-config invalidation keys to
  fix key mismatch that prevented event-driven refetches from working
---
 src/hooks/use-system-state.ts                | 19 ++++++++++++++-----
 src/pages/_layout/hooks/use-layout-events.ts |  1 +
 2 files changed, 15 insertions(+), 5 deletions(-)

diff --git a/src/hooks/use-system-state.ts b/src/hooks/use-system-state.ts
index 5eda165f7..675946fba 100644
--- a/src/hooks/use-system-state.ts
+++ b/src/hooks/use-system-state.ts
@@ -1,5 +1,5 @@
 import { useQuery } from '@tanstack/react-query'
-import { useEffect, useRef } from 'react'
+import { useEffect, useRef, useState } from 'react'
 
 import { getRunningMode, isAdmin, isServiceAvailable } from '@/services/cmds'
 import { showNotice } from '@/services/notice-service'
@@ -18,6 +18,9 @@ const defaultSystemState = {
   isServiceOk: false,
 } as SystemState
 
+// Grace period for service initialization during startup
+const STARTUP_GRACE_MS = 10_000
+
 /**
  * 自定义 hook 用于获取系统运行状态
  * 包括运行模式、管理员状态、系统服务是否可用
@@ -25,6 +28,12 @@ const defaultSystemState = {
 export function useSystemState() {
   const { verge, patchVerge } = useVerge()
   const disablingTunRef = useRef(false)
+  const [isStartingUp, setIsStartingUp] = useState(true)
+
+  useEffect(() => {
+    const timer = setTimeout(() => setIsStartingUp(false), STARTUP_GRACE_MS)
+    return () => clearTimeout(timer)
+  }, [])
 
   const {
     data: systemState = defaultSystemState,
@@ -40,8 +49,7 @@ export function useSystemState() {
       ])
       return { runningMode, isAdminMode, isServiceOk } as SystemState
     },
-    refetchInterval: 30000,
-    placeholderData: defaultSystemState,
+    refetchInterval: isStartingUp ? 2000 : 30000,
   })
 
   const isSidecarMode = systemState.runningMode === 'Sidecar'
@@ -58,7 +66,8 @@ export function useSystemState() {
       !disablingTunRef.current &&
       enable_tun_mode &&
       !isTunModeAvailable &&
-      !isLoading
+      !isLoading &&
+      !isStartingUp
     ) {
       disablingTunRef.current = true
       patchVerge({ enable_tun_mode: false })
@@ -89,7 +98,7 @@ export function useSystemState() {
         disablingTunRef.current = false
       }
     }
-  }, [enable_tun_mode, isTunModeAvailable, patchVerge, isLoading])
+  }, [enable_tun_mode, isTunModeAvailable, patchVerge, isLoading, isStartingUp])
 
   return {
     runningMode: systemState.runningMode,
diff --git a/src/pages/_layout/hooks/use-layout-events.ts b/src/pages/_layout/hooks/use-layout-events.ts
index 1661384bf..409ba1578 100644
--- a/src/pages/_layout/hooks/use-layout-events.ts
+++ b/src/pages/_layout/hooks/use-layout-events.ts
@@ -62,6 +62,7 @@ export const useLayoutEvents = (
           'getAutotemProxy',
           'getRunningMode',
           'isServiceAvailable',
+          'getSystemState',
         ])
       }),
     )