fix: home card save

UPDATELOG.md

@@ -36,6 +36,7 @@
 - 启用 TUN 前等待服务就绪
 - 卸载 TUN 时会先关闭
 - 优化应用启动页
+- 优化首页当前节点对MATCH规则的支持
 
 ### 🐞 修复问题
 
@@ -63,6 +64,8 @@
 - 修复规则配置项在不同配置文件间全局共享导致切换被重置的问题
 - 修复 Linux Wayland 下部分 GPU 可能出现的 UI 渲染问题
 - 修复自动更新使版本回退的问题
+- 修复首页自定义卡片在切换轻量模式时失效
+- 修复悬浮跳转导航失效
 
 ## v2.4.2
 

src/pages/home.tsx

@@ -80,6 +80,12 @@ interface HomeSettingsDialogProps {
   onSave: (cards: HomeCardsSettings) => void;
 }
 
+const serializeCardFlags = (cards: HomeCardsSettings) =>
+  Object.keys(cards)
+    .sort()
+    .map((key) => `${key}:${cards[key] ? 1 : 0}`)
+    .join("|");
+
 // 首页设置对话框组件
 const HomeSettingsDialog = ({
   open,
@@ -209,6 +215,10 @@ const HomePage = () => {
 
   // 设置弹窗的状态
   const [settingsOpen, setSettingsOpen] = useState(false);
+  const [localHomeCards, setLocalHomeCards] = useState<{
+    value: HomeCardsSettings;
+    baseSignature: string;
+  } | null>(null);
 
   // 卡片显示状态
   const defaultCards = useMemo<HomeCardsSettings>(
@@ -227,9 +237,29 @@ const HomePage = () => {
     [],
   );
 
-  const [homeCards, setHomeCards] = useState<HomeCardsSettings>(() => {
-    return (verge?.home_cards as HomeCardsSettings) || defaultCards;
-  });
+  const vergeHomeCards = useMemo<HomeCardsSettings | null>(
+    () => (verge?.home_cards as HomeCardsSettings | undefined) ?? null,
+    [verge],
+  );
+
+  const remoteHomeCards = useMemo<HomeCardsSettings>(
+    () => vergeHomeCards ?? defaultCards,
+    [defaultCards, vergeHomeCards],
+  );
+
+  const remoteSignature = useMemo(
+    () => serializeCardFlags(remoteHomeCards),
+    [remoteHomeCards],
+  );
+
+  const pendingLocalCards = useMemo<HomeCardsSettings | null>(() => {
+    if (!localHomeCards) return null;
+    return localHomeCards.baseSignature === remoteSignature
+      ? localHomeCards.value
+      : null;
+  }, [localHomeCards, remoteSignature]);
+
+  const effectiveHomeCards = pendingLocalCards ?? remoteHomeCards;
 
   // 文档链接函数
   const toGithubDoc = useLockFn(() => {
@@ -243,7 +273,7 @@ const HomePage = () => {
 
   const renderCard = useCallback(
     (cardKey: string, component: React.ReactNode, size: number = 6) => {
-      if (!homeCards[cardKey]) return null;
+      if (!effectiveHomeCards[cardKey]) return null;
 
       return (
         <Grid size={size} key={cardKey}>
@@ -251,7 +281,7 @@ const HomePage = () => {
         </Grid>
       );
     },
-    [homeCards],
+    [effectiveHomeCards],
   );
 
   const criticalCards = useMemo(
@@ -270,9 +300,21 @@ const HomePage = () => {
   // 新增：保存设置时用requestIdleCallback/setTimeout
   const handleSaveSettings = (newCards: HomeCardsSettings) => {
     if (window.requestIdleCallback) {
-      window.requestIdleCallback(() => setHomeCards(newCards));
+      window.requestIdleCallback(() =>
+        setLocalHomeCards({
+          value: newCards,
+          baseSignature: remoteSignature,
+        }),
+      );
     } else {
-      setTimeout(() => setHomeCards(newCards), 0);
+      setTimeout(
+        () =>
+          setLocalHomeCards({
+            value: newCards,
+            baseSignature: remoteSignature,
+          }),
+        0,
+      );
     }
   };
 
@@ -316,7 +358,10 @@ const HomePage = () => {
     ],
     [t, renderCard],
   );
-
+  const dialogKey = useMemo(
+    () => `${serializeCardFlags(effectiveHomeCards)}:${settingsOpen ? 1 : 0}`,
+    [effectiveHomeCards, settingsOpen],
+  );
   return (
     <BasePage
       title={t("Label-Home")}
@@ -353,9 +398,10 @@ const HomePage = () => {
 
       {/* 首页设置弹窗 */}
       <HomeSettingsDialog
+        key={dialogKey}
         open={settingsOpen}
         onClose={() => setSettingsOpen(false)}
-        homeCards={homeCards}
+        homeCards={effectiveHomeCards}
         onSave={handleSaveSettings}
       />
     </BasePage>