feat: message reply

src/app/slices/auth.data.js

@@ -1,9 +1,15 @@
 import { createSlice } from "@reduxjs/toolkit";
-import BASE_URL, { KEY_REFRESH_TOKEN, KEY_TOKEN, KEY_UID } from "../config";
+import BASE_URL, {
+  KEY_REFRESH_TOKEN,
+  KEY_TOKEN,
+  KEY_UID,
+  KEY_EXPIRE,
+} from "../config";
 import { getNonNullValues } from "../../common/utils";
 const initialState = {
   user: null,
   token: localStorage.getItem(KEY_TOKEN),
+  expireTime: localStorage.getItem(KEY_EXPIRE) || new Date().getTime(),
   refreshToken: localStorage.getItem(KEY_REFRESH_TOKEN),
 };
 const authDataSlice = createSlice({
@@ -11,11 +17,16 @@ const authDataSlice = createSlice({
   initialState,
   reducers: {
     setAuthData(state, action) {
-      const { user, token, refresh_token } = action.payload;
+      const { user, token, refresh_token, expired_in = 0 } = action.payload;
       state.user = user;
       state.token = token;
       state.refreshToken = refresh_token;
+      // 当前时间往后推expire时长
+      console.log("expire", expired_in);
+      const expireTime = new Date().getTime() + Number(expired_in) * 1000;
+      state.expireTime = expireTime;
       // set local data
+      localStorage.setItem(KEY_EXPIRE, expireTime);
       localStorage.setItem(KEY_TOKEN, token);
       localStorage.setItem(KEY_REFRESH_TOKEN, refresh_token);
       localStorage.setItem(KEY_UID, user.uid);
@@ -51,15 +62,19 @@ const authDataSlice = createSlice({
       state.token = null;
       state.refreshToken = null;
       // remove local data
+      localStorage.removeItem(KEY_EXPIRE);
       localStorage.removeItem(KEY_TOKEN);
       localStorage.removeItem(KEY_REFRESH_TOKEN);
       localStorage.removeItem(KEY_UID);
     },
     updateToken(state, action) {
-      const { token, refresh_token } = action.payload;
+      const { token, refresh_token, expired_in } = action.payload;
       console.log("refresh token");
       state.token = token;
+      const et = new Date().getTime() + Number(expired_in) * 1000;
+      state.expireTime = et;
       state.refreshToken = refresh_token;
+      localStorage.setItem(KEY_EXPIRE, et);
       localStorage.setItem(KEY_TOKEN, token);
       localStorage.setItem(KEY_REFRESH_TOKEN, refresh_token);
     },

src/app/slices/message.handler.js

@@ -33,11 +33,16 @@ export const msgAdd = (state, payload) => {
     content,
     created_at,
     mid,
+    reply_mid = null,
     from_uid,
     content_type,
     unread = true,
   } = payload;
   const newMsg = { content, content_type, created_at, from_uid, unread };
+
+  if (reply_mid && state[id][reply_mid]) {
+    newMsg.reply = { mid: reply_mid, ...state[id][reply_mid] };
+  }
   if (state[id]) {
     let replaceMsg = state[id][mid];
     // 如果存在，并且新消息和缓存消息不一样，则替换掉，并且改为已读（可能有问题）

src/app/slices/message.pending.js

@@ -1,6 +1,7 @@
 import { createSlice } from "@reduxjs/toolkit";
 
 const initialState = {
+  reply: {},
   user: {},
   channel: {},
 };
@@ -18,6 +19,17 @@ const pendingMessageSlice = createSlice({
       curr[mid] = { ...msg, pending: true };
       state[type][id] = curr;
     },
+    setReplyMessage(state, action) {
+      const { id, msg } = action.payload;
+      console.log("reply to ", id, msg);
+      state.reply[id] = msg;
+    },
+    removeReplyMessage(state, action) {
+      const id = action.payload;
+      if (state.reply[id]) {
+        delete state.reply[id];
+      }
+    },
     removePendingMessage(state, action) {
       const { id, mid, type = "user" } = action.payload;
       console.log("remove msg", type, id, mid);
@@ -29,5 +41,7 @@ export const {
   clearPendingMsg,
   addPendingMessage,
   removePendingMessage,
+  removeReplyMessage,
+  setReplyMessage,
 } = pendingMessageSlice.actions;
 export default pendingMessageSlice.reducer;