[FIX] handling error and not showing InputBox when not authenticated (#…

…107)

* handling error and hiding input when cookies not present

* added an optional chaining if the array is present or not

app/components/inappchat/helpers/sortMessagesByDate.js

@@ -1,5 +1,5 @@
 export default function messagesSortedByDate(messagesArray) {
-  return messagesArray.sort(function (a, b) {
+  return messagesArray?.sort(function (a, b) {
     return a.ts < b.ts ? -1 : a.ts > b.ts ? 1 : 0;
   });
 };

app/components/inappchat/inappchat.js

@@ -27,14 +27,18 @@ const InAppChat = ({ closeChat, cookies, rid }) => {
 
   useEffect(() => {
     const runRealtime = async (token, rid) => {
-      await rcClient.connect({ host: rcURL.host, useSsl });
-      await rcClient.resume({ token });
-      await rcClient.subscribe("stream-room-messages", rid);
-      rcClient.onMessage(() => {
-        // TODO: add the animate function here,
-        // and check if that corresponds to any of the emoji that we want to animate then animate()
-        getData();
-      });
+      try {
+        await rcClient.connect({ host: rcURL.host, useSsl });
+        await rcClient.resume({ token });
+        await rcClient.subscribe("stream-room-messages", rid);
+        rcClient.onMessage(() => {
+          // TODO: add the animate function here,
+          // and check if that corresponds to any of the emoji that we want to animate then animate()
+          getData();
+        });
+      } catch(err) {
+        console.log(err.message);
+      }
     };
     async function getData() {
       const data = await getMessages(rid, cookies);
@@ -94,7 +98,7 @@ const InAppChat = ({ closeChat, cookies, rid }) => {
           )}
         </Box>
       </div>
-      <InappchatTextInput sendMsg={sendMsg} />
+      {cookies.rc_token && cookies.rc_uid && <InappchatTextInput sendMsg={sendMsg} />}
     </div>
   );
 };