feat: 增加网络状态的全局管理

shared/index.tsx

@@ -169,7 +169,12 @@ export {
   useUserId,
   useUserInfoList,
 } from './redux/hooks/useUserInfo';
-export { userActions, groupActions, uiActions } from './redux/slices';
+export {
+  userActions,
+  groupActions,
+  uiActions,
+  globalActions,
+} from './redux/slices';
 export type { ChatConverseState } from './redux/slices/chat';
 export { setupRedux } from './redux/setup';
 export { createStore, ReduxProvider } from './redux/store';

shared/redux/setup.ts

@@ -1,6 +1,11 @@
 import type { AppStore } from './store';
 import type { AppSocket } from '../api/socket';
-import { chatActions, groupActions, userActions } from './slices';
+import {
+  chatActions,
+  globalActions,
+  groupActions,
+  userActions,
+} from './slices';
 import type { FriendRequest } from '../model/friend';
 import { getCachedConverseInfo } from '../cache/cache';
 import type { GroupInfo } from '../model/group';
@@ -18,12 +23,14 @@ import {
   fetchUserAck,
 } from '../model/converse';
 import { appendUserDMConverse } from '../model/user';
+import { sharedEvent } from '../event';
 
 /**
  * 初始化 Redux 上下文
  * 该文件用于处理远程数据与本地 Redux 状态的交互
  */
 export function setupRedux(socket: AppSocket, store: AppStore) {
+  store.dispatch(globalActions.setNetworkStatus('initial'));
   initial(socket, store);
   listenNotify(socket, store);
 
@@ -32,6 +39,10 @@ export function setupRedux(socket: AppSocket, store: AppStore) {
     console.warn('因为断线重连触发重新同步远程数据');
     initial(socket, store);
   });
+
+  sharedEvent.on('updateNetworkStatus', (status) => {
+    store.dispatch(globalActions.setNetworkStatus(status));
+  });
 }
 
 /**

shared/redux/slices/global.ts

@@ -0,0 +1,28 @@
+import { createSlice, PayloadAction } from '@reduxjs/toolkit';
+
+export interface GlobalState {
+  /**
+   * 网络状态
+   */
+  networkStatus: 'initial' | 'connected' | 'reconnecting' | 'disconnected';
+}
+
+const initialState: GlobalState = {
+  networkStatus: 'initial',
+};
+
+const globalSlice = createSlice({
+  name: 'global',
+  initialState,
+  reducers: {
+    setNetworkStatus(
+      state,
+      action: PayloadAction<GlobalState['networkStatus']>
+    ) {
+      state.networkStatus = action.payload;
+    },
+  },
+});
+
+export const globalActions = globalSlice.actions;
+export const globalReducer = globalSlice.reducer;

shared/redux/slices/index.ts

@@ -3,8 +3,10 @@ import { userReducer } from './user';
 import { chatReducer } from './chat';
 import { groupReducer } from './group';
 import { uiReducer } from './ui';
+import { globalReducer } from './global';
 
 export const appReducer = combineReducers({
+  global: globalReducer,
   user: userReducer,
   chat: chatReducer,
   group: groupReducer,
@@ -13,6 +15,7 @@ export const appReducer = combineReducers({
 
 export type AppState = ReturnType<typeof appReducer>;
 
+export { globalActions } from './global';
 export { userActions } from './user';
 export { chatActions } from './chat';
 export { groupActions } from './group';

web/src/components/GlobalTemporaryTip.tsx

@@ -38,7 +38,6 @@ export const GlobalTemporaryTip: React.FC = React.memo(() => {
           立即认领
         </Button>
       </Trans>
-      {t('')}
     </div>
   ) : null;
 });