commit dd82cbfeb56422482be8fcf57784a8887eb9e9f6
author Michelle Sepkap Sime <simemichelle01@gmail.com> Thu Nov 17 23:31:49 2022 -0500
committer Issam E. Maghni <issam.e.maghni@mailbox.org> Tue Nov 22 02:43:36 2022 +0000
tree a575047521dffe388458d5c9de6cfe8f5fed0a13
parent 533e730dc93b6438c5f8236cd8ded36855a2ebd2

Fix conversation messages

Change-Id: I999839176bf523f1968dada3e3ebd8703f08656f

client/src/pages/Messenger.tsx

diff --git a/client/src/pages/Messenger.tsx b/client/src/pages/Messenger.tsx
index fd8dc99..47567cf 100644
--- a/client/src/pages/Messenger.tsx
+++ b/client/src/pages/Messenger.tsx
@@ -16,8 +16,8 @@
  * <https://www.gnu.org/licenses/>.
  */
 import { Stack } from '@mui/material';
-import { Contact, Conversation } from 'jami-web-common';
-import { useEffect, useState } from 'react';
+import { Contact, Conversation, WebSocketMessageType } from 'jami-web-common';
+import { useContext, useEffect, useState } from 'react';
 
 //import Sound from 'react-sound';
 import ConversationList from '../components/ConversationList';
@@ -26,14 +26,18 @@
 import LoadingPage from '../components/Loading';
 import NewContactForm from '../components/NewContactForm';
 import { useAuthContext } from '../contexts/AuthProvider';
-import { useAppSelector } from '../redux/hooks';
+import { WebSocketContext } from '../contexts/WebSocketProvider';
+import { setRefreshFromSlice } from '../redux/appSlice';
+import { useAppDispatch, useAppSelector } from '../redux/hooks';
 import { MessengerRouteParams } from '../router';
 import { useUrlParams } from '../utils/hooks';
 import AddContactPage from './AddContactPage';
 
 const Messenger = () => {
   const { refresh } = useAppSelector((state) => state.userInfo);
+  const dispatch = useAppDispatch();
   const { account, axiosInstance } = useAuthContext();
+  const webSocket = useContext(WebSocketContext);
 
   const [conversations, setConversations] = useState<Conversation[] | undefined>(undefined);
   const [searchQuery, setSearchQuery] = useState('');
@@ -58,6 +62,16 @@
   }, [axiosInstance, accountId, refresh]);
 
   useEffect(() => {
+    if (!webSocket) {
+      return;
+    }
+
+    const conversationMessageListener = () => dispatch(setRefreshFromSlice());
+    webSocket.bind(WebSocketMessageType.ConversationMessage, conversationMessageListener);
+    return () => webSocket.unbind(WebSocketMessageType.ConversationMessage, conversationMessageListener);
+  }, [webSocket, dispatch]);
+
+  useEffect(() => {
     if (!searchQuery) return;
     const controller = new AbortController();
     // TODO: Type properly https://git.jami.net/savoirfairelinux/jami-web/-/issues/92