fix bugs

src/components/Conversation.jsx

@@ -2,53 +2,72 @@ import React, { useState, useEffect } from "react";
 import ConversationItem from "./ConversationItem";
 import useAllUsersData from "../hooks/useAllUsersData";
 import useUserData from "../hooks/useUserData";
-import useMessagesData from "../hooks/useMessagesData";
+import { getLastMessageBetweenTwoUsers } from "../firebase/chats";
 
 const Conversation = ({ searchQuery, selectedUser, onUserSelect }) => {
   const data = useAllUsersData();
   const loggedInUserData = useUserData();
   const loggedInUserId = loggedInUserData?.id;
-  const selectedUserId = selectedUser?.id;
-  const messages = useMessagesData(loggedInUserId, selectedUserId);
 
   const filteredData = data.filter(
     (item) =>
       item.id !== loggedInUserData?.id &&
       item.name.toLowerCase().includes(searchQuery.toLowerCase().trim())
   );
 
-  const [lastMessage, setLastMessage] = useState(null);
+  const [lastMessages, setLastMessages] = useState({});
+  const [onlineStatus, setOnlineStatus] = useState({});
 
   useEffect(() => {
-    if (messages) {
-      const formattedMessages = Object.entries(messages);
-      setLastMessage(formattedMessages[formattedMessages.length - 1]);
-    }
-  }, [messages]);
+    const fetchUserLastMessages = async () => {
+      const lastMessagesData = {};
+      const onlineStatusData = {};
+      for (const user of filteredData) {
+        const getMessages = await getLastMessageBetweenTwoUsers(
+          loggedInUserId,
+          user.id
+        );
+        lastMessagesData[user.id] = {
+          lastMessage: getMessages?.lastMessage,
+          timestamp: getMessages?.timestamp,
+        };
+        const isOnline = user.isOnline;
+        onlineStatusData[user.id] = isOnline;
+      }
+      setLastMessages(lastMessagesData);
+      setOnlineStatus(onlineStatusData);
+    };
 
-  const lastMessageText = lastMessage?.[1]?.text ? lastMessage?.[1]?.text : "";
-  const lastMessageTimestamp = lastMessage?.[1]?.timestamp
-    ? new Date(lastMessage?.[1]?.timestamp).toLocaleTimeString([], {
-        hour: "2-digit",
-        minute: "2-digit",
-      })
-    : "";
+    if (filteredData.length > 0) {
+      fetchUserLastMessages();
+    }
+  }, [filteredData, loggedInUserId]);
 
   return (
     <div className="p-1">
       {filteredData.length === 0 && (
         <div className="text-gray-400 text-center mt-5">No user found</div>
       )}
-      {filteredData.map((item, index) => (
-        <div className="mt-3" onClick={() => onUserSelect(item)} key={index}>
+      {filteredData.map((item) => (
+        <div className="mt-3" onClick={() => onUserSelect(item)} key={item.id}>
           <ConversationItem
-            message={lastMessageText}
-            time={lastMessageTimestamp}
+            message={lastMessages[item.id]?.lastMessage}
+            time={
+              lastMessages[item.id]?.timestamp
+                ? new Date(lastMessages[item.id]?.timestamp).toLocaleTimeString(
+                    [],
+                    {
+                      hour: "2-digit",
+                      minute: "2-digit",
+                    }
+                  )
+                : ""
+            }
             name={item.name}
-            active={selectedUser?.isOnline}
-            messageStatus={lastMessage?.[1]?.messageStatus}
+            active={onlineStatus[item.id]}
+            messageStatus={lastMessages[item.id]?.messageStatus}
             messageStatusCheckDisplay={
-              loggedInUserId === lastMessage?.[1]?.from
+              loggedInUserId === lastMessages[item.id]?.from
             }
           />
         </div>

src/firebase/chats.js

@@ -67,6 +67,26 @@ export const updateChatBetweenTwoUsers = async (
   }
 };
 
+// Get last message and timestamp between two users
+export const getLastMessageBetweenTwoUsers = async (userId1, userId2) => {
+  const chatId1 = `${userId1}_${userId2}`;
+  const chatId2 = `${userId2}_${userId1}`;
+
+  const chatRef1 = ref(database, `chats/${chatId1}`);
+  const chatRef2 = ref(database, `chats/${chatId2}`);
+
+  const snapshot1 = await get(chatRef1);
+  const snapshot2 = await get(chatRef2);
+
+  if (snapshot1.exists()) {
+    return snapshot1.val();
+  } else if (snapshot2.exists()) {
+    return snapshot2.val();
+  } else {
+    return {};
+  }
+};
+
 // Create a new message node between two users
 export const createMessageNodeBetweenTwoUsers = async (
   userId1,