From f9d8182ee53f012499eaf4ee0eb5fedb39d0e5bb Mon Sep 17 00:00:00 2001
From: braks <78412429+bcakmakoglu@users.noreply.github.com>
Date: Thu, 18 Aug 2022 09:25:30 +0200
Subject: [PATCH] chore(gui-v2): create file data in page

---
 .../nc-gui-v2/components/dlg/QuickImport.vue     | 16 ++++++----------
 .../[projectId]/index/index/index.vue            | 11 ++++++++++-
 2 files changed, 16 insertions(+), 11 deletions(-)

diff --git a/packages/nc-gui-v2/components/dlg/QuickImport.vue b/packages/nc-gui-v2/components/dlg/QuickImport.vue
index 7d9702ef41..4593471f31 100644
--- a/packages/nc-gui-v2/components/dlg/QuickImport.vue
+++ b/packages/nc-gui-v2/components/dlg/QuickImport.vue
@@ -53,7 +53,7 @@ const templateEditorModal = ref(false)
 const useForm = Form.useForm
 
 const importState = reactive({
-  fileList: [] as (UploadFile & { data: any })[],
+  fileList: [] as (UploadFile & { data: string | ArrayBuffer })[],
   url: '',
   jsonEditor: {},
   parserConfig: {
@@ -163,7 +163,7 @@ async function handleImport() {
   dialogShow.value = false
 }
 
-async function parseAndExtractData(val: any, name: string) {
+async function parseAndExtractData(val: string | ArrayBuffer, name: string) {
   try {
     templateData.value = null
     importData.value = null
@@ -206,18 +206,14 @@ function handleChange(info: UploadChangeParam) {
     reader.onload = (e: ProgressEvent<FileReader>) => {
       const target = importState.fileList.find((f) => f.uid === info.file.uid)
 
-      if (e.target) {
+      if (e.target && e.target.result) {
+        /** if the file was pushed into the list by `<a-upload-dragger>` we just add the data to the file */
         if (target) {
           target.data = e.target.result
         } else if (!target) {
-          // push new file to fileList
+          /** if the file was added programmatically and not with d&d, we create file infos and push it into the list */
           importState.fileList.push({
-            ...info.file.originFileObj!,
-            name: info.file.originFileObj!.name,
-            fileName: info.file.originFileObj!.name,
-            originFileObj: info.file.originFileObj!,
-            type: info.file.originFileObj!.type,
-            uid: Math.random().toString(36).substring(2),
+            ...info.file,
             status: 'done',
             data: e.target.result,
           })
diff --git a/packages/nc-gui-v2/pages/[projectType]/[projectId]/index/index/index.vue b/packages/nc-gui-v2/pages/[projectType]/[projectId]/index/index/index.vue
index e26ac514c4..ef697e207d 100644
--- a/packages/nc-gui-v2/pages/[projectType]/[projectId]/index/index/index.vue
+++ b/packages/nc-gui-v2/pages/[projectType]/[projectId]/index/index/index.vue
@@ -70,7 +70,16 @@ function openQuickImportDialog(type: QuickImportTypes, file: File) {
   })
 
   vNode.value?.component?.exposed?.handleChange({
-    file: { originFileObj: file },
+    file: {
+      uid: `${type}-${file.name}-${Math.random().toString(36).substring(2)}`,
+      name: file.name,
+      type: file.type,
+      status: 'done',
+      fileName: file.name,
+      lastModified: file.lastModified,
+      size: file.size,
+      originFileObj: file,
+    },
     event: { percent: 100 },
   } as UploadChangeParam<UploadFile<File>>)