vue-wiguet-chatweb 0.1.36 → 0.1.37

package/package.json

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

package/src/components/Chat.vue

@@ -52,9 +52,8 @@
               type="file"
               ref="fileInputRef"
               @change="onFileSelect"
-              accept="image/*"
+              accept="image/png,image/jpeg,image/jpg,image/webp"
               style="display: none;"
-              key="fileInputKey"
 
             />
             <button
@@ -64,7 +63,6 @@
               @click="
                 () => {
                   fileInputRef.value = '';
-                  fileInputKey++;
                   fileInputRef?.click();
                 }
               "
@@ -124,7 +122,7 @@
         </form>
     </div>
     <div v-else>
-      <img v-if="urlFileMessage" :src="urlFileMessage" alt="Image" style="width: 55vw;" />
+      <img v-if="urlFileMessage" :src="urlFileMessage" alt="Image" style="max-height: 85vh;" />
     </div>
   </ODialog>
 </template>
@@ -176,7 +174,6 @@ const enum DIALOG_VIEWS {
 const message = ref("");
 const notViewed = ref(0);
 const fileInputRef = ref();
-const fileInputKey = ref(0);
 const currentDialogView = ref(DIALOG_VIEWS.SEE)
 const urlFileMessage = ref<string>()
 
@@ -344,9 +341,12 @@ function updateMessageStatus(
 
     messageUpdated = { ...messageAResponder, chatId: newMessage?.chatId }
   } else {
-    messagesData.value.data[idxMessageToCommunicate] = messageUpdated;
+    const messageCopy =  { ...messageUpdated }
+    messageCopy.urlFile = messagesData.value.data[idxMessageToCommunicate].urlFile;
+    delete messageCopy.thumbnailFile;
+    messagesData.value.data[idxMessageToCommunicate] = messageCopy;
   }
-  
+
   return messageUpdated;
 }
 
@@ -355,7 +355,7 @@ const submitMessage = async (
 ) => {
 
   const newMessage = createMessage(message.value, messageExtraData?.codigoTipoMensaje);
-  message.value = '';
+
   if (!newMessage) return;
   
   let idxMessageToCommunicate = -1;
@@ -377,6 +377,9 @@ const submitMessage = async (
     codigoTipoMensaje: messageExtraData?.codigoTipoMensaje,
     files: inputFiles.value,
   }
+  
+  message.value = '';
+
   sendApi(body).then((messageSaved) => {
     let messageUpdated = updateMessageStatus(
       newMessage,
@@ -584,8 +587,8 @@ const isDisabledBoxMessage = ref(false);
 function onFileSelect() {
   inputFiles.value = [];
   urlFiles.value = [];
-
-  const filesParam = fileInputRef.value?.files ?? []
+  
+  const filesParam: File[] = Array.from(fileInputRef.value?.files) ?? []
 
   const file = filesParam?.[0];
   
@@ -626,7 +629,7 @@ function onFileSelect() {
 
 // Dialog
 
-const inputFiles = ref<(File & { objectURL: string })[]>([]);
+const inputFiles = ref<File[]>([]);
 const urlFiles = ref<Array<string>>([]);
 
 const dialog = reactive<IPropsDialog>({