feat: guest mode

src/app/cache/useRehydrate.ts

@@ -1,5 +1,5 @@
 import { useState } from "react";
-import { useDispatch, batch } from "react-redux";
+import { useDispatch } from "react-redux";
 import { fillReactionMessage } from "../slices/message.reaction";
 import { fillServer } from "../slices/server";
 import { fillMessage } from "../slices/message";
@@ -10,11 +10,22 @@ import { fillUsers } from "../slices/users";
 import { fillFootprint } from "../slices/footprint";
 import { fillFileMessage } from "../slices/message.file";
 import { fillUI } from "../slices/ui";
+import { useAppSelector } from "../store";
 
 const useRehydrate = () => {
   const [iterated, setIterated] = useState(false);
   const dispatch = useDispatch();
+  const { isGuest } = useAppSelector((store) => {
+    return {
+      isGuest: store.authData.user?.create_by == "guest"
+    };
+  });
   const rehydrate = async () => {
+    // 如果是游客，直接忽略
+    if (isGuest) {
+      setIterated(true);
+      return;
+    }
     const rehydrateData = {
       channels: [],
       users: [],
@@ -74,20 +85,18 @@ const useRehydrate = () => {
         });
       })
     );
-    batch(() => {
-      dispatch(fillUsers(rehydrateData.users));
-      dispatch(fillServer(rehydrateData.server));
-      console.log("fill channels from indexedDB");
-      dispatch(fillChannels(rehydrateData.channels));
-      // file message
-      dispatch(fillFileMessage(rehydrateData.fileMessage.list));
-      dispatch(fillChannelMsg(rehydrateData.channelMessage));
-      dispatch(fillUserMsg(rehydrateData.userMessage));
-      dispatch(fillMessage(rehydrateData.message));
-      dispatch(fillFootprint(rehydrateData.footprint));
-      dispatch(fillUI(rehydrateData.ui));
-      dispatch(fillReactionMessage(rehydrateData.reactionMessage));
-    });
+    dispatch(fillUsers(rehydrateData.users));
+    dispatch(fillServer(rehydrateData.server));
+    console.log("fill channels from indexedDB");
+    dispatch(fillChannels(rehydrateData.channels));
+    // file message
+    dispatch(fillFileMessage(rehydrateData.fileMessage.list));
+    dispatch(fillChannelMsg(rehydrateData.channelMessage));
+    dispatch(fillUserMsg(rehydrateData.userMessage));
+    dispatch(fillMessage(rehydrateData.message));
+    dispatch(fillFootprint(rehydrateData.footprint));
+    dispatch(fillUI(rehydrateData.ui));
+    dispatch(fillReactionMessage(rehydrateData.reactionMessage));
 
     setIterated(true);
     console.log("iterate results", rehydrateData, results);

src/app/listener.middleware/index.ts

@@ -10,6 +10,7 @@ import fileMessageHandler from "./handler.file.msg";
 import reactionHandler from "./handler.reaction";
 import UIHandler from "./handler.ui";
 import footprintHandler from "./handler.footprint";
+import { RootState } from "../store";
 
 const operations = [
   "__rtkq",
@@ -41,11 +42,14 @@ listenerMiddleware.startListening({
   },
   effect: async (action, listenerApi) => {
     const { type = "", payload } = action;
-    const [prefix, operation] = type.split("/");
+    const [prefix, operation]: [keyof RootState | "__rtkq", string] = type.split("/");
     // console.log("effect opt", action);
     if (!window.CACHE && prefix !== "__rtkq") return;
-
-    const state = listenerApi.getState()[prefix];
+    const currentState = listenerApi.getState() as RootState;
+    // 如果是guest，则忽略
+    const isGuest = currentState.authData.user?.create_by === "guest";
+    if (isGuest) return;
+    const state = prefix == "__rtkq" ? null : currentState[prefix];
     switch (prefix) {
       case "__rtkq":
         {

src/app/services/auth.ts

@@ -57,6 +57,21 @@ export const authApi = createApi({
         }
       }
     }),
+    guestLogin: builder.query<AuthData, void>({
+      query: () => ({ url: "/token/login_guest" }),
+      async onQueryStarted(params, { dispatch, queryFulfilled }) {
+        try {
+          const { data } = await queryFulfilled;
+          if (data) {
+            dispatch(setAuthData(data));
+          }
+          // 从localstorage 去掉 magic token
+          localStorage.removeItem(KEY_LOCAL_MAGIC_TOKEN);
+        } catch {
+          console.log("guest login error");
+        }
+      }
+    }),
     register: builder.mutation<any, any>({
       query: (data) => ({
         url: `user/register`,
@@ -186,6 +201,8 @@ export const authApi = createApi({
 });
 
 export const {
+  useLazyGuestLoginQuery,
+  useGuestLoginQuery,
   useLazyCheckEmailQuery,
   useGetInitializedQuery,
   useSendLoginMagicLinkMutation,

src/app/services/base.query.ts

@@ -6,6 +6,7 @@ import BASE_URL, { tokenHeader } from "../config";
 import { RootState } from "../store";
 
 const whiteList = [
+  "guestLogin",
   "login",
   "register",
   "sendLoginMagicLink",