From 9ed7588ec08a24724d7ef17e8f26e445e72dd1fe Mon Sep 17 00:00:00 2001
From: wangjia <809946525@qq.com>
Date: Wed, 8 Jul 2026 11:22:11 +0800
Subject: [PATCH] =?UTF-8?q?fix(usercenter):=20=E5=88=A0=E5=86=97=E4=BD=99?=
 =?UTF-8?q?=20Preferences=20=E5=8D=A1=E7=89=87=20+=20=E4=BF=AE=E7=99=BB?=
 =?UTF-8?q?=E5=BD=95=E6=80=81=E8=BF=9B=E7=94=A8=E6=88=B7=E4=B8=AD=E5=BF=83?=
 =?UTF-8?q?=E9=97=AA=E7=99=BB=E5=BD=95=E9=A1=B5?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

1. Settings 页删掉 Preferences 卡片(语言/主题切换)——顶栏已有语言下拉 + 主题
   切换按钮,重复。连带删只被它用的 Preferences/Row/Seg 函数 + useUI 导入。
2. 修 bug:从官网登录态点"用户中心"进 /user/ 会先闪登录页再跳面板。根因:渲染
   守卫在 !ready(会话续期中)时也直接渲染 Login。改为:本地有 refresh token 且
   续期未完成时显示加载态(非登录页),续期成功→面板、失败/无 token→登录页。

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
---
 web/usercenter/components/Settings.tsx   | 53 ------------------------
 web/usercenter/components/UserCenter.tsx | 12 +++++-
 2 files changed, 10 insertions(+), 55 deletions(-)

diff --git a/web/usercenter/components/Settings.tsx b/web/usercenter/components/Settings.tsx
index a85934a..133faa9 100644
--- a/web/usercenter/components/Settings.tsx
+++ b/web/usercenter/components/Settings.tsx
@@ -5,7 +5,6 @@ import React, { useEffect, useState } from 'react';
 import { Icon } from './icons';
 import { card, input } from './shared';
 import { ErrorLine } from './Login';
-import { useUI } from '../lib/theme';
 import type { TFn, Lang } from '../lib/i18n';
 import { getClient } from '../lib/api/client';
 import { bilingual } from '../lib/api/errors';
@@ -15,7 +14,6 @@ export default function Settings({ t, lang, totpEnabled, onTotpChange }: { t: TF
   return (
     <div style={{ display: 'flex', flexDirection: 'column', gap: 18 }}>
       <div style={{ fontFamily: 'var(--font-display)', fontSize: 25, fontWeight: 700, color: 'var(--fg1)' }}>{t('settingsTitle')}</div>
-      <Preferences t={t} />
       <TotpSection t={t} lang={lang} enabled={totpEnabled} onChange={onTotpChange} />
       <Devices t={t} lang={lang} />
     </div>
@@ -24,57 +22,6 @@ export default function Settings({ t, lang, totpEnabled, onTotpChange }: { t: TF
 
 const sectionTitle: React.CSSProperties = { fontSize: 14.5, fontWeight: 700, color: 'var(--fg1)' };
 
-function Preferences({ t }: { t: TFn }) {
-  const { lang, setLang, theme, setTheme } = useUI();
-  return (
-    <div style={{ ...card, padding: '18px 20px', display: 'flex', flexDirection: 'column', gap: 16 }}>
-      <div style={sectionTitle}>{t('prefTitle')}</div>
-      <Row label={t('prefLang')}>
-        <Seg
-          value={lang}
-          options={[['zh', '中文'], ['en', 'EN']]}
-          onPick={(v) => setLang(v as Lang)}
-        />
-      </Row>
-      <Row label={t('prefTheme')}>
-        <Seg
-          value={theme}
-          options={[['light', t('themeLight')], ['dark', t('themeDark')]]}
-          icons={{ light: 'sun', dark: 'moon' }}
-          onPick={(v) => setTheme(v as 'light' | 'dark')}
-        />
-      </Row>
-    </div>
-  );
-}
-
-function Row({ label, children }: { label: string; children: React.ReactNode }) {
-  return (
-    <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', gap: 12 }}>
-      <span style={{ fontSize: 13.5, fontWeight: 600, color: 'var(--fg2)' }}>{label}</span>
-      {children}
-    </div>
-  );
-}
-
-function Seg({ value, options, onPick, icons }: { value: string; options: [string, string][]; onPick: (v: string) => void; icons?: Record<string, string> }) {
-  return (
-    <div style={{ display: 'flex', background: 'var(--bg-subtle)', borderRadius: 999, padding: 3, gap: 2 }}>
-      {options.map(([v, l]) => (
-        <button
-          key={v}
-          onClick={() => onPick(v)}
-          aria-pressed={value === v}
-          style={{ display: 'inline-flex', alignItems: 'center', gap: 6, border: 'none', cursor: 'pointer', borderRadius: 999, padding: '6px 14px', fontFamily: 'var(--font-sans)', fontSize: 12.5, fontWeight: 700, background: value === v ? 'var(--accent)' : 'transparent', color: value === v ? 'var(--fg-on-accent)' : 'var(--fg3)' }}
-        >
-          {icons && <Icon name={icons[v]} size={14} color={value === v ? 'var(--fg-on-accent)' : 'var(--fg3)'} />}
-          {l}
-        </button>
-      ))}
-    </div>
-  );
-}
-
 /* ───────── TOTP 2FA ───────── */
 function TotpSection({ t, lang, enabled, onChange }: { t: TFn; lang: Lang; enabled: boolean; onChange: () => void }) {
   const api = getClient();
diff --git a/web/usercenter/components/UserCenter.tsx b/web/usercenter/components/UserCenter.tsx
index de788c9..08714ed 100644
--- a/web/usercenter/components/UserCenter.tsx
+++ b/web/usercenter/components/UserCenter.tsx
@@ -120,8 +120,16 @@ export default function UserCenter() {
     setView('overview');
   }
 
-  // 静态导出无服务端会话:首屏(!ready)与未登录一律直接渲染登录页,避免出现空白
-  // 背景(慢网络下用户会看到"空的")。已登录用户(有 refresh)会话续期完成后再切面板。
+  // 已登录(本地有 refresh token)但会话续期尚未完成:显示加载态而非登录页,
+  // 避免"先闪登录页再跳面板"(从官网带登录态进来时的 bug)。续期成功→面板、失败→登录页。
+  if (!ready && hasRefresh()) {
+    return (
+      <div style={{ minHeight: '70vh', display: 'flex', alignItems: 'center', justifyContent: 'center', color: 'var(--fg3)', fontSize: 14 }}>
+        {t('loading')}
+      </div>
+    );
+  }
+  // 无 refresh token(未登录)或续期失败:渲染登录页。
   if (!ready || !authed) {
     return <Login onDone={onLoginDone} />;
   }