expanded form view: disable Duplicate and Delete buttons for new/unsaved rows

packages/nc-gui/components/smartsheet/expanded-form/Header.vue

@@ -73,7 +73,6 @@ useEventListener(document, 'keydown', async (e: KeyboardEvent) => {
   }
 })
 
-
 const showDeleteRowModal = ref(false)
 
 const { deleteRowById } = useViewData(meta, ref(props.view))
@@ -157,7 +156,12 @@ const onConfirmDeleteRowClick = async () => {
       <template #overlay>
         <div class="bg-gray-50 py-2 shadow-lg !border">
           <div>
-            <div v-e="['a:actions:duplicate-row']" class="nc-menu-item" @click="emit('duplicateRow')">
+            <div
+              v-e="['a:actions:duplicate-row']"
+              class="nc-menu-item"
+              :class="{ disabled: isNew }"
+              @click="!isNew && emit('duplicateRow')"
+            >
               <MdiContentCopy class="text-gray-500" />
               {{ $t('activity.duplicateRow') }}
             </div>
@@ -166,7 +170,12 @@ const onConfirmDeleteRowClick = async () => {
               <p>Are you sure you want to delete this row?</p>
             </a-modal>
 
-            <div v-e="['a:actions:delete-row']" class="nc-menu-item" @click="onDeleteRowClick" disabled="true">
+            <div
+              v-e="['a:actions:delete-row']"
+              class="nc-menu-item"
+              :class="{ disabled: isNew }"
+              @click="!isNew && onDeleteRowClick()"
+            >
               <MdiDelete class="text-gray-500" />
               {{ $t('activity.deleteRow') }}
             </div>

packages/nc-gui/components/smartsheet/expanded-form/index.vue

@@ -43,6 +43,8 @@ const { t } = useI18n()
 
 const row = ref(props.row)
 
+const isDuplicatedRow = ref(false)
+
 const state = toRef(props, 'state')
 
 const meta = toRef(props, 'meta')
@@ -107,6 +109,7 @@ const onClose = () => {
 
 const onDuplicateRow = () => {
   duplicatingRowInProgress.value = true
+  isDuplicatedRow.value = true
   const newRow = Object.assign(
     {},
     {
@@ -169,7 +172,7 @@ export default {
     class="nc-drawer-expanded-form"
     :class="{ active: isExpanded }"
   >
-    <SmartsheetExpandedFormHeader :view="props.view" @cancel="onClose" @duplicateRow="onDuplicateRow" />
+    <SmartsheetExpandedFormHeader :view="props.view" @cancel="onClose" @duplicate-row="onDuplicateRow" />
 
     <div class="!bg-gray-100 rounded flex-1 relative">
       <template v-if="props.showNextPrevIcons">
@@ -194,8 +197,8 @@ export default {
               <a-spin size="large" />
             </div>
             <div
-              v-else
               v-for="(col, i) of fields"
+              v-else
               v-show="!isVirtualCol(col) || !isNew || col.uidt === UITypes.LinkToAnotherRecord"
               :key="col.title"
               class="mt-2 py-2"