fix(nc-gui): on paste append file into cell insted of replace

packages/nc-gui/composables/useMultiSelect/convertCellData.ts

@@ -5,11 +5,11 @@ import type { AppInfo } from '~/composables/useGlobal'
 import { parseProp } from '#imports'
 
 export default function convertCellData(
-  args: { to: UITypes; value: string; files?: FileList | File[]; column: ColumnType; appInfo: AppInfo },
+  args: { to: UITypes; value: string; files?: FileList | File[]; oldFiles?: any[] | null; column: ColumnType; appInfo: AppInfo },
   isMysql = false,
   isMultiple = false,
 ) {
-  const { to, value, files, column } = args
+  const { to, value, files, oldFiles, column } = args
 
   const dateFormat = isMysql ? 'YYYY-MM-DD HH:mm:ss' : 'YYYY-MM-DD HH:mm:ssZ'
 
@@ -113,7 +113,13 @@ export default function convertCellData(
       }
     }
     case UITypes.Attachment: {
-      if (!value && !files) return null
+      const parsedOldFiles = parseProp(oldFiles)
+      const oldAttachments = parsedOldFiles && Array.isArray(parsedOldFiles) ? parsedOldFiles : []
+
+      if (!value && !files) {
+        if (oldAttachments.length) return undefined
+        return null
+      }
 
       let parsedVal = []
       if (value) {
@@ -178,12 +184,24 @@ export default function convertCellData(
             continue
           }
         }
+        // this prevent file with same names
+        const isFileNameAlreadyExist = oldAttachments.some((el) => el.title === (attachment?.title || attachment?.name))
+        if (isFileNameAlreadyExist) {
+          if (isMultiple) {
+            message.error(`File with name ${attachment?.title || attachment?.name} already attached`)
+            continue
+          } else {
+            throw new Error(`File with name ${attachment?.title || attachment?.name} already attached`)
+          }
+        }
 
         attachments.push(attachment)
       }
 
-      if (value && attachments.length) {
-        return JSON.stringify(attachments)
+      if (oldAttachments.length && !attachments.length) {
+        return undefined
+      } else if (value && attachments.length) {
+        return JSON.stringify([...oldAttachments, ...attachments])
       } else if (files && attachments.length) {
         return attachments
       } else {

packages/nc-gui/composables/useMultiSelect/index.ts

@@ -820,6 +820,7 @@ export function useMultiSelect(
               {
                 // Repeat the clipboard data array if the matrix is smaller than the selection
                 value: clipboardMatrix[i % clipboardMatrix.length][j],
+                oldFiles: pasteCol.uidt === UITypes.Attachment ? pasteRow.row[pasteCol.title!] : undefined,
                 to: pasteCol.uidt as UITypes,
                 column: pasteCol,
                 appInfo: unref(appInfo),
@@ -883,6 +884,7 @@ export function useMultiSelect(
             {
               value: clipboardData,
               files: columnObj.uidt === UITypes.Attachment && e.clipboardData?.files?.length ? e.clipboardData?.files : undefined,
+              oldFiles: rowObj.row[columnObj.title!],
               to: columnObj.uidt as UITypes,
               column: columnObj,
               appInfo: unref(appInfo),
@@ -892,8 +894,11 @@ export function useMultiSelect(
 
           if (columnObj.uidt === UITypes.Attachment && e.clipboardData?.files?.length && pasteValue?.length) {
             const uploadedFiles = await handleFileUpload(pasteValue, columnObj.id!)
+
             rowObj.row[columnObj.title!] =
-              Array.isArray(uploadedFiles) && uploadedFiles.length ? JSON.stringify(uploadedFiles) : null
+              Array.isArray(uploadedFiles) && uploadedFiles.length
+                ? JSON.stringify([...handleParseAttachmentCellData(rowObj.row[columnObj.title!]), ...uploadedFiles])
+                : null
           } else if (pasteValue !== undefined) {
             rowObj.row[columnObj.title!] = pasteValue
           }
@@ -932,7 +937,8 @@ export function useMultiSelect(
                   const fileUploadPayload = convertCellData(
                     {
                       value: '',
-                      files: files,
+                      files,
+                      oldFiles: row.row[col.title],
                       to: col.uidt as UITypes,
                       column: col,
                       appInfo: unref(appInfo),
@@ -943,13 +949,18 @@ export function useMultiSelect(
 
                   if (fileUploadPayload?.length) {
                     const uploadedFiles = await handleFileUpload(fileUploadPayload, col.id!)
-                    pasteValue = Array.isArray(uploadedFiles) && uploadedFiles.length ? JSON.stringify(uploadedFiles) : null
+
+                    pasteValue =
+                      Array.isArray(uploadedFiles) && uploadedFiles.length
+                        ? JSON.stringify([...handleParseAttachmentCellData(row.row[col.title]), ...uploadedFiles])
+                        : null
                   }
                 }
               } else {
                 pasteValue = convertCellData(
                   {
                     value: clipboardData,
+                    oldFiles: row.row[col.title],
                     to: col.uidt as UITypes,
                     column: col,
                     appInfo: unref(appInfo),
@@ -1008,6 +1019,16 @@ export function useMultiSelect(
     }
   }
 
+  function handleParseAttachmentCellData(value: string | null) {
+    const parsedVal = parseProp(value)
+
+    if (parsedVal && Array.isArray(parsedVal)) {
+      return parsedVal
+    } else {
+      return []
+    }
+  }
+
   useEventListener(document, 'keydown', handleKeyDown)
   useEventListener(document, 'mouseup', handleMouseUp)
   useEventListener(document, 'paste', handlePaste)