fix: 修复 React Compiler 严格模式下的 lint 错误

- Memorize: 将 loadCards 内联到 useEffect 中避免变量提升问题
- DecksClient: 修复 effect 中异步加载，创建 deck 后使用 actionGetDeckById
- LanguageSettings: 使用 effect 设置 cookie 避免 render 期间修改
- theme-provider: 修复 hydration 逻辑避免 render 期间访问 ref

src/app/(features)/memorize/Memorize.tsx

@@ -34,25 +34,33 @@ const Memorize: React.FC<MemorizeProps> = ({ deckId, deckName }) => {
   const [error, setError] = useState<string | null>(null);
 
   useEffect(() => {
-    loadCards();
+    let ignore = false;
-  }, [deckId]);
     
-  const loadCards = () => {
+    const loadCards = async () => {
-    setIsLoading(true);
+      setIsLoading(true);
-    setError(null);
+      setError(null);
-    startTransition(async () => {
+      startTransition(async () => {
-      const result = await actionGetCardsForReview({ deckId, limit: 50 });
+        const result = await actionGetCardsForReview({ deckId, limit: 50 });
-      if (result.success && result.data) {
+        if (!ignore) {
-        setCards(result.data);
+          if (result.success && result.data) {
-        setCurrentIndex(0);
+            setCards(result.data);
-        setShowAnswer(false);
+            setCurrentIndex(0);
-        setLastScheduled(null);
+            setShowAnswer(false);
-      } else {
+            setLastScheduled(null);
-        setError(result.message);
+          } else {
-      }
+            setError(result.message);
-      setIsLoading(false);
+          }
-    });
+          setIsLoading(false);
-  };
+        }
+      });
+    };
+    
+    loadCards();
+    
+    return () => {
+      ignore = true;
+    };
+  }, [deckId]);
 
   const getCurrentCard = (): ActionOutputCardWithNote | null => {
     return cards[currentIndex] ?? null;

src/app/decks/DecksClient.tsx

@@ -22,6 +22,7 @@ import {
   actionDeleteDeck,
   actionGetDecksByUserId,
   actionUpdateDeck,
+  actionGetDeckById,
 } from "@/modules/deck/deck-action";
 import type { ActionOutputDeck } from "@/modules/deck/deck-action-dto";
 
@@ -148,17 +149,25 @@ export function DecksClient({ userId }: DecksClientProps) {
   const [decks, setDecks] = useState<ActionOutputDeck[]>([]);
   const [loading, setLoading] = useState(true);
 
-  const loadDecks = async () => {
-    setLoading(true);
-    const result = await actionGetDecksByUserId(userId);
-    if (result.success && result.data) {
-      setDecks(result.data);
-    }
-    setLoading(false);
-  };
-
   useEffect(() => {
+    let ignore = false;
+    
+    const loadDecks = async () => {
+      setLoading(true);
+      const result = await actionGetDecksByUserId(userId);
+      if (!ignore) {
+        if (result.success && result.data) {
+          setDecks(result.data);
+        }
+        setLoading(false);
+      }
+    };
+    
     loadDecks();
+    
+    return () => {
+      ignore = true;
+    };
   }, [userId]);
 
   const handleUpdateDeck = (deckId: number, updates: Partial<ActionOutputDeck>) => {
@@ -176,8 +185,11 @@ export function DecksClient({ userId }: DecksClientProps) {
     if (!deckName?.trim()) return;
 
     const result = await actionCreateDeck({ name: deckName.trim() });
-    if (result.success) {
+    if (result.success && result.deckId) {
-      loadDecks();
+      const deckResult = await actionGetDeckById({ deckId: result.deckId });
+      if (deckResult.success && deckResult.data) {
+        setDecks((prev) => [...prev, deckResult.data!]);
+      }
     } else {
       toast.error(result.message);
     }

src/components/layout/LanguageSettings.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import { useState, useEffect, useRef } from "react";
+import { useState, useEffect, useRef, useCallback } from "react";
 import { Languages } from "lucide-react";
 import { cn } from "@/utils/cn";
 
@@ -17,6 +17,7 @@ const languages = [
 
 export function LanguageSettings() {
   const [isOpen, setIsOpen] = useState(false);
+  const [pendingLocale, setPendingLocale] = useState<string | null>(null);
   const menuRef = useRef<HTMLDivElement>(null);
 
   useEffect(() => {
@@ -46,10 +47,16 @@ export function LanguageSettings() {
     }
   }, [isOpen]);
 
-  const setLocale = async (locale: string) => {
+  useEffect(() => {
-    document.cookie = `locale=${locale}`;
+    if (pendingLocale) {
-    window.location.reload();
+      document.cookie = `locale=${pendingLocale}; path=/`;
-  };
+      window.location.reload();
+    }
+  }, [pendingLocale]);
+
+  const setLocale = useCallback((locale: string) => {
+    setPendingLocale(locale);
+  }, []);
 
   return (
     <div className="relative" ref={menuRef}>

src/components/theme-provider.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import { createContext, useContext, useEffect, useState } from "react";
+import { createContext, useContext, useEffect, useState, useMemo } from "react";
 import {
   THEME_PRESETS,
   DEFAULT_THEME,
@@ -20,26 +20,33 @@ const ThemeContext = createContext<ThemeContextType | null>(null);
 
 const STORAGE_KEY = "theme-preset";
 
+function getInitialTheme(): string {
+  if (typeof window === "undefined") return DEFAULT_THEME;
+  const saved = localStorage.getItem(STORAGE_KEY);
+  return saved && getThemePreset(saved) ? saved : DEFAULT_THEME;
+}
+
 export function ThemeProvider({ children }: { children: React.ReactNode }) {
   const [currentTheme, setCurrentTheme] = useState<string>(DEFAULT_THEME);
-  const [mounted, setMounted] = useState(false);
+  const [hydrated, setHydrated] = useState(false);
 
   useEffect(() => {
-    setMounted(true);
+    const savedTheme = getInitialTheme();
-    const savedTheme = localStorage.getItem(STORAGE_KEY);
+    if (savedTheme !== currentTheme) {
-    if (savedTheme && getThemePreset(savedTheme)) {
       setCurrentTheme(savedTheme);
     }
+    setHydrated(true);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
 
   useEffect(() => {
-    if (!mounted) return;
+    if (!hydrated) return;
     const preset = getThemePreset(currentTheme);
     if (preset) {
       applyThemeColors(preset);
       localStorage.setItem(STORAGE_KEY, currentTheme);
     }
-  }, [currentTheme, mounted]);
+  }, [currentTheme, hydrated]);
 
   const setTheme = (themeId: string) => {
     if (getThemePreset(themeId)) {
@@ -47,11 +54,7 @@ export function ThemeProvider({ children }: { children: React.ReactNode }) {
     }
   };
 
-  const themePreset = getThemePreset(currentTheme) || THEME_PRESETS[0];
+  const themePreset = useMemo(() => getThemePreset(currentTheme) || THEME_PRESETS[0], [currentTheme]);
-
-  if (!mounted) {
-    return null;
-  }
 
   return (
     <ThemeContext.Provider