whoops2

client/src/components/chat/MessageForm.tsx

@@ -14,7 +14,6 @@ type Input = {
 
 type MessageFormProps = {
   contact: ContactsProps;
-  setMessages: React.Dispatch<React.SetStateAction<ChatMessages[]>>;
   messages: ChatMessages[];
 };
 
@@ -136,33 +135,35 @@ const MessageForm = ({ contact }: MessageFormProps) => {
       }
     }
 
-    // Emit message to server
+    for (let i = 0; i < 100; i++) {
-    socket.emit(
+      // Emit message to server
-      'chat message',
+      socket.emit(
-      {
+        'chat message',
+        {
+          message: data.message.trim(),
+          recipient: contact.conversation_id,
+          attachment_urls: attachmentUrls,
+          recipient_id: contact.user_id,
+        },
+        (response: { status: string; message: string }) => {
+          if (response.status === 'ok') {
+            setIsSending(false);
+            reset({ message: '' });
+            handleClearFiles();
+          } else {
+            setIsSending(false);
+            setErrorMessage(response.message);
+          }
+          console.log('Response: ', response);
+        },
+      );
+      console.log('sent: ', {
         message: data.message.trim(),
         recipient: contact.conversation_id,
         attachment_urls: attachmentUrls,
         recipient_id: contact.user_id,
-      },
+      });
-      (response: { status: string; message: string }) => {
+    }
-        if (response.status === 'ok') {
-          setIsSending(false);
-          reset({ message: '' });
-          handleClearFiles();
-        } else {
-          setIsSending(false);
-          setErrorMessage(response.message);
-        }
-        console.log('Response: ', response);
-      },
-    );
-    console.log('sent: ', {
-      message: data.message.trim(),
-      recipient: contact.conversation_id,
-      attachment_urls: attachmentUrls,
-      recipient_id: contact.user_id,
-    });
   };
 
   const handleKeyPress: KeyboardEventHandler<HTMLTextAreaElement> = (e) => {

client/src/pages/Chat.tsx

@@ -138,7 +138,12 @@ function Chat() {
       messages.messages.forEach((msg) => {
         setMessages((prevMessages) => {
           if (!prevMessages.some((m) => m.message_id === msg.message_id)) {
-            return [msg, ...prevMessages];
+            const messageWithDate = {
+              ...msg,
+              sent_at: new Date(msg.sent_at),
+            };
+
+            return [messageWithDate, ...prevMessages];
           }
           return prevMessages;
         });
@@ -247,11 +252,7 @@ function Chat() {
 
           <div className="flex-shrink-0 mb-2 mt-0">
             {currentContact && currentContact.username?.length >= 4 ? (
-              <MessageForm
+              <MessageForm contact={currentContact} messages={messages} />
-                contact={currentContact}
-                setMessages={setMessages}
-                messages={messages}
-              />
             ) : null}
           </div>
         </div>