vue-wiguet-chatweb 0.0.18 → 0.0.20

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vue-wiguet-chatweb",
-  "version": "0.0.18",
+  "version": "0.0.20",
   "type": "module",
   "files": [
     "dist",

package/src/components/Chat.vue

@@ -129,14 +129,16 @@ watch(
 );
 onMounted(async () => {
   if (!virtualHost.value || !appChatId.value) {
-    const resp = await getInformationApi(props.tokenAuth);
-    const data = resp.response.data;
-    virtualHost.value = data.virtualHost;
-    appChatId.value = data.appChat.id;
-    emit("not-viewed-total", data.appChat.totalNoVistosCliente);
-    notViewed.value = data.appChat.totalNoVistosCliente;
-    getMessages();
-    connectMsRabbit();
+    try {
+      const resp = await getInformationApi(props.tokenAuth);
+      const data = resp.response.data;
+      virtualHost.value = data.virtualHost;
+      appChatId.value = data.appChat.id;
+      emit("not-viewed-total", data.appChat.totalNoVistosCliente);
+      notViewed.value = data.appChat.totalNoVistosCliente;
+      getMessages();
+      connectMsRabbit();
+    } catch (error) {}
   }
 });
 
@@ -210,7 +212,7 @@ const getMessages = async () => {
     isLoading.value = true;
     const lastMessagesId = messagesData.value.data[0]?.id;
     const body: ListMessageBody = {
-      limit: 10,
+      size: 10,
       lastMessagesId,
       appChatId: appChatId.value,
     };
@@ -220,7 +222,7 @@ const getMessages = async () => {
       ...resp.data.sort((a, b) => -b.createdAt.localeCompare(a.createdAt))
     );
     messagesData.value.canLoadMoreMessages =
-      resp.pagination.total > resp.pagination.limit;
+      resp.pagination.total > resp.pagination.size;
     if (lastMessagesId && messageContainerRef.value?.scrollHeight) {
       mantainElementsOnViewport(messageContainerRef.value?.scrollHeight);
     }
@@ -284,6 +286,7 @@ const connectMsRabbit = (app: any = "webchat") => {
         notViewed.value = notViewed.value + 1;
         emit("new-message");
       }
+      scrollToBottom();
     }
   });
 };

package/src/components/MessageList.vue

@@ -5,10 +5,13 @@
       v-for="message in props.messages"
       :key="message.id"
       class="message"
-      :class="message.esCliente ? 'message-left' : 'message-right'"
+      :class="message.esCliente ? 'message-right' : 'message-left'"
     >
       <div class="message-container">
-        <div v-if="message.error && message.esCliente" class="btn-container-widget">
+        <div
+          v-if="message.error && message.esCliente"
+          class="btn-container-widget"
+        >
           <button
             text
             rounded
@@ -21,14 +24,18 @@
           </button>
         </div>
         <div class="chat-message">
-          <div class="bubble" :class="message.esCliente ? 'left' : 'right'">
-            <div :class="message.esCliente ? 'content-left' : 'content-right'">
+          <div class="bubble" :class="message.esCliente ? 'right' : 'left'">
+            <div :class="message.esCliente ? 'content-right' : 'content-left'">
               <div class="message-text">
                 {{ message.message }}
               </div>
               <div class="detail-message flex justify-content-between">
                 <span class="mr-5" v-if="message.sender?.nombreCompleto">
-                  {{ message.sender?.nombreCompleto }}
+                  {{
+                    message.esCliente
+                      ? message.sender?.nombreCompleto
+                      : "ECOSISTEMA JL"
+                  }}
                 </span>
                 <span class="mr-5" v-else> </span>
                 <span>