Fixed bug 516

src/components/DirectChat/DirectChatNewMessage/DirectChatNewMessage.js

@@ -1,4 +1,4 @@
-import React, { useState } from "react";
+import React, { useCallback, useEffect, useState } from "react";
 import PropTypes from "prop-types";
 import {
   DirectChatNewMessageContainer,
@@ -17,6 +17,7 @@ import { useHistory, useLocation } from "react-router-dom";
 
 const DirectChatNewMessage = (props) => {
   const [typedValue, setTypedValue] = useState("");
+  const [isFocused, setIsFocused] = useState(false);
   const dispatch = useDispatch();
   const { t } = useTranslation();
   const location = useLocation();
@@ -24,8 +25,8 @@ const DirectChatNewMessage = (props) => {
   const handleApiResponseSuccess = () => {
     props.refreshChat();
   };
-  const handleSend = () => {
-    console.log(location.state?.offerId);
+  const handleSend = useCallback(() => {
+    console.log(typedValue);
     if (location.state?.offerId) {
       initiateNewChat(typedValue);
     } else {
@@ -38,11 +39,20 @@ const DirectChatNewMessage = (props) => {
       );
     }
     setTypedValue("");
-  };
+  }, [typedValue]);
   const handleMessageSendSuccess = (newChatId) => {
     history.replace(`${newChatId}`);
     dispatch(fetchChats());
   };
+
+  useEffect(() => {
+    const listener = (event) => {
+      if (event.keyCode === 13) handleSend();
+    };
+    if (isFocused) window.addEventListener("keypress", listener);
+    return () => window.removeEventListener("keypress", listener);
+  }, [typedValue]);
+
   const initiateNewChat = (typedValue) => {
     const offerId = location.state.offerId;
     dispatch(
@@ -54,6 +64,8 @@ const DirectChatNewMessage = (props) => {
       <NewMessageField
         placeholder={t("messages.sendPlaceholder")}
         fullWidth
+        onFocus={() => setIsFocused(true)}
+        onBlur={() => setIsFocused(false)}
         italicPlaceholder
         value={typedValue}
         onChange={(typed) => setTypedValue(typed.target.value)}