优化登录重试与配置清理

web/frontend/src/store/theme.tsx

@@ -1,28 +1,17 @@
-import { createContext, useContext, useState, useEffect, useCallback, type ReactNode } from 'react';
+import { useState, useEffect, useCallback, type ReactNode } from 'react';
+import {
+  DEFAULT_THEME_MODE,
+  THEME_STORAGE_KEY,
+  ThemeContext,
+  type ThemeMode,
+} from './themeContext';
 
-export type ThemeMode = 'light' | 'dark' | 'system';
-
-const STORAGE_KEY = 'theme_mode';
-const DEFAULT_MODE: ThemeMode = 'system';
-
-interface ThemeContextValue {
-  mode: ThemeMode;
-  isDark: boolean;
-  setMode: (mode: ThemeMode) => void;
-  toggle: () => void;
-}
-
-const ThemeContext = createContext<ThemeContextValue>({
-  mode: DEFAULT_MODE,
-  isDark: false,
-  setMode: () => {},
-  toggle: () => {},
-});
+export type { ThemeMode } from './themeContext';
 
 export function ThemeProvider({ children }: { children: ReactNode }) {
   const [mode, setModeState] = useState<ThemeMode>(() => {
-    const saved = localStorage.getItem(STORAGE_KEY);
-    return (saved as ThemeMode) || DEFAULT_MODE;
+    const saved = localStorage.getItem(THEME_STORAGE_KEY);
+    return (saved as ThemeMode) || DEFAULT_THEME_MODE;
   });
 
   // 监听系统主题变化
@@ -41,7 +30,7 @@ export function ThemeProvider({ children }: { children: ReactNode }) {
 
   const setMode = useCallback((newMode: ThemeMode) => {
     setModeState(newMode);
-    localStorage.setItem(STORAGE_KEY, newMode);
+    localStorage.setItem(THEME_STORAGE_KEY, newMode);
   }, []);
 
   const toggle = useCallback(() => {
@@ -59,7 +48,3 @@ export function ThemeProvider({ children }: { children: ReactNode }) {
     </ThemeContext.Provider>
   );
 }
-
-export function useTheme() {
-  return useContext(ThemeContext);
-}

web/frontend/src/store/themeContext.ts

@@ -0,0 +1,20 @@
+import { createContext } from 'react';
+
+export type ThemeMode = 'light' | 'dark' | 'system';
+
+export const DEFAULT_THEME_MODE: ThemeMode = 'system';
+export const THEME_STORAGE_KEY = 'theme_mode';
+
+export interface ThemeContextValue {
+  mode: ThemeMode;
+  isDark: boolean;
+  setMode: (mode: ThemeMode) => void;
+  toggle: () => void;
+}
+
+export const ThemeContext = createContext<ThemeContextValue>({
+  mode: DEFAULT_THEME_MODE,
+  isDark: false,
+  setMode: () => {},
+  toggle: () => {},
+});

web/frontend/src/store/useTheme.ts

@@ -0,0 +1,6 @@
+import { useContext } from 'react';
+import { ThemeContext } from './themeContext';
+
+export function useTheme() {
+  return useContext(ThemeContext);
+}