feat: temp dm session

src/routes/chat/SessionList/index.js

@@ -4,10 +4,10 @@ import Styled from "./styled";
 import Session from "./Session";
 import DeleteChannelConfirmModal from "../../settingChannel/DeleteConfirmModal";
 import InviteModal from "../../../common/component/InviteModal";
-export default function SessionList() {
+export default function SessionList({ tempSession = null }) {
   const [deleteId, setDeleteId] = useState(null);
   const [inviteChannelId, setInviteChannelId] = useState(null);
-  const [sessions, setSessions] = useState([]);
+  const [sessions, setSessions] = useState(tempSession ? [tempSession] : []);
   const { channelIDs, DMs, readChannels, readUsers, channelMessage, userMessage, loginUid } =
     useSelector((store) => {
       return {
@@ -38,11 +38,14 @@ export default function SessionList() {
       return { key: `user_${id}`, type: "user", id, mid };
     });
 
-    setSessions(
-      [...cSessions, ...uSessions].sort((a, b) => {
-        return b.mid - a.mid;
-      })
-    );
+    setSessions((prevs) => {
+      return [
+        ...prevs,
+        ...[...cSessions, ...uSessions].sort((a, b) => {
+          return b.mid - a.mid;
+        })
+      ];
+    });
   }, [channelIDs, DMs, channelMessage, readChannels, readUsers, loginUid, userMessage]);
   return (
     <>

src/routes/chat/index.js

@@ -1,11 +1,11 @@
 // import React from 'react';
 import { useState } from "react";
 import { useParams } from "react-router-dom";
+import { useSelector } from "react-redux";
+
 import StyledWrapper from "./styled";
 import BlankPlaceholder from "../../common/component/BlankPlaceholder";
 import Server from "../../common/component/Server";
-// import Tooltip from "../../common/component/Tooltip";
-// import Contact from "../../common/component/Contact";
 import CurrentUser from "../../common/component/CurrentUser";
 import ChannelChat from "./ChannelChat";
 import DMChat from "./DMChat";
@@ -16,12 +16,21 @@ export default function ChatPage() {
   const [channelModalVisible, setChannelModalVisible] = useState(false);
   const [contactsModalVisible, setContactsModalVisible] = useState(false);
   const { channel_id, user_id } = useParams();
+  const { sessionUids } = useSelector((store) => {
+    return {
+      sessionUids: store.userMessage.ids
+    };
+  });
   const toggleContactsModalVisible = () => {
     setContactsModalVisible((prev) => !prev);
   };
   const toggleChannelModalVisible = () => {
     setChannelModalVisible((prev) => !prev);
   };
+  const tmpSession =
+    sessionUids.findIndex((i) => i == user_id) > -1
+      ? null
+      : { mid: null, unreads: 0, id: user_id, type: "user" };
   // console.log("temp uid", tmpUid);
   const placeholderVisible = !channel_id && !user_id;
   return (
@@ -33,7 +42,7 @@ export default function ChatPage() {
       <StyledWrapper>
         <div className="left">
           <Server />
-          <SessionList />
+          <SessionList tempSession={tmpSession} />
           <CurrentUser />
         </div>
         <div className={`right ${placeholderVisible ? "placeholder" : ""}`}>

src/routes/home/index.js

@@ -40,8 +40,8 @@ export default function HomePage() {
   if (loading || !ready) {
     return <Loading reload={true} fullscreen={true} />;
   }
-  const isSettingPage = isHomePath || pathname.startsWith("/setting");
-  const isChattingPage = pathname.startsWith("/chat");
+  const isSettingPage = pathname.startsWith("/setting");
+  const isChattingPage = isHomePath || pathname.startsWith("/chat");
   if (isSettingPage) {
     return (
       <>