feat: multiple paste

Signed-off-by: mertmit <mertmit99@gmail.com>

packages/nc-gui/components/smartsheet/Grid.vue

@@ -125,6 +125,7 @@ const {
   navigateToSiblingRow,
   getExpandedRowIndex,
   deleteRangeOfRows,
+  updateMultipleRows,
 } = useViewData(meta, view, xWhere)
 
 const { getMeta } = useMetas()
@@ -337,6 +338,7 @@ const {
     // update/save cell value
     await updateOrSaveRow(rowObj, ctx.updatedColumnTitle || columnObj.title)
   },
+  updateMultipleRows,
 )
 
 function scrollToCell(row?: number | null, col?: number | null) {

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

@@ -31,6 +31,12 @@ export default function convertCellData(
       return parsedNumber
     }
     case UITypes.Checkbox:
+      if (typeof value === 'boolean') return value
+      if (typeof value === 'string') {
+        const strval = value.trim().toLowerCase()
+        if (strval === 'true' || strval === '1') return true
+        if (strval === 'false' || strval === '0' || strval === '') return false
+      }
       return Boolean(value)
     case UITypes.Date: {
       const parsedDate = dayjs(value)

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

@@ -43,6 +43,7 @@ export function useMultiSelect(
   scrollToActiveCell?: (row?: number | null, col?: number | null) => void,
   keyEventHandler?: Function,
   syncCellData?: Function,
+  updateMultipleRows?: Function,
 ) {
   const meta = ref(_meta)
 
@@ -344,12 +345,48 @@ export function useMultiSelect(
                 }
                 await copyValue()
                 break
-              // paste - ctrl/cmd + v
-              case 86:
-                try {
-                  // if edit permission is not there, return
-                  if (!hasEditPermission) return
+            }
+          }
+
+          if (unref(editEnabled) || e.ctrlKey || e.altKey || e.metaKey) {
+            return true
+          }
+
+          /** on letter key press make cell editable and empty */
+          if (e.key.length === 1) {
+            if (!unref(isPkAvail) && !rowObj.rowMeta.new) {
+              // Update not allowed for table which doesn't have primary Key
+              return message.info(t('msg.info.updateNotAllowedWithoutPK'))
+            }
+            if (isTypableInputColumn(columnObj) && makeEditable(rowObj, columnObj) && columnObj.title) {
+              rowObj.row[columnObj.title] = ''
+            }
+            // editEnabled = true
+          }
+        }
+        break
+    }
+  }
+
+  const resetSelectedRange = () => selectedRange.clear()
+
+  const clearSelectedRange = selectedRange.clear.bind(selectedRange)
 
+  const handlePaste = async (e: ClipboardEvent) => {
+    if (!isCellActive.value) {
+      return
+    }
+
+    if (unref(editEnabled)) {
+      return
+    }
+
+    const clipboardData = e.clipboardData?.getData('text/plain')
+
+    const rowObj = unref(data)[activeCell.row]
+    const columnObj = unref(fields)[activeCell.col]
+
+    try {
       // handle belongs to column
       if (
         columnObj.uidt === UITypes.LinkToAnotherRecord &&
@@ -378,10 +415,7 @@ export function useMultiSelect(
 
         if (!foreignKeyColumn) return
 
-                    rowObj.row[foreignKeyColumn.title!] = extractPkFromRow(
-                      clipboardContext.value,
-                      (relatedTableMeta as any)!.columns!,
-                    )
+        rowObj.row[foreignKeyColumn.title!] = extractPkFromRow(clipboardContext.value, (relatedTableMeta as any)!.columns!)
 
         return await syncCellData?.({ ...activeCell, updatedColumnTitle: foreignKeyColumn.title })
       }
@@ -405,41 +439,64 @@ export function useMultiSelect(
         e.preventDefault()
         syncCellData?.(activeCell)
       } else {
-                    clearCell(activeCell as { row: number; col: number }, true)
-                    makeEditable(rowObj, columnObj)
-                  }
-                } catch (error: any) {
-                  message.error(await extractSdkResponseErrorMsg(error))
-                }
-            }
-          }
+        e.preventDefault()
+        if (clipboardData?.includes('\n') || clipboardData?.includes('\t')) {
+          const pasteMatrix = clipboardData.split('\n').map((row) => row.split('\t'))
 
-          if (unref(editEnabled) || e.ctrlKey || e.altKey || e.metaKey) {
-            return true
+          const pasteMatrixRows = pasteMatrix.length
+          const pasteMatrixCols = pasteMatrix[0].length
+
+          const colsToPaste = unref(fields).slice(activeCell.col, activeCell.col + pasteMatrixCols)
+          const rowsToPaste = unref(data).slice(activeCell.row, activeCell.row + pasteMatrixRows)
+
+          for (let i = 0; i < pasteMatrixRows; i++) {
+            for (let j = 0; j < pasteMatrixCols; j++) {
+              const pasteRow = rowsToPaste[i]
+              const pasteCol = colsToPaste[j]
+
+              if (!pasteRow || !pasteCol) {
+                continue
               }
 
-          /** on letter key press make cell editable and empty */
-          if (e.key.length === 1) {
-            if (!unref(isPkAvail) && !rowObj.rowMeta.new) {
-              // Update not allowed for table which doesn't have primary Key
-              return message.info(t('msg.info.updateNotAllowedWithoutPK'))
+              pasteRow.row[pasteCol.title!] = convertCellData(
+                {
+                  value: pasteMatrix[i][j],
+                  from: UITypes.SingleLineText,
+                  to: pasteCol.uidt as UITypes,
+                  column: pasteCol,
+                  appInfo: unref(appInfo),
+                },
+                isMysql(meta.value?.base_id),
+              )
             }
-            if (isTypableInputColumn(columnObj) && makeEditable(rowObj, columnObj) && columnObj.title) {
-              rowObj.row[columnObj.title] = ''
           }
-            // editEnabled = true
+          console.log(pasteMatrix)
+
+          await updateMultipleRows?.(rowsToPaste)
+        } else {
+          rowObj.row[columnObj.title!] = convertCellData(
+            {
+              value: clipboardData,
+              from: UITypes.SingleLineText,
+              to: columnObj.uidt as UITypes,
+              column: columnObj,
+              appInfo: unref(appInfo),
+            },
+            isMysql(meta.value?.base_id),
+          )
+          syncCellData?.(activeCell)
         }
+        // clearCell(activeCell as { row: number; col: number }, true)
+        // makeEditable(rowObj, columnObj)
       }
-        break
+    } catch (error: any) {
+      message.error(await extractSdkResponseErrorMsg(error))
     }
   }
 
-  const resetSelectedRange = () => selectedRange.clear()
-
-  const clearSelectedRange = selectedRange.clear.bind(selectedRange)
-
   useEventListener(document, 'keydown', handleKeyDown)
   useEventListener(tbodyEl, 'mouseup', handleMouseUp)
+  useEventListener(document, 'paste', handlePaste)
 
   return {
     isCellActive,

packages/nc-gui/composables/useViewData.ts

@@ -448,6 +448,117 @@ export function useViewData(
     }
   }
 
+  async function updateMultipleRows(
+    rows: Row[],
+    { metaValue = meta.value, viewMetaValue = viewMeta.value }: { metaValue?: TableType; viewMetaValue?: ViewType } = {},
+    undo = false,
+  ) {
+    const promises = []
+
+    for (const row of rows) {
+      // update changed status
+      if (row.rowMeta) row.rowMeta.changed = false
+
+      // if new row and save is in progress then wait until the save is complete
+      promises.push(until(() => !(row.rowMeta?.new && row.rowMeta?.saving)).toMatch((v) => v))
+    }
+
+    await Promise.all(promises)
+
+    const updateArray = []
+
+    for (const row of rows) {
+      if (row.rowMeta) row.rowMeta.saving = true
+
+      const pk = rowPkData(row.row, metaValue?.columns as ColumnType[])
+
+      updateArray.push({ ...row.row, ...pk })
+    }
+
+    if (!undo) {
+      addUndo({
+        redo: {
+          fn: async function redo(redoRows: Row[], pg: { page: number; pageSize: number }) {
+            await updateMultipleRows(redoRows, { metaValue, viewMetaValue }, true)
+            if (pg.page === paginationData.value.page && pg.pageSize === paginationData.value.pageSize) {
+              for (const toUpdate of redoRows) {
+                const rowIndex = findIndexByPk(rowPkData(toUpdate.row, meta?.value?.columns as ColumnType[]))
+                if (rowIndex !== -1) {
+                  const row = formattedData.value[rowIndex]
+                  Object.assign(row.row, toUpdate.row)
+                  Object.assign(row.oldRow, toUpdate.row)
+                } else {
+                  await loadData()
+                  break
+                }
+              }
+            } else {
+              await changePage(pg.page)
+            }
+          },
+          args: [clone(rows), { page: paginationData.value.page, pageSize: paginationData.value.pageSize }],
+        },
+        undo: {
+          fn: async function undo(undoRows: Row[], pg: { page: number; pageSize: number }) {
+            await updateMultipleRows(undoRows, { metaValue, viewMetaValue }, true)
+            if (pg.page === paginationData.value.page && pg.pageSize === paginationData.value.pageSize) {
+              for (const toUpdate of undoRows) {
+                const rowIndex = findIndexByPk(rowPkData(toUpdate.row, meta?.value?.columns as ColumnType[]))
+                if (rowIndex !== -1) {
+                  const row = formattedData.value[rowIndex]
+                  Object.assign(row.row, toUpdate.row)
+                  Object.assign(row.oldRow, toUpdate.row)
+                } else {
+                  await loadData()
+                  break
+                }
+              }
+            } else {
+              await changePage(pg.page)
+            }
+          },
+          args: [
+            clone(
+              rows.map((row) => {
+                return { row: row.oldRow, oldRow: row.row, rowMeta: row.rowMeta }
+              }),
+            ),
+            { page: paginationData.value.page, pageSize: paginationData.value.pageSize },
+          ],
+        },
+        scope: defineViewScope({ view: viewMetaValue }),
+      })
+    }
+
+    await $api.dbTableRow.bulkUpdate(NOCO, metaValue?.project_id as string, metaValue?.id as string, updateArray)
+
+    for (const row of rows) {
+      if (!undo) {
+        /** update row data(to sync formula and other related columns)
+         * update only formula, rollup and auto updated datetime columns data to avoid overwriting any changes made by user
+         */
+        Object.assign(
+          row.row,
+          metaValue!.columns!.reduce<Record<string, any>>((acc: Record<string, any>, col: ColumnType) => {
+            if (
+              col.uidt === UITypes.Formula ||
+              col.uidt === UITypes.QrCode ||
+              col.uidt === UITypes.Barcode ||
+              col.uidt === UITypes.Rollup ||
+              col.au ||
+              col.cdf?.includes(' on update ')
+            )
+              acc[col.title!] = row.row[col.title!]
+            return acc
+          }, {} as Record<string, any>),
+        )
+        Object.assign(row.oldRow, row.row)
+      }
+
+      if (row.rowMeta) row.rowMeta.saving = false
+    }
+  }
+
   async function changePage(page: number) {
     paginationData.value.page = page
     await loadData({
@@ -807,6 +918,7 @@ export function useViewData(
     deleteSelectedRows,
     deleteRangeOfRows,
     updateOrSaveRow,
+    updateMultipleRows,
     selectedAllRecords,
     syncCount,
     syncPagination,