Updated people list when new message is sent

src/components/ChatComponents/ChatsComponent.vue

@@ -72,31 +72,33 @@ export default {
     calculateSide(from) {
       return from == this.userid ? "end" : "start";
     },
+    async fetchChats() {
+      const token = this.$store.state.user.token;
+      // Get all conversations from api with /chats/users
+      const conResponse = await fetch(
+        `${process.env.VUE_APP_BASEURL}chats/users`,
+        {
+          method: "GET",
+          headers: {
+            "Content-Type": "application/json",
+            Authorization: `Bearer ${token}`,
+          },
+        }
+      ); // add error handling
+      this.conversations = await conResponse.json();
+    },
   },
   async created() {
-    const token = this.$store.state.user.token;
-    // Get all conversations from api with /chats/users
-    const conResponse = await fetch(
-      `${process.env.VUE_APP_BASEURL}chats/users`,
-      {
-        method: "GET",
-        headers: {
-          "Content-Type": "application/json",
-          Authorization: `Bearer ${token}`,
-        },
-      }
-    ); // add error handling
-    this.conversations = await conResponse.json();
-
-    ws.on("NEW_MESSAGE", () => {
-      //this.reloadMessages();
-    }, "chats");
-    this.recipientID = (this.$route.query?.userID || null)
-    if(!this.recipientID) this.hambugerDisplay = "block";
+    await this.fetchChats();
+    ws.on("NEW_MESSAGE",async () => { 
+      await this.fetchChats()
+      }, "chats");
+    this.recipientID = this.$route.query?.userID || null;
+    if (!this.recipientID) this.hambugerDisplay = "block";
   },
   unmounted() {
     ws.end("NEW_MESSAGE", "chats");
-  }
+  },
 };
 </script>
 <style scoped>

src/services/ws.js

@@ -11,6 +11,7 @@ const ws = (function () {
 
   const fire = function (event, data) {
     if (handlers[event]) {
+      
       // for each object in object fire event
       for(const key in handlers[event]) {
         handlers[event][key](data);
@@ -23,7 +24,6 @@ const ws = (function () {
 
     // Fire message event
     fire("MESSAGE", JSON.parse(payload.body));
-
     if (data.status == "NEW_MESSAGE")
       fire("NEW_MESSAGE", JSON.parse(payload.body));
   };