fix: update file msg element after zipping

pragmasoft-ua · Nov 22, 2023 · ff6b770 · ff6b770
1 parent 67afae9
commit ff6b770
Show file tree

Hide file tree

Showing 3 changed files with 41 additions and 6 deletions.
diff --git a/packages/kite-chat/src/kite-chat.ts b/packages/kite-chat/src/kite-chat.ts
@@ -8,13 +8,15 @@ import type {
   FileMsg,
   ContentMsg,
   FailedMsg,
+  ZippedMsg,
 } from './kite-types';
 
 import {MsgType} from './kite-types';
 
 import {
   KiteChatElement,
   KiteMsgElement,
+  KiteFileElement,
   KiteMsg as KiteChatMsg,
   randomStringId,
   isPlaintextMsg,
@@ -248,6 +250,9 @@ export class KiteChat {
       case MsgType.FAILED:
         this.onFailedMessage(payload);
         break;
+      case MsgType.ZIPPED:
+        this.onZippedMessage(payload);
+        break;
       case MsgType.ONLINE:
       case MsgType.OFFLINE:
         this.log(payload);
@@ -285,6 +290,19 @@ export class KiteChat {
     console.error(e.code, e.reason);
   }
 
+  protected onZippedMessage(e: ZippedMsg) {
+    console.debug('onZippedMessage', e);
+    const fileElement = document.querySelector(
+      `${KiteMsgElement.TAG}[messageId="${e.messageId}"] > ${KiteFileElement.TAG}`
+    ) as KiteFileElement | undefined;
+    if (fileElement) {
+      fileElement.file = e.file;
+    }
+    this.update(e.messageId, {
+      file: e.file,
+    } as ContentMsg);
+  }
+
   protected onFailedMessage(e: FailedMsg) {
     console.debug('onFailedMessage', e);
     const msgElement = document.querySelector(

diff --git a/packages/kite-chat/src/kite-types.ts b/packages/kite-chat/src/kite-types.ts
@@ -35,7 +35,8 @@ export enum MsgType {
   PING = 'PING',
   PONG = 'PONG',
   FAILED = "FAILED",
-  ACTIVE_TAB = "ACT_TAB"
+  ACTIVE_TAB = "ACT_TAB",
+  ZIPPED = "ZIP"
 }
 
 export type JoinChannel = {
@@ -135,6 +136,12 @@ export type ActiveTab = {
   type: MsgType.ACTIVE_TAB;
 };
 
+export type ZippedMsg = {
+  type: MsgType.ZIPPED;
+  messageId: string;
+  file: File;
+};
+
 export type ContentMsg = PlaintextMsg | FileMsg;
 
 export enum FileVerification {
@@ -171,4 +178,5 @@ export type KiteMsg =
   | Ping
   | Pong
   | FailedMsg
-  | ActiveTab;
+  | ActiveTab
+  | ZippedMsg;
diff --git a/packages/kite-chat/src/kite-worker.ts b/packages/kite-chat/src/kite-worker.ts
@@ -257,7 +257,7 @@ function onPlaintextMessage(payload: PlaintextMsg, tabPort: KiteMessagePort) {
 function onFileMessage(payload: FileMsg, tabPort: KiteMessagePort) {
   messageHistory.push(payload);
 
-  const uploadFile = async (file: File) => {
+  const uploadFile = (file: File) => {
     const upload: UploadRequest = {
       type: MsgType.UPLOAD,
       messageId: payload.messageId,
@@ -270,7 +270,7 @@ function onFileMessage(payload: FileMsg, tabPort: KiteMessagePort) {
     queue(upload);
   };
 
-  const failedFile = async (reason: FileVerification, errorMessage?: string) => {
+  const failedFile = (reason: FileVerification, errorMessage?: string) => {
     tabPort.postMessage({
       type: MsgType.FAILED, 
       reason: reason,
@@ -279,6 +279,14 @@ function onFileMessage(payload: FileMsg, tabPort: KiteMessagePort) {
     });
   }
 
+  const zippedFile = (file: File) => {
+    tabPort.postMessage({
+      type: MsgType.ZIPPED, 
+      messageId: payload.messageId,
+      file: file,
+    });
+  }
+
   const maxSize = (type: string) => formatSize(SUPPORTED_FILE_FORMATS[type as keyof typeof SUPPORTED_FILE_FORMATS]);
 
   const result = verifyFile(payload.file);
@@ -293,8 +301,9 @@ function onFileMessage(payload: FileMsg, tabPort: KiteMessagePort) {
         break;
       }
       zipFile(payload.file, ZIP_FILE_FORMAT)
-        .then(zippedFile => {
-          uploadFile(zippedFile);
+        .then(file => {
+          zippedFile(file);
+          uploadFile(file);
         })
         .catch(error => {
           console.error('Error zipping file:', error);