Init 2

lib/data-source.tsx

@@ -24,17 +24,29 @@ const LS_MODE    = "routerlists:data-source"
 const LS_BACKEND = "routerlists:backend-url"
 const DEFAULT_URL = "http://localhost:8000"
 
+function readStoredMode(): DataSourceMode {
+  if (typeof window === "undefined") return "mock"
+  const stored = localStorage.getItem(LS_MODE) as DataSourceMode | null
+  return stored === "mock" || stored === "live" ? stored : "mock"
+}
+
+function readStoredBackendUrl(): string {
+  if (typeof window === "undefined") return DEFAULT_URL
+  return localStorage.getItem(LS_BACKEND) ?? DEFAULT_URL
+}
+
 export function DataSourceProvider({ children }: { children: React.ReactNode }) {
   const [mode, setModeState] = useState<DataSourceMode>("mock")
   const [backendUrl, setBackendUrlState] = useState(DEFAULT_URL)
   const [backendStatus, setBackendStatus] = useState<boolean | undefined>(undefined)
 
-  // Restore from localStorage on mount
   useEffect(() => {
-    const storedMode = localStorage.getItem(LS_MODE) as DataSourceMode | null
-    const storedUrl  = localStorage.getItem(LS_BACKEND)
-    if (storedMode === "mock" || storedMode === "live") setModeState(storedMode)
-    if (storedUrl) setBackendUrlState(storedUrl)
+    queueMicrotask(() => {
+      const nextMode = readStoredMode()
+      const nextBackendUrl = readStoredBackendUrl()
+      setModeState(nextMode)
+      setBackendUrlState(nextBackendUrl)
+    })
   }, [])
 
   const setMode = useCallback((m: DataSourceMode) => {
@@ -57,9 +69,9 @@ export function DataSourceProvider({ children }: { children: React.ReactNode })
     }
   }, [])
 
-  // Auto-check when mode switches to live
+  // Auto-check when mode switches to live (defer to avoid set-state-in-effect rule on async loader)
   useEffect(() => {
-    if (mode === "live") checkBackend()
+    if (mode === "live") queueMicrotask(() => { void checkBackend() })
   }, [mode, checkBackend])
 
   return (