From 4dc13640b406602c3e2547ee85a60431509d563c Mon Sep 17 00:00:00 2001
From: Wing-Kam Wong <wingkwong.code@gmail.com>
Date: Tue, 17 Jan 2023 12:20:02 +0800
Subject: [PATCH] feat(nc-gui): bring rename attachment before upload

---
 .../components/cell/attachment/utils.ts       | 46 +++++++++++--------
 1 file changed, 27 insertions(+), 19 deletions(-)

diff --git a/packages/nc-gui/components/cell/attachment/utils.ts b/packages/nc-gui/components/cell/attachment/utils.ts
index c4770a88cc..3510200a51 100644
--- a/packages/nc-gui/components/cell/attachment/utils.ts
+++ b/packages/nc-gui/components/cell/attachment/utils.ts
@@ -88,23 +88,25 @@ export const [useProvideAttachmentCell, useAttachmentCell] = useInjectionState(
               new Promise<AttachmentProps>((resolve) => {
                 const res: AttachmentProps = { ...file, file, title: file.name, mimetype: file.type }
 
-                if (isImage(file.name, (<any>file).mimetype ?? file.type)) {
-                  const reader = new FileReader()
+                renameFile(file).then((renamedFile) => {
+                  if (isImage(renamedFile.name, (<any>renamedFile).mimetype ?? renamedFile.type)) {
+                    const reader = new FileReader()
 
-                  reader.onload = (e) => {
-                    res.data = e.target?.result
+                    reader.onload = (e) => {
+                      res.data = e.target?.result
 
-                    resolve(res)
-                  }
+                      resolve(res)
+                    }
+
+                    reader.onerror = () => {
+                      resolve(res)
+                    }
 
-                  reader.onerror = () => {
+                    reader.readAsDataURL(file)
+                  } else {
                     resolve(res)
                   }
-
-                  reader.readAsDataURL(file)
-                } else {
-                  resolve(res)
-                }
+                })
               }),
           ),
         )
@@ -116,7 +118,7 @@ export const [useProvideAttachmentCell, useAttachmentCell] = useInjectionState(
 
       const newAttachments = []
 
-      for (const file of selectedFiles) {
+      for (let file of selectedFiles) {
         // verify mime type
         const attachmentMeta = typeof column.value?.meta === 'string' ? JSON.parse(column.value.meta) : column.value?.meta
         if (attachmentMeta.unsupportedAttachmentMimeTypes.includes(file.type)) {
@@ -124,6 +126,8 @@ export const [useProvideAttachmentCell, useAttachmentCell] = useInjectionState(
           continue
         }
 
+        file = await renameFile(file)
+
         try {
           const data = await api.storage.upload(
             {
@@ -143,19 +147,23 @@ export const [useProvideAttachmentCell, useAttachmentCell] = useInjectionState(
       updateModelValue(JSON.stringify([...attachments.value, ...newAttachments]))
     }
 
-    async function renameFile(file: Record<string, any>) {
-      return new Promise((resolve) => {
+    async function renameFile(file: File) {
+      return new Promise<File>((resolve) => {
         const { close } = useDialog(RenameFile, {
-          fileName: file.title,
+          fileName: file.name,
           fileNames: [...attachments.value.map((file) => file.title), ...storedFiles.value.map((file) => file.title)],
           onRename: (newName: string) => {
             close()
-            // TODO: update name
-            resolve(true)
+            resolve(
+              new File([file], newName, {
+                type: file.type,
+                lastModified: file.lastModified,
+              }),
+            )
           },
           onCancel: () => {
             close()
-            resolve(true)
+            resolve(file)
           },
         })
       })