fixed some socket not working on production

client/src/components/chat/ContactsList.tsx

@@ -44,20 +44,16 @@ function ContactsList({
   useEffect(() => {
     if (!socket) return;
 
-    socket.on(
+    const handleAddedToGroup = () => {
-      'added to group',
+      fetchContacts();
-      (msg: {
+    };
-        username: string;
+
-        user_id: string;
+    socket.on('added to group', handleAddedToGroup);
-        group_id: string;
+
-        isadmin: false;
+    return () => {
-      }) => {
+      socket?.off('added to group', handleAddedToGroup);
-        console.log('added to group, fetching contacts');
+    };
-        console.error(msg);
+  }, [socket]);
-        fetchContacts();
-      },
-    );
-  }, []);
 
   const fetchContacts = async () => {
     const contacts: ContactsProps[] = await getContactsList();

client/src/components/chat/ParticipantsBar.tsx

@@ -71,50 +71,42 @@ function ParticipantsBar({
   useEffect(() => {
     if (!socket || !contact) return;
 
-    socket.on(
+    const handleAddedToGroup = (msg: {
-      'added to group',
+      username: string;
-      (msg: {
+      user_id: string;
-        username: string;
+      group_id: string;
-        user_id: string;
+      isadmin: false;
-        group_id: string;
+    }) => {
-        isadmin: false;
+      const { group_id } = msg;
-      }) => {
+      if (
-        const { group_id } = msg;
+        msg.group_id == currentContact?.conversation_id &&
-        console.log('Added to group: ', msg);
+        msg.user_id == user?.user_id
-        console.log('Current participants: ', participants);
+      ) {
-        console.log('CURRENTCONTACT: ', currentContact);
+        initializeContact({
-        if (
+          read: true,
-          msg.group_id == currentContact?.conversation_id &&
+          username: msg.username,
-          msg.user_id == user?.user_id
+          user_id: msg.user_id,
-        ) {
+          id: currentContact?.id,
-          initializeContact({
+          type: 'group',
-            read: true,
+          conversation_id: msg.group_id,
-            username: msg.username,
+          last_active: new Date().toString(),
-            user_id: msg.user_id,
+        });
-            id: currentContact?.id,
+      }
-            type: 'group',
-            conversation_id: msg.group_id,
-            last_active: new Date().toString(),
-          });
-        }
 
-        if (group_id === contact.conversation_id) {
+      if (group_id === contact.conversation_id) {
-          setParticipants((prevMembers) => {
+        setParticipants((prevMembers) => {
-            const existingMember = prevMembers.some(
+          const existingMember = prevMembers.some(
-              (m) => m.user_id === msg.user_id,
+            (m) => m.user_id === msg.user_id,
-            );
+          );
-            if (existingMember) {
+          if (existingMember) {
-              return prevMembers;
+            return prevMembers;
-            }
+          }
-            return [...prevMembers, msg];
+          return [...prevMembers, msg];
-          });
+        });
-        }
+      }
-      },
+    };
-    );
 
-    socket.on('left group', (msg: { user_id: string; group_id: string }) => {
+    const handleLeftGroup = (msg: { user_id: string; group_id: string }) => {
-      console.log(`(socket on "left group")`, msg);
-      // Initialize contact again to clear messages and participants list
       if (
         msg.group_id == currentContact?.conversation_id &&
         msg.user_id == user?.user_id
@@ -124,13 +116,16 @@ function ParticipantsBar({
       setParticipants((prevMembers) =>
         prevMembers.filter((member) => member.user_id !== msg.user_id),
       );
-    });
+    };
+
+    socket.on('added to group', handleAddedToGroup);
+    socket.on('left group', handleLeftGroup);
 
     return () => {
-      socket?.off('left group');
+      socket?.off('added to group', handleAddedToGroup);
-      socket?.off('added to group');
+      socket?.off('left group', handleLeftGroup);
     };
-  }, [contact, participants]);
+  }, [socket, contact, currentContact, user?.user_id]);
 
   const handleRemoveUser = async (userId: string) => {
     try {