added loading wheel on images, and fixed auto scroll

server/socket/socket.js

@@ -71,10 +71,10 @@ function initializeSocket(io) {
     }
 
     socket.on("chat message", async (msg, callback) => {
-      const { message, recipient, recipient_id, attachment_url } = msg;
+      const { message, recipient, recipient_id, attachment_urls } = msg;
       const sender = socket.username;
 
-      if (!message && !attachment_url) {
+      if (!message && !attachment_urls) {
         callback({
           status: "error",
           tempId: msg.tempId,
@@ -96,7 +96,7 @@ function initializeSocket(io) {
           socket.user_id,
           recipient,
           message,
-          attachment_url,
+          attachment_urls,
         );
         if (!insertedMessage) {
           callback({
@@ -120,7 +120,7 @@ function initializeSocket(io) {
         io.to(username).to(recipient).to(recipient_id).emit("chat message", {
           sender,
           message: content,
-          attachment_url,
+          attachment_urls,
           recipient,
           message_id,
           sender_id,
@@ -130,7 +130,7 @@ function initializeSocket(io) {
         console.log("(socket) sent on 'chat message' socket: ", {
           sender,
           message,
-          attachment_url,
+          attachment_urls,
           recipient,
           timestamp,
           message_id,