feat: users online status

src/routes/chat/ChannelChat/index.js

@@ -10,7 +10,6 @@ import {
   clearChannelMsgUnread,
   setLastAccessTime,
 } from "../../../app/slices/message.channel";
-import { useGetContactsQuery } from "../../../app/services/contact";
 import Contact from "../../../common/component/Contact";
 import Layout from "../Layout";
 import {
@@ -29,10 +28,9 @@ export default function ChannelChat({
   // const containerRef = useRef(null);
   const [dragFiles, setDragFiles] = useState([]);
   const dispatch = useDispatch();
-  const msgs = useSelector((store) => {
-    return store.channelMsg[cid] || {};
+  const { msgs, users } = useSelector((store) => {
+    return { msgs: store.channelMsg[cid] || {}, users: store.contacts };
   });
-  const { data: users } = useGetContactsQuery();
   const handleClearUnreads = () => {
     dispatch(clearChannelMsgUnread(cid));
   };

src/routes/chat/DMChat/index.js

@@ -3,7 +3,6 @@ import { useSelector } from "react-redux";
 import Message from "../../../common/component/Message";
 import Send from "../../../common/component/Send";
 import Contact from "../../../common/component/Contact";
-import { useGetContactsQuery } from "../../../app/services/contact";
 import Layout from "../Layout";
 
 import { StyledHeader, StyledDMChat } from "./styled";
@@ -11,10 +10,10 @@ import { StyledHeader, StyledDMChat } from "./styled";
 export default function DMChat({ uid = "", dropFiles = [] }) {
   console.log("dm files", dropFiles);
   const [dragFiles, setDragFiles] = useState([]);
+  const contacts = useSelector((store) => store.contacts);
   const msgs = useSelector((store) => {
     return store.userMsg[uid] || {};
   });
-  const { data: contacts } = useGetContactsQuery();
   const [currUser, setCurrUser] = useState(null);
   useEffect(() => {
     console.log({ uid });

src/routes/chat/index.js

@@ -6,7 +6,6 @@ import { useSelector } from "react-redux";
 import { MdAdd } from "react-icons/md";
 import { AiOutlineCaretDown } from "react-icons/ai";
 
-import { useGetContactsQuery } from "../../app/services/contact";
 import StyledWrapper from "./styled";
 import Search from "../../common/component/Search";
 import Avatar from "../../common/component/Avatar";
@@ -31,7 +30,7 @@ export default function ChatPage() {
   const [channelModalVisible, setChannelModalVisible] = useState(false);
   const [contactsModalVisible, setContactsModalVisible] = useState(false);
   const { channel_id, user_id } = useParams();
-  const { data: contacts } = useGetContactsQuery();
+  const contacts = useSelector((store) => store.contacts);
   const toggleContactsModalVisible = () => {
     setContactsModalVisible((prev) => !prev);
   };
@@ -121,7 +120,7 @@ export default function ChatPage() {
                   <Avatar
                     className="avatar"
                     url={tmpSessionUser.avatar}
-                    id={user_id}
+                    name={tmpSessionUser.name}
                   />
                   <div className="details">
                     <div className="up">