refactor: prefetch basic data and window visibility change event in streaming

src/app/services/auth.ts

@@ -217,6 +217,7 @@ export const {
   useLazyGuestLoginQuery,
   useGuestLoginQuery,
   useLazyCheckEmailQuery,
+  useLazyGetInitializedQuery,
   useGetInitializedQuery,
   useSendLoginMagicLinkMutation,
   useSendRegMagicLinkMutation,

src/app/services/server.ts

@@ -237,7 +237,17 @@ export const serverApi = createApi({
       })
     }),
     getLoginConfig: builder.query<LoginConfig, void>({
-      query: () => ({ url: `/admin/login/config` })
+      query: () => ({ url: `/admin/login/config` }),
+      async onQueryStarted(data, { dispatch, queryFulfilled }) {
+        try {
+          const resp = await queryFulfilled;
+          if (resp.data) {
+            dispatch(updateInfo({ loginConfig: resp.data }));
+          }
+        } catch {
+          console.error("get login config error");
+        }
+      }
     }),
     getFiles: builder.query<VoceChatFile[], GetFilesDTO>({
       query: (params) => ({

src/app/slices/server.ts

@@ -1,5 +1,5 @@
 import { createSlice, PayloadAction } from "@reduxjs/toolkit";
-import { Server } from "@/types/server";
+import { LoginConfig, Server } from "@/types/server";
 
 export interface StoredServer extends Server {
   version: string;
@@ -9,6 +9,7 @@ export interface StoredServer extends Server {
     link: string;
     expire: number;
   };
+  loginConfig: LoginConfig | null;
 }
 const initialState: StoredServer = {
   version: "",
@@ -23,7 +24,8 @@ const initialState: StoredServer = {
   show_user_online_status: false,
   webclient_auto_update: true,
   contact_verification_enable: false,
-  chat_layout_mode: "Left"
+  chat_layout_mode: "Left",
+  loginConfig: null
 };
 
 const serverSlice = createSlice({
@@ -47,7 +49,8 @@ const serverSlice = createSlice({
         show_user_online_status = true,
         webclient_auto_update = true,
         contact_verification_enable = false,
-        chat_layout_mode = "Left"
+        chat_layout_mode = "Left",
+        loginConfig = state.loginConfig || null
       } = action.payload || {};
       return {
         version,
@@ -59,7 +62,8 @@ const serverSlice = createSlice({
         show_user_online_status,
         webclient_auto_update,
         contact_verification_enable,
-        chat_layout_mode
+        chat_layout_mode,
+        loginConfig
       };
     },
     updateInfo(state, action: PayloadAction<Partial<StoredServer>>) {

src/app/slices/ui.ts

@@ -3,7 +3,9 @@ import { createSlice, PayloadAction } from "@reduxjs/toolkit";
 import { UploadFileData } from "@/hooks/useUploadFile";
 
 export type ListView = "item" | "grid";
-export interface State {
+export type SSEStatus = "connecting" | "connected" | "disconnected";
+export interface UIState {
+  SSEStatus: SSEStatus;
   online: boolean;
   ready: boolean;
   inputMode: "text";
@@ -22,7 +24,8 @@ export interface State {
   };
 }
 
-const initialState: State = {
+const initialState: UIState = {
+  SSEStatus: "disconnected",
   online: true,
   ready: false,
   inputMode: "text",
@@ -49,6 +52,9 @@ const uiSlice = createSlice({
     setReady(state) {
       state.ready = true;
     },
+    updateSSEStatus(state, action: PayloadAction<SSEStatus>) {
+      state.SSEStatus = action.payload;
+    },
     updateOnline(state, action: PayloadAction<boolean>) {
       state.online = action.payload;
     },
@@ -171,6 +177,7 @@ const uiSlice = createSlice({
 });
 
 export const {
+  updateSSEStatus,
   fillUI,
   setReady,
   updateOnline,