diff --git a/src/pages/home.tsx b/src/pages/home.tsx index 85196aa1b..15ea40ef4 100644 --- a/src/pages/home.tsx +++ b/src/pages/home.tsx @@ -83,12 +83,17 @@ interface HomeCardsSettings { [key: string]: boolean } -// 首页设置对话框组件接口 -interface HomeSettingsDialogProps { - open: boolean - onClose: () => void - homeCards: HomeCardsSettings - onSave: (cards: HomeCardsSettings) => void +const DEFAULT_HOME_CARDS: HomeCardsSettings = { + info: false, + profile: true, + proxy: true, + network: true, + mode: true, + traffic: true, + clashinfo: true, + systeminfo: true, + test: true, + ip: true, } const serializeCardFlags = (cards: HomeCardsSettings) => @@ -97,12 +102,16 @@ const serializeCardFlags = (cards: HomeCardsSettings) => .map((key) => `${key}:${cards[key] ? 1 : 0}`) .join('|') +// 首页设置对话框组件接口 +interface HomeSettingsDialogProps { + onClose: () => void + homeCards: HomeCardsSettings +} + // 首页设置对话框组件 const HomeSettingsDialog = ({ - open, onClose, homeCards, - onSave, }: HomeSettingsDialogProps) => { const { t } = useTranslation() const [cards, setCards] = useState(homeCards) @@ -117,12 +126,11 @@ const HomeSettingsDialog = ({ const handleSave = async () => { await patchVerge({ home_cards: cards }) - onSave(cards) onClose() } return ( - + {t('home.page.settings.title')} @@ -226,51 +234,10 @@ const HomePage = () => { // 设置弹窗的状态 const [settingsOpen, setSettingsOpen] = useState(false) - const [localHomeCards, setLocalHomeCards] = useState<{ - value: HomeCardsSettings - baseSignature: string - } | null>(null) // 卡片显示状态 - const defaultCards = useMemo( - () => ({ - info: false, - profile: true, - proxy: true, - network: true, - mode: true, - traffic: true, - clashinfo: true, - systeminfo: true, - test: true, - ip: true, - }), - [], - ) - - const vergeHomeCards = useMemo( - () => (verge?.home_cards as HomeCardsSettings | undefined) ?? null, - [verge], - ) - - const remoteHomeCards = useMemo( - () => vergeHomeCards ?? defaultCards, - [defaultCards, vergeHomeCards], - ) - - const remoteSignature = useMemo( - () => serializeCardFlags(remoteHomeCards), - [remoteHomeCards], - ) - - const pendingLocalCards = useMemo(() => { - if (!localHomeCards) return null - return localHomeCards.baseSignature === remoteSignature - ? localHomeCards.value - : null - }, [localHomeCards, remoteSignature]) - - const effectiveHomeCards = pendingLocalCards ?? remoteHomeCards + const homeCards = + (verge?.home_cards as HomeCardsSettings | undefined) ?? DEFAULT_HOME_CARDS // 文档链接函数 const toGithubDoc = useLockFn(() => { @@ -284,7 +251,7 @@ const HomePage = () => { const renderCard = useCallback( (cardKey: string, component: React.ReactNode, size: number = 6) => { - if (!effectiveHomeCards[cardKey]) return null + if (!homeCards[cardKey]) return null return ( @@ -292,7 +259,7 @@ const HomePage = () => { ) }, - [effectiveHomeCards], + [homeCards], ) const criticalCards = useMemo( @@ -308,27 +275,6 @@ const HomePage = () => { [current, mutateProfiles, renderCard], ) - // 新增:保存设置时用requestIdleCallback/setTimeout - const handleSaveSettings = (newCards: HomeCardsSettings) => { - if (window.requestIdleCallback) { - window.requestIdleCallback(() => - setLocalHomeCards({ - value: newCards, - baseSignature: remoteSignature, - }), - ) - } else { - setTimeout( - () => - setLocalHomeCards({ - value: newCards, - baseSignature: remoteSignature, - }), - 0, - ) - } - } - const nonCriticalCards = useMemo( () => [ renderCard( @@ -369,10 +315,6 @@ const HomePage = () => { ], [t, renderCard], ) - const dialogKey = useMemo( - () => `${serializeCardFlags(effectiveHomeCards)}:${settingsOpen ? 1 : 0}`, - [effectiveHomeCards, settingsOpen], - ) return ( { {/* 首页设置弹窗 */} - setSettingsOpen(false)} - homeCards={effectiveHomeCards} - onSave={handleSaveSettings} - /> + {settingsOpen && ( + setSettingsOpen(false)} + homeCards={homeCards} + /> + )} ) }