diff --git a/web/src/app/login/page.tsx b/web/src/app/login/page.tsx index 8bcc75cd..253ece72 100644 --- a/web/src/app/login/page.tsx +++ b/web/src/app/login/page.tsx @@ -23,7 +23,7 @@ import { import { useEffect, useState } from 'react'; import { httpClient, initializeUserInfo } from '@/app/infra/http'; import { useRouter } from 'next/navigation'; -import { Mail, Lock, Loader2 } from 'lucide-react'; +import { Mail, Lock, Loader2, AlertCircle, RefreshCw } from 'lucide-react'; import langbotIcon from '@/app/assets/langbot-logo.webp'; import { toast } from 'sonner'; import { useTranslation } from 'react-i18next'; @@ -46,6 +46,8 @@ export default function Login() { const [accountType, setAccountType] = useState(null); const [hasPassword, setHasPassword] = useState(false); const [loading, setLoading] = useState(true); + const [loadError, setLoadError] = useState(null); + const [retrying, setRetrying] = useState(false); const form = useForm>>({ resolver: zodResolver(formSchema(t)), @@ -61,6 +63,7 @@ export default function Login() { async function checkAccountInfo() { try { + setLoadError(null); const res = await httpClient.getAccountInfo(); if (!res.initialized) { router.push('/register'); @@ -72,11 +75,22 @@ export default function Login() { // Also check if already logged in checkIfAlreadyLoggedIn(); - } catch { + } catch (err) { + const errorMessage = + err instanceof Error ? err.message : t('common.loginLoadError'); + setLoadError(errorMessage); setLoading(false); } } + async function handleRetry() { + setRetrying(true); + setLoading(true); + setLoadError(null); + await checkAccountInfo(); + setRetrying(false); + } + function checkIfAlreadyLoggedIn() { httpClient .checkUserToken() @@ -129,6 +143,54 @@ export default function Login() { ); } + // Show error state when account info failed to load + if (loadError) { + return ( +
+ + +
+ + +
+ LangBot + + {t('common.welcome')} + +
+ +
+ +

+ {t('common.loginLoadErrorDesc')} +

+ + {loadError} + + +
+
+
+
+ ); + } + // Determine what to show based on account type const showLocalLogin = accountType === 'local' || (accountType === 'space' && hasPassword); diff --git a/web/src/i18n/locales/en-US.ts b/web/src/i18n/locales/en-US.ts index a917993d..601a3289 100644 --- a/web/src/i18n/locales/en-US.ts +++ b/web/src/i18n/locales/en-US.ts @@ -11,6 +11,10 @@ const enUS = { continueToLogin: 'Login to continue', loginSuccess: 'Login successful', loginFailed: 'Login failed, please check your email and password', + loginLoadError: 'Unable to connect to server', + loginLoadErrorDesc: + 'Unable to connect to the LangBot backend. Please make sure the service is running and try again.', + retry: 'Retry', enterEmail: 'Enter email address', enterPassword: 'Enter password', invalidEmail: 'Please enter a valid email address', diff --git a/web/src/i18n/locales/ja-JP.ts b/web/src/i18n/locales/ja-JP.ts index 47b9c93f..98235080 100644 --- a/web/src/i18n/locales/ja-JP.ts +++ b/web/src/i18n/locales/ja-JP.ts @@ -12,6 +12,10 @@ loginSuccess: 'ログインに成功しました', loginFailed: 'ログインに失敗しました。メールアドレスまたはパスワードをご確認ください', + loginLoadError: 'サーバーに接続できません', + loginLoadErrorDesc: + 'LangBot バックエンドに接続できません。サービスが起動していることを確認してから再試行してください。', + retry: '再試行', enterEmail: 'メールアドレスを入力', enterPassword: 'パスワードを入力', invalidEmail: '有効なメールアドレスを入力してください', diff --git a/web/src/i18n/locales/zh-Hans.ts b/web/src/i18n/locales/zh-Hans.ts index 867340ad..555598d9 100644 --- a/web/src/i18n/locales/zh-Hans.ts +++ b/web/src/i18n/locales/zh-Hans.ts @@ -11,6 +11,9 @@ const zhHans = { continueToLogin: '登录以继续', loginSuccess: '登录成功', loginFailed: '登录失败,请检查邮箱和密码是否正确', + loginLoadError: '无法连接到服务器', + loginLoadErrorDesc: '无法连接到 LangBot 后端服务,请确认服务已启动后重试。', + retry: '重试', enterEmail: '输入邮箱地址', enterPassword: '输入密码', invalidEmail: '请输入有效的邮箱地址', diff --git a/web/src/i18n/locales/zh-Hant.ts b/web/src/i18n/locales/zh-Hant.ts index 352ee849..791f6352 100644 --- a/web/src/i18n/locales/zh-Hant.ts +++ b/web/src/i18n/locales/zh-Hant.ts @@ -11,6 +11,9 @@ const zhHant = { continueToLogin: '登入以繼續', loginSuccess: '登入成功', loginFailed: '登入失敗,請檢查電子郵件和密碼是否正確', + loginLoadError: '無法連線到伺服器', + loginLoadErrorDesc: '無法連線到 LangBot 後端服務,請確認服務已啟動後重試。', + retry: '重試', enterEmail: '輸入電子郵件地址', enterPassword: '輸入密碼', invalidEmail: '請輸入有效的電子郵件地址',