Added image handling for messaging BOD-187

client/src/components/chat-conversation/chat-conversation.container.jsx

@@ -1,5 +1,5 @@
 import { useMutation, useSubscription } from "@apollo/react-hooks";
-import React from "react";
+import React, { useState } from "react";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
 import { CONVERSATION_SUBSCRIPTION_BY_PK } from "../../graphql/conversations.queries";
@@ -20,6 +20,8 @@ export function ChatConversationContainer({ selectedConversation }) {
     }
   );
 
+  const [markingAsReadInProgress, setMarkingAsReadInProgress] = useState(false);
+
   const [markConversationRead] = useMutation(
     MARK_MESSAGES_AS_READ_BY_CONVERSATION,
     {
@@ -36,9 +38,15 @@ export function ChatConversationContainer({ selectedConversation }) {
       data.conversations_by_pk.messages_aggregate.aggregate.count) ||
     0;
 
-  const handleMarkConversationAsRead = () => {
-    if (unreadCount > 0 && !!selectedConversation) {
-      markConversationRead();
+  const handleMarkConversationAsRead = async () => {
+    if (
+      unreadCount > 0 &&
+      !!selectedConversation &&
+      !markingAsReadInProgress
+    ) {
+      setMarkingAsReadInProgress(true);
+      await markConversationRead();
+      setMarkingAsReadInProgress(false);
     }
   };