refactor: re-login modal

src/app/slices/auth.data.ts

@@ -1,5 +1,5 @@
 import { createSlice, PayloadAction } from "@reduxjs/toolkit";
-import { isNull, omitBy } from "lodash";
+// import { isNull, omitBy } from "lodash";
 import {
   KEY_EXPIRE,
   KEY_PWA_INSTALLED,
@@ -10,7 +10,7 @@ import {
 } from "../config";
 import { AuthData, RenewTokenResponse } from "../../types/auth";
 import { User } from "../../types/user";
-import { updateUsersByLogs } from './users';
+// import { updateUsersByLogs } from './users';
 
 interface State {
   initialized: boolean;
@@ -50,7 +50,7 @@ const authDataSlice = createSlice({
       const { initialized = true, user, token, refresh_token, expired_in = 0 } = payload;
       const { uid, create_by } = user;
       state.initialized = initialized;
-      state.user = user;
+      state.user = { ...state.user, ...user };
       state.guest = create_by == "guest";
       state.token = token;
       state.refreshToken = refresh_token;
@@ -79,8 +79,8 @@ const authDataSlice = createSlice({
       state.user = obj;
       localStorage.setItem(KEY_LOGIN_USER, JSON.stringify(obj));
     },
-    resetRoleChanged(state) {
+    updateRoleChanged(state, action: PayloadAction<boolean>) {
-      state.roleChanged = false;
+      state.roleChanged = action.payload;
     },
     resetAuthData() {
       // remove local data
@@ -106,27 +106,27 @@ const authDataSlice = createSlice({
       localStorage.setItem(KEY_REFRESH_TOKEN, refresh_token);
     }
   },
-  extraReducers: (builder) => {
+  // extraReducers: (builder) => {
-    builder.addCase(updateUsersByLogs, (state, action) => {
+  //   builder.addCase(updateUsersByLogs, (state, action) => {
-      const changeLogs = action.payload;
+  //     const changeLogs = action.payload;
-      const currUid = Number(localStorage.getItem(KEY_UID) ?? 0);
+  //     const currUid = Number(localStorage.getItem(KEY_UID) ?? 0);
-      changeLogs.forEach(({ action, uid, ...rest }) => {
+  //     changeLogs.forEach(({ action, uid, ...rest }) => {
-        if (uid == currUid && action == "update") {
+  //       if (uid == currUid && action == "update") {
-          const vals = omitBy(rest, isNull);
+  //         const vals = omitBy(rest, isNull);
-          const logId = state.user?.log_id ?? 0;
+  //         // const logId = state.user?.log_id ?? Number.MAX_SAFE_INTEGER;
-          Object.keys(vals).forEach((k) => {
+  //         Object.keys(vals).forEach((k) => {
-            if (k == "is_admin" && vals.log_id > logId && vals.is_admin !== state.user?.is_admin) {
+  //           console.log("upppp 2 ", vals.is_admin, state.user?.is_admin);
-              console.log("upppp 2 ", vals, state.user?.is_bot, state.user?.log_id);
+  //           if (k == "is_admin" && vals.is_admin !== state.user?.is_admin) {
-              // 用户角色有变化
+  //             // 用户角色有变化
-              state.roleChanged = true;
+  //             state.roleChanged = true;
-            }
+  //           }
-          });
+  //         });
-        }
+  //       }
-      });
+  //     });
 
-    });
+  //   });
-  }
+  // }
 });
 
-export const { updateInitialized, updateLoginUser, setAuthData, resetAuthData, updateToken, resetRoleChanged } = authDataSlice.actions;
+export const { updateInitialized, updateLoginUser, setAuthData, resetAuthData, updateToken, updateRoleChanged } = authDataSlice.actions;
 export default authDataSlice.reducer;

src/common/component/ReLoginModal.tsx

@@ -6,7 +6,7 @@ import Button from "../../common/component/styled/Button";
 import useLogout from "../../common/hook/useLogout";
 import { useTranslation } from "react-i18next";
 import { useDispatch } from "react-redux";
-import { resetRoleChanged } from "../../app/slices/auth.data";
+import { updateRoleChanged } from "../../app/slices/auth.data";
 
 interface Props {
     reasonType?: "role_changed",
@@ -21,7 +21,7 @@ const ReLoginModal: FC<Props> = ({ reasonType = "role_changed" }) => {
         logout();
     };
     const handleReset = () => {
-        dispatch(resetRoleChanged());
+        dispatch(updateRoleChanged(false));
     };
     useEffect(() => {
         if (exited) {

src/common/hook/useStreaming/index.ts

@@ -20,7 +20,7 @@ import {
   updateAutoDeleteSetting
 } from "../../../app/slices/footprint";
 import { updateUsersByLogs, updateUsersStatus } from "../../../app/slices/users";
-import { resetAuthData, updateLoginUser } from "../../../app/slices/auth.data";
+import { resetAuthData, updateLoginUser, updateRoleChanged } from "../../../app/slices/auth.data";
 import chatMessageHandler from "./chat.handler";
 import { useAppDispatch, useAppSelector } from "../../../app/store";
 import { ServerEvent, UsersStateEvent } from "../../../types/sse";
@@ -40,14 +40,13 @@ const getQueryString = (params: { [key: string]: string }) => {
 };
 
 let SSE: EventSource | undefined;
-// let opened = false; //标识SSE打开过
+let ready = false; //是否已完成初始推送
 let aliveInter: number | ReturnType<typeof setTimeout> = 0;
 export default function useStreaming() {
   const [renewToken] = useRenewMutation();
   const [streamingReady, setStreamingReady] = useState(false);
   const {
-    authData: { user },
+    authData: { user, guest },
-    ui: { ready },
     footprint: { afterMid, usersVersion, readUsers, readChannels }
   } = useAppSelector((store) => store);
   const dispatch = useAppDispatch();
@@ -116,6 +115,7 @@ export default function useStreaming() {
     SSE = new EventSource(`${BASE_URL}/user/events?${getQueryString(params)}`);
 
     SSE.onopen = () => {
+      ready = false;
       //todo
       // opened = true;
       // connectionIsOpen = true;
@@ -139,6 +139,7 @@ export default function useStreaming() {
           keepAlive();
           break;
         case "ready":
+          ready = true;
           // 有时候，heartbeat不会发？
           keepAlive();
           dispatch(setReady());
@@ -155,7 +156,14 @@ export default function useStreaming() {
           logs.forEach((log) => {
             const { uid, action, ...rest } = log;
             if (uid === loginUid && action === "update") {
-              dispatch(updateLoginUser(omitBy(rest, isNull)));
+              const purified = omitBy(rest, isNull);
+              dispatch(updateLoginUser(purified));
+              console.log("upppp 3", purified, ready, user?.is_admin);
+
+              if (!guest && typeof purified.is_admin !== "undefined" && ready && user?.is_admin !== purified.is_admin) {
+                // ready 之后，登录用户有角色变动
+                dispatch(updateRoleChanged(true));
+              }
             }
             if (action === "delete") {
               // 同时删掉对应的聊天记录
@@ -294,7 +302,7 @@ export default function useStreaming() {
           break;
       }
     };
-  }, [afterMid, usersVersion]);
+  }, [afterMid, usersVersion, user, guest]);
 
   const stopStreaming = () => {
     // 先清掉定时器