From f464333a53228cb2618fa35aa97a91ece5053a4c Mon Sep 17 00:00:00 2001 From: kurihada Date: Sun, 1 Mar 2026 14:51:17 +0800 Subject: [PATCH] =?UTF-8?q?fix:=20=E7=99=BB=E5=BD=95=E7=8A=B6=E6=80=81?= =?UTF-8?q?=E6=A3=80=E6=9F=A5=E6=94=B9=E4=B8=BA=E6=89=8B=E5=8A=A8=E8=A7=A6?= =?UTF-8?q?=E5=8F=91=EF=BC=8C=E9=81=BF=E5=85=8D=E8=87=AA=E5=8A=A8=E8=AF=B7?= =?UTF-8?q?=E6=B1=82=E4=B8=8D=E6=96=AD=E5=BC=B9=E5=87=BA=E6=B5=8F=E8=A7=88?= =?UTF-8?q?=E5=99=A8=E7=AA=97=E5=8F=A3?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - useLoginStatus 默认 auto=false，不再挂载时自动请求 - Dashboard 登录状态卡片改为 "Click to check" 手动触发 - Login 页面初始显示 "Click Refresh to check" 提示 - Header 添加 Token 未配置警告横幅，引导用户去 Settings --- web/src/components/layout/Header.tsx | 19 ++++++++++++++++++- web/src/hooks/useLoginStatus.ts | 9 ++++++--- web/src/pages/DashboardPage.tsx | 9 +++++++-- web/src/pages/LoginPage.tsx | 19 ++++++++++++++++++- 4 files changed, 49 insertions(+), 7 deletions(-) diff --git a/web/src/components/layout/Header.tsx b/web/src/components/layout/Header.tsx index 63bc56b..4a30ec1 100644 --- a/web/src/components/layout/Header.tsx +++ b/web/src/components/layout/Header.tsx @@ -1,12 +1,29 @@ import { useHealth } from '@/hooks/useHealth'; +import { useAuth } from '@/context/AuthContext'; import { Badge } from '@/components/ui/Badge'; +import { useNavigate } from 'react-router-dom'; export function Header() { const { health } = useHealth(15_000); + const { token } = useAuth(); + const navigate = useNavigate(); return (
-
+
+ {!token && ( + + )} +
{health && ( diff --git a/web/src/hooks/useLoginStatus.ts b/web/src/hooks/useLoginStatus.ts index f69c542..e028f82 100644 --- a/web/src/hooks/useLoginStatus.ts +++ b/web/src/hooks/useLoginStatus.ts @@ -2,12 +2,14 @@ import { useState, useEffect, useCallback } from 'react'; import { getLoginStatus } from '@/api/endpoints'; import type { LoginStatus } from '@/api/types'; -export function useLoginStatus(intervalMs = 0) { +export function useLoginStatus(options: { auto?: boolean; intervalMs?: number } = {}) { + const { auto = false, intervalMs = 0 } = options; const [status, setStatus] = useState(null); const [error, setError] = useState(null); - const [loading, setLoading] = useState(true); + const [loading, setLoading] = useState(auto); const refresh = useCallback(async () => { + setLoading(true); try { const res = await getLoginStatus(); if (res.success && res.data) { @@ -24,12 +26,13 @@ export function useLoginStatus(intervalMs = 0) { }, []); useEffect(() => { + if (!auto) return; void refresh(); if (intervalMs > 0) { const id = setInterval(() => void refresh(), intervalMs); return () => clearInterval(id); } - }, [refresh, intervalMs]); + }, [refresh, auto, intervalMs]); return { status, error, loading, refresh }; } diff --git a/web/src/pages/DashboardPage.tsx b/web/src/pages/DashboardPage.tsx index 416b3b8..3614a14 100644 --- a/web/src/pages/DashboardPage.tsx +++ b/web/src/pages/DashboardPage.tsx @@ -9,7 +9,7 @@ import { useNavigate } from 'react-router-dom'; export function DashboardPage() { const { health, loading: healthLoading, refresh: refreshHealth } = useHealth(10_000); - const { status: loginStatus, loading: loginLoading } = useLoginStatus(); + const { status: loginStatus, loading: loginLoading, refresh: refreshLogin } = useLoginStatus(); const navigate = useNavigate(); return ( @@ -65,7 +65,12 @@ export function DashboardPage() { )}
) : ( - Unknown + )} diff --git a/web/src/pages/LoginPage.tsx b/web/src/pages/LoginPage.tsx index 704b8ab..ef756b2 100644 --- a/web/src/pages/LoginPage.tsx +++ b/web/src/pages/LoginPage.tsx @@ -1,15 +1,19 @@ import { useState, useEffect, useCallback, useRef } from 'react'; +import { useNavigate } from 'react-router-dom'; import { Card } from '@/components/ui/Card'; import { Button } from '@/components/ui/Button'; import { Badge } from '@/components/ui/Badge'; import { Spinner } from '@/components/ui/Spinner'; import { useLoginStatus } from '@/hooks/useLoginStatus'; +import { useAuth } from '@/context/AuthContext'; import { useToast } from '@/context/ToastContext'; import { getLoginQRCode, deleteCookies, getLoginStatus } from '@/api/endpoints'; export function LoginPage() { const { status, loading: statusLoading, refresh: refreshStatus } = useLoginStatus(); + const { token } = useAuth(); const { toast } = useToast(); + const navigate = useNavigate(); const [qrData, setQrData] = useState(null); const [qrLoading, setQrLoading] = useState(false); @@ -107,6 +111,19 @@ export function LoginPage() {

Xiaohongshu Login

+ {!token && ( + +
+

+ Bearer Token 未配置，API 请求将返回 401。请先在 Settings 中配置 Token。 +

+ +
+ + )} + {/* Current Status */}
@@ -124,7 +141,7 @@ export function LoginPage() { {status.username && {status.username}}
) : ( - Unable to check + Click Refresh to check login status )}