From e63249bf9213d622202bfa73026495fd78ae87d6 Mon Sep 17 00:00:00 2001 From: Arvin Xu Date: Tue, 17 Dec 2024 01:50:30 +0800 Subject: [PATCH] =?UTF-8?q?=F0=9F=92=84=20style:=20improve=20page=20loadin?= =?UTF-8?q?g=20state=20(#5048)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * 🐛 fix: fix welcome 404 * 💄 style: improve loading page state --- locales/ar/common.json | 6 ++++-- locales/bg-BG/common.json | 6 ++++-- locales/de-DE/common.json | 6 ++++-- locales/en-US/common.json | 6 ++++-- locales/es-ES/common.json | 6 ++++-- locales/fa-IR/common.json | 6 ++++-- locales/fr-FR/common.json | 6 ++++-- locales/it-IT/common.json | 6 ++++-- locales/ja-JP/common.json | 6 ++++-- locales/ko-KR/common.json | 6 ++++-- locales/nl-NL/common.json | 6 ++++-- locales/pl-PL/common.json | 6 ++++-- locales/pt-BR/common.json | 6 ++++-- locales/ru-RU/common.json | 6 ++++-- locales/tr-TR/common.json | 6 ++++-- locales/vi-VN/common.json | 6 ++++-- locales/zh-CN/common.json | 6 ++++-- locales/zh-TW/common.json | 6 ++++-- next.config.mjs | 5 +++++ src/app/loading/Content.tsx | 11 +++++++---- src/app/loading/Redirect.tsx | 18 +++++++++++++----- src/app/loading/index.tsx | 8 +++++--- src/app/loading/type.ts | 6 ++++++ src/components/FullscreenLoading/index.tsx | 4 ++-- src/layout/GlobalProvider/index.tsx | 3 +++ src/locales/default/common.ts | 6 ++++-- 26 files changed, 117 insertions(+), 52 deletions(-) create mode 100644 src/app/loading/type.ts diff --git a/locales/ar/common.json b/locales/ar/common.json index 310d2769ce85..9061736f7270 100644 --- a/locales/ar/common.json +++ b/locales/ar/common.json @@ -10,8 +10,10 @@ } }, "appLoading": { - "goToChat": "جارٍ تحميل صفحة الدردشة...", - "initializing": "جارٍ تشغيل التطبيق..." + "goToChat": "(4/4) جارٍ تحميل صفحة الدردشة...", + "initAuth": "(2/4) جاري تهيئة خدمة المصادقة...", + "initUser": "(3/4) جاري تهيئة حالة المستخدم...", + "initializing": "(1/4) جارٍ تشغيل التطبيق..." }, "autoGenerate": "توليد تلقائي", "autoGenerateTooltip": "إكمال تلقائي بناءً على الكلمات المقترحة لوصف المساعد", diff --git a/locales/bg-BG/common.json b/locales/bg-BG/common.json index b985afed49d3..361d7ceb3ae1 100644 --- a/locales/bg-BG/common.json +++ b/locales/bg-BG/common.json @@ -10,8 +10,10 @@ } }, "appLoading": { - "goToChat": "Зареждане на страницата за чат...", - "initializing": "Стартиране на приложението..." + "goToChat": "(4/4) Зареждане на страницата за разговори...", + "initAuth": "(2/4) Инициализиране на услугата за удостоверяване...", + "initUser": "(3/4) Инициализиране на състоянието на потребителя...", + "initializing": "(1/4) Стартиране на приложението..." }, "autoGenerate": "Автоматично генериране", "autoGenerateTooltip": "Автоматично генериране на описание на агент въз основа на подкани", diff --git a/locales/de-DE/common.json b/locales/de-DE/common.json index af256293e2df..b0de9f1ccdd3 100644 --- a/locales/de-DE/common.json +++ b/locales/de-DE/common.json @@ -10,8 +10,10 @@ } }, "appLoading": { - "goToChat": "Lade die Chat-Seite...", - "initializing": "Anwendung wird gestartet..." + "goToChat": "(4/4) Lade die Chat-Seite...", + "initAuth": "(2/4) Authentifizierungsdienst wird initialisiert...", + "initUser": "(3/4) Benutzerstatus wird initialisiert...", + "initializing": "(1/4) Anwendung wird gestartet..." }, "autoGenerate": "Automatisch generieren", "autoGenerateTooltip": "Assistentenbeschreibung automatisch auf Basis von Vorschlägen vervollständigen", diff --git a/locales/en-US/common.json b/locales/en-US/common.json index 9f1716919630..d7520f4c0d48 100644 --- a/locales/en-US/common.json +++ b/locales/en-US/common.json @@ -10,8 +10,10 @@ } }, "appLoading": { - "goToChat": "Loading chat page...", - "initializing": "Starting application..." + "goToChat": "(4/4) Loading chat page...", + "initAuth": "(2/4) Initializing authentication service...", + "initUser": "(3/4) Initializing user status...", + "initializing": "(1/4) Starting up application..." }, "autoGenerate": "Auto Generate", "autoGenerateTooltip": "Auto-generate assistant description based on prompts", diff --git a/locales/es-ES/common.json b/locales/es-ES/common.json index b1ae32495762..db99cda4ff43 100644 --- a/locales/es-ES/common.json +++ b/locales/es-ES/common.json @@ -10,8 +10,10 @@ } }, "appLoading": { - "goToChat": "Cargando página de chat...", - "initializing": "Iniciando la aplicación..." + "goToChat": "(4/4) Cargando la página de chat...", + "initAuth": "(2/4) Inicializando el servicio de autenticación...", + "initUser": "(3/4) Inicializando el estado del usuario...", + "initializing": "(1/4) Iniciando la aplicación..." }, "autoGenerate": "Generación automática", "autoGenerateTooltip": "Completar automáticamente la descripción del asistente basándose en las sugerencias", diff --git a/locales/fa-IR/common.json b/locales/fa-IR/common.json index 467ba21a5a88..4eff9772ccf9 100644 --- a/locales/fa-IR/common.json +++ b/locales/fa-IR/common.json @@ -10,8 +10,10 @@ } }, "appLoading": { - "goToChat": "در حال بارگذاری صفحه گفتگو...", - "initializing": "در حال راه‌اندازی برنامه..." + "goToChat": "(4/4) در حال بارگذاری صفحه گفتگو...", + "initAuth": "(2/4) در حال راه‌اندازی سرویس احراز هویت...", + "initUser": "(3/4) در حال راه‌اندازی وضعیت کاربر...", + "initializing": "(1/4) در حال راه‌اندازی برنامه..." }, "autoGenerate": "تکمیل خودکار", "autoGenerateTooltip": "تکمیل خودکار توضیحات دستیار بر اساس کلمات راهنما", diff --git a/locales/fr-FR/common.json b/locales/fr-FR/common.json index db3dfb8e01c1..f44bbadbb90f 100644 --- a/locales/fr-FR/common.json +++ b/locales/fr-FR/common.json @@ -10,8 +10,10 @@ } }, "appLoading": { - "goToChat": "Chargement de la page de discussion...", - "initializing": "L'application se lance..." + "goToChat": "(4/4) Chargement de la page de conversation...", + "initAuth": "(2/4) Initialisation du service d'authentification...", + "initUser": "(3/4) Initialisation de l'état de l'utilisateur...", + "initializing": "(1/4) L'application se lance..." }, "autoGenerate": "Générer automatiquement", "autoGenerateTooltip": "Générer automatiquement la description de l'agent basée sur les suggestions", diff --git a/locales/it-IT/common.json b/locales/it-IT/common.json index 25d3e512bfb0..1233cd6a31a9 100644 --- a/locales/it-IT/common.json +++ b/locales/it-IT/common.json @@ -10,8 +10,10 @@ } }, "appLoading": { - "goToChat": "Caricamento della pagina di chat...", - "initializing": "Avvio dell'applicazione..." + "goToChat": "(4/4) Caricamento della pagina della chat in corso...", + "initAuth": "(2/4) Inizializzazione del servizio di autenticazione...", + "initUser": "(3/4) Inizializzazione dello stato utente...", + "initializing": "(1/4) Avvio dell'app in corso..." }, "autoGenerate": "Generazione automatica", "autoGenerateTooltip": "Completamento automatico basato su suggerimenti", diff --git a/locales/ja-JP/common.json b/locales/ja-JP/common.json index 04431e4a6a1f..5b82d11414c7 100644 --- a/locales/ja-JP/common.json +++ b/locales/ja-JP/common.json @@ -10,8 +10,10 @@ } }, "appLoading": { - "goToChat": "チャットページを読み込んでいます...", - "initializing": "アプリを起動しています..." + "goToChat": "(4/4) チャットページを読み込んでいます...", + "initAuth": "(2/4) 認証サービスの初期化...", + "initUser": "(3/4) ユーザー状態の初期化...", + "initializing": "(1/4) アプリを起動しています..." }, "autoGenerate": "自動生成", "autoGenerateTooltip": "ヒントに基づいてエージェントの説明を自動生成します", diff --git a/locales/ko-KR/common.json b/locales/ko-KR/common.json index 0d3260502b7e..e36c7aa5dbe5 100644 --- a/locales/ko-KR/common.json +++ b/locales/ko-KR/common.json @@ -10,8 +10,10 @@ } }, "appLoading": { - "goToChat": "대화 페이지 로딩 중...", - "initializing": "앱 시작 중..." + "goToChat": "(4/4) 대화 페이지 로딩 중...", + "initAuth": "(2/4) 인증 서비스 초기화 중...", + "initUser": "(3/4) 사용자 상태 초기화 중...", + "initializing": "(1/4) 애플리케이션 시작 중..." }, "autoGenerate": "자동 생성", "autoGenerateTooltip": "힌트 단어를 기반으로 에이전트 설명을 자동으로 완성합니다", diff --git a/locales/nl-NL/common.json b/locales/nl-NL/common.json index 1f4ae9829fb1..2a3bd1d66f62 100644 --- a/locales/nl-NL/common.json +++ b/locales/nl-NL/common.json @@ -10,8 +10,10 @@ } }, "appLoading": { - "goToChat": "De chatpagina wordt geladen...", - "initializing": "De applicatie wordt gestart..." + "goToChat": "(4/4) De chatpagina wordt geladen...", + "initAuth": "(2/4) Initialisatie van de autorisatiedienst...", + "initUser": "(3/4) Initialisatie van de gebruikersstatus...", + "initializing": "(1/4) De applicatie wordt opgestart..." }, "autoGenerate": "Automatisch genereren", "autoGenerateTooltip": "Automatisch assistentbeschrijving genereren op basis van suggesties", diff --git a/locales/pl-PL/common.json b/locales/pl-PL/common.json index 8217dc0848a0..ad08b65bf3cd 100644 --- a/locales/pl-PL/common.json +++ b/locales/pl-PL/common.json @@ -10,8 +10,10 @@ } }, "appLoading": { - "goToChat": "Ładowanie strony czatu...", - "initializing": "Uruchamianie aplikacji..." + "goToChat": "(4/4) Ładowanie strony czatu...", + "initAuth": "(2/4) Inicjalizacja usługi autoryzacji...", + "initUser": "(3/4) Inicjalizacja stanu użytkownika...", + "initializing": "(1/4) Uruchamianie aplikacji..." }, "autoGenerate": "Automatyczne generowanie", "autoGenerateTooltip": "Automatyczne uzupełnianie opisu asystenta na podstawie sugestii", diff --git a/locales/pt-BR/common.json b/locales/pt-BR/common.json index 154cc7e790c2..a73e404015ba 100644 --- a/locales/pt-BR/common.json +++ b/locales/pt-BR/common.json @@ -10,8 +10,10 @@ } }, "appLoading": { - "goToChat": "Carregando página de chat...", - "initializing": "Iniciando aplicativo..." + "goToChat": "(4/4) Carregando página de conversa...", + "initAuth": "(2/4) Inicializando o serviço de autenticação...", + "initUser": "(3/4) Inicializando o estado do usuário...", + "initializing": "(1/4) Iniciando aplicativo..." }, "autoGenerate": "Auto completar", "autoGenerateTooltip": "Auto completar descrição do assistente com base em sugestões", diff --git a/locales/ru-RU/common.json b/locales/ru-RU/common.json index 6cac0a62387f..922d55de3bec 100644 --- a/locales/ru-RU/common.json +++ b/locales/ru-RU/common.json @@ -10,8 +10,10 @@ } }, "appLoading": { - "goToChat": "Загрузка страницы чата...", - "initializing": "Запуск приложения..." + "goToChat": "(4/4) Загрузка страницы чата...", + "initAuth": "(2/4) Инициализация службы аутентификации...", + "initUser": "(3/4) Инициализация состояния пользователя...", + "initializing": "(1/4) Запуск приложения..." }, "autoGenerate": "Автозаполнение", "autoGenerateTooltip": "Автоматическое дополнение описания агента на основе подсказок", diff --git a/locales/tr-TR/common.json b/locales/tr-TR/common.json index 82e6cc043359..0e6ab2da8086 100644 --- a/locales/tr-TR/common.json +++ b/locales/tr-TR/common.json @@ -10,8 +10,10 @@ } }, "appLoading": { - "goToChat": "Sohbet sayfası yükleniyor...", - "initializing": "Uygulama başlatılıyor..." + "goToChat": "(4/4) Sohbet sayfası yükleniyor...", + "initAuth": "(2/4) Kimlik doğrulama hizmeti başlatılıyor...", + "initUser": "(3/4) Kullanıcı durumu başlatılıyor...", + "initializing": "(1/4) Uygulama başlatılıyor..." }, "autoGenerate": "Otomatik Oluştur", "autoGenerateTooltip": "Auto-generate agent description based on prompts", diff --git a/locales/vi-VN/common.json b/locales/vi-VN/common.json index b9b875b14e04..3fc81321578e 100644 --- a/locales/vi-VN/common.json +++ b/locales/vi-VN/common.json @@ -10,8 +10,10 @@ } }, "appLoading": { - "goToChat": "Đang tải trang trò chuyện...", - "initializing": "Đang khởi động ứng dụng..." + "goToChat": "(4/4) Đang tải trang trò chuyện...", + "initAuth": "(2/4) Đang khởi tạo dịch vụ xác thực...", + "initUser": "(3/4) Đang khởi tạo trạng thái người dùng...", + "initializing": "(1/4) Đang khởi động ứng dụng..." }, "autoGenerate": "Tự động tạo", "autoGenerateTooltip": "Tự động hoàn thành mô tả trợ lý dựa trên từ gợi ý", diff --git a/locales/zh-CN/common.json b/locales/zh-CN/common.json index b0e7d593450a..2bb3ae7a11dc 100644 --- a/locales/zh-CN/common.json +++ b/locales/zh-CN/common.json @@ -10,8 +10,10 @@ } }, "appLoading": { - "goToChat": "对话页面加载中...", - "initializing": "应用启动中..." + "goToChat": "(4/4) 对话页面加载中...", + "initAuth": "(2/4) 鉴权服务初始化...", + "initUser": "(3/4) 用户状态初始化...", + "initializing": "(1/4) 应用启动中..." }, "autoGenerate": "自动补全", "autoGenerateTooltip": "基于提示词自动补全助手描述", diff --git a/locales/zh-TW/common.json b/locales/zh-TW/common.json index 210585b2617f..60bf44a00455 100644 --- a/locales/zh-TW/common.json +++ b/locales/zh-TW/common.json @@ -10,8 +10,10 @@ } }, "appLoading": { - "goToChat": "對話頁面加載中...", - "initializing": "應用啟動中..." + "goToChat": "(4/4) 對話頁面加載中...", + "initAuth": "(2/4) 鑑權服務初始化...", + "initUser": "(3/4) 使用者狀態初始化...", + "initializing": "(1/4) 應用啟動中..." }, "autoGenerate": "自動生成", "autoGenerateTooltip": "基於提示詞自動生成助手描述", diff --git a/next.config.mjs b/next.config.mjs index 5ccf88163ec9..42ea0082bb00 100644 --- a/next.config.mjs +++ b/next.config.mjs @@ -159,6 +159,11 @@ const nextConfig = { permanent: true, source: '/settings', }, + { + destination: '/chat', + permanent: true, + source: '/welcome', + }, ], rewrites: async () => [ diff --git a/src/app/loading/Content.tsx b/src/app/loading/Content.tsx index be72b7b8f437..63a9775e8b1f 100644 --- a/src/app/loading/Content.tsx +++ b/src/app/loading/Content.tsx @@ -3,12 +3,15 @@ import { useTranslation } from 'react-i18next'; import FullscreenLoading from '@/components/FullscreenLoading'; -const Content = memo<{ goToChat: boolean }>(({ goToChat }) => { +import { AppLoadingStage } from './type'; + +interface ContentProps { + loadingStage: AppLoadingStage; +} +const Content = memo(({ loadingStage }) => { const { t } = useTranslation('common'); - return ( - - ); + return ; }); export default Content; diff --git a/src/app/loading/Redirect.tsx b/src/app/loading/Redirect.tsx index 7242650a6cdd..e7f120a5d81d 100644 --- a/src/app/loading/Redirect.tsx +++ b/src/app/loading/Redirect.tsx @@ -8,11 +8,13 @@ import { systemStatusSelectors } from '@/store/global/selectors'; import { useUserStore } from '@/store/user'; import { authSelectors } from '@/store/user/selectors'; +import { AppLoadingStage } from './type'; + interface RedirectProps { - setGoToChat: (value: boolean) => void; + setLoadingStage: (value: AppLoadingStage) => void; } -const Redirect = memo(({ setGoToChat }) => { +const Redirect = memo(({ setLoadingStage }) => { const router = useRouter(); const [isLogin, isLoaded, isUserStateInit, isOnboard] = useUserStore((s) => [ authSelectors.isLogin(s), @@ -23,7 +25,7 @@ const Redirect = memo(({ setGoToChat }) => { const isPgliteNotEnabled = useGlobalStore(systemStatusSelectors.isPgliteNotEnabled); const navToChat = () => { - setGoToChat(true); + setLoadingStage(AppLoadingStage.GoToChat); router.replace('/chat'); }; @@ -35,7 +37,10 @@ const Redirect = memo(({ setGoToChat }) => { } // if user auth state is not ready, wait for loading - if (!isLoaded) return; + if (!isLoaded) { + setLoadingStage(AppLoadingStage.InitAuth); + return; + } // this mean user is definitely not login if (!isLogin) { @@ -44,7 +49,10 @@ const Redirect = memo(({ setGoToChat }) => { } // if user state not init, wait for loading - if (!isUserStateInit) return; + if (!isUserStateInit) { + setLoadingStage(AppLoadingStage.InitUser); + return; + } // user need to onboard if (!isOnboard) { diff --git a/src/app/loading/index.tsx b/src/app/loading/index.tsx index 6c92febcf1a9..27d7376f9816 100644 --- a/src/app/loading/index.tsx +++ b/src/app/loading/index.tsx @@ -2,15 +2,17 @@ import { useState } from 'react'; +import { AppLoadingStage } from '@/app/loading/type'; + import Client from './Content'; import Redirect from './Redirect'; const ScreenLoading = () => { - const [goToChat, setGoToChat] = useState(false); + const [loadingStage, setLoadingStage] = useState(AppLoadingStage.Initializing); return ( <> - - + + ); }; diff --git a/src/app/loading/type.ts b/src/app/loading/type.ts new file mode 100644 index 000000000000..28e401e5abac --- /dev/null +++ b/src/app/loading/type.ts @@ -0,0 +1,6 @@ +export enum AppLoadingStage { + GoToChat = 'goToChat', + InitAuth = 'initAuth', + InitUser = 'initUser', + Initializing = 'initializing', +} diff --git a/src/components/FullscreenLoading/index.tsx b/src/components/FullscreenLoading/index.tsx index 9d82d5c9f483..b5868ddafac8 100644 --- a/src/components/FullscreenLoading/index.tsx +++ b/src/components/FullscreenLoading/index.tsx @@ -1,11 +1,11 @@ import { Icon } from '@lobehub/ui'; import { Loader2 } from 'lucide-react'; -import { memo } from 'react'; +import { ReactNode, memo } from 'react'; import { Center, Flexbox } from 'react-layout-kit'; import { ProductLogo } from '@/components/Branding'; -const FullscreenLoading = memo<{ title?: string }>(({ title }) => { +const FullscreenLoading = memo<{ title?: ReactNode }>(({ title }) => { return (
diff --git a/src/layout/GlobalProvider/index.tsx b/src/layout/GlobalProvider/index.tsx index 79af38c11806..04b72697188a 100644 --- a/src/layout/GlobalProvider/index.tsx +++ b/src/layout/GlobalProvider/index.tsx @@ -25,6 +25,9 @@ import StoreInitialization from './StoreInitialization'; import StyleRegistry from './StyleRegistry'; const parserFallbackLang = async () => { + // if the default language is not 'en-US', just return the default language as fallback lang + if (DEFAULT_LANG !== 'en-US') return DEFAULT_LANG; + const header = await headers(); /** * The arguments are as follows: diff --git a/src/locales/default/common.ts b/src/locales/default/common.ts index 669e6ba297d0..3da2c7630e58 100644 --- a/src/locales/default/common.ts +++ b/src/locales/default/common.ts @@ -11,8 +11,10 @@ export default { }, }, appLoading: { - goToChat: '对话页面加载中...', - initializing: '应用启动中...', + goToChat: '(4/4) 对话页面加载中...', + initAuth: '(2/4) 鉴权服务初始化...', + initUser: '(3/4) 用户状态初始化...', + initializing: '(1/4) 应用启动中...', }, autoGenerate: '自动补全', autoGenerateTooltip: '基于提示词自动补全助手描述',