fix(nc-gui): calendar duplication

packages/nc-gui/components/dashboard/TreeView/CreateViewBtn.vue

@@ -1,4 +1,4 @@
-<script setup lang="ts">
+<script lang="ts" setup>
 import type { ViewType } from 'nocodb-sdk'
 import { ViewTypes } from 'nocodb-sdk'
 
@@ -36,11 +36,16 @@ async function onOpenModal({
   type,
   copyViewId,
   groupingFieldColumnId,
+  calendarRange,
 }: {
   title?: string
   type: ViewTypes
   copyViewId?: string
   groupingFieldColumnId?: string
+  calendarRange?: Array<{
+    fk_from_column_id: string
+    fk_to_column_id: string | null // for ee only
+  }>
 }) {
   if (isViewListLoading.value) return
 
@@ -62,6 +67,7 @@ async function onOpenModal({
     type,
     'tableId': table.value.id,
     'selectedViewId': copyViewId,
+    calendarRange,
     groupingFieldColumnId,
     'onUpdate:modelValue': closeDialog,
     'onCreated': async (view: ViewType) => {
@@ -100,7 +106,7 @@ async function onOpenModal({
 </script>
 
 <template>
-  <NcDropdown v-model:visible="isOpen" destroy-popup-on-hide :overlay-class-name="overlayClassName" @click.stop="isOpen = true">
+  <NcDropdown v-model:visible="isOpen" :overlay-class-name="overlayClassName" destroy-popup-on-hide @click.stop="isOpen = true">
     <slot />
     <template #overlay>
       <NcMenu class="max-w-48">

packages/nc-gui/components/dashboard/TreeView/ViewsList.vue

@@ -350,11 +350,16 @@ function onOpenModal({
   type,
   copyViewId,
   groupingFieldColumnId,
+  calendarRange,
 }: {
   title?: string
   type: ViewTypes
   copyViewId?: string
   groupingFieldColumnId?: string
+  calendarRange?: Array<{
+    fk_from_column_id: string
+    fk_to_column_id: string | null // for ee only
+  }>
 }) {
   const isOpen = ref(true)
 
@@ -366,6 +371,7 @@ function onOpenModal({
     'selectedViewId': copyViewId,
     groupingFieldColumnId,
     'views': views,
+    calendarRange,
     'onUpdate:modelValue': closeDialog,
     'onCreated': async (view: ViewType) => {
       closeDialog()
@@ -400,24 +406,24 @@ function onOpenModal({
   <a-menu
     ref="menuRef"
     :class="{ dragging }"
-    class="nc-views-menu flex flex-col w-full !border-r-0 !bg-inherit"
     :selected-keys="selected"
+    class="nc-views-menu flex flex-col w-full !border-r-0 !bg-inherit"
   >
     <DashboardTreeViewCreateViewBtn
       v-if="isUIAllowed('viewCreateOrEdit')"
+      :align-left-level="isDefaultSource ? 1 : 2"
       :class="{
         '!pl-18 !xs:(pl-19.75)': isDefaultSource,
         '!pl-23.5 !xs:(pl-27)': !isDefaultSource,
       }"
-      :align-left-level="isDefaultSource ? 1 : 2"
     >
       <div
-        role="button"
-        class="nc-create-view-btn flex flex-row items-center cursor-pointer rounded-md w-full"
         :class="{
           'text-brand-500 hover:text-brand-600': activeTableId === table.id,
           'text-gray-500 hover:text-brand-500': activeTableId !== table.id,
         }"
+        class="nc-create-view-btn flex flex-row items-center cursor-pointer rounded-md w-full"
+        role="button"
       >
         <div class="flex flex-row items-center pl-1.25 !py-1.5 text-inherit">
           <GeneralIcon icon="plus" />
@@ -437,20 +443,20 @@ function onOpenModal({
         v-for="view of views"
         :id="view.id"
         :key="view.id"
-        :view="view"
-        :on-validate="validate"
-        :table="table"
-        class="nc-view-item !rounded-md !px-0.75 !py-0.5 w-full transition-all ease-in duration-100"
         :class="{
           'bg-gray-200': isMarked === view.id,
           'active': activeView?.id === view.id,
           [`nc-${view.type ? viewTypeAlias[view.type] : undefined || view.type}-view-item`]: true,
         }"
         :data-view-id="view.id"
-        @change-view="changeView"
-        @open-modal="onOpenModal"
+        :on-validate="validate"
+        :table="table"
+        :view="view"
+        class="nc-view-item !rounded-md !px-0.75 !py-0.5 w-full transition-all ease-in duration-100"
         @delete="openDeleteDialog"
         @rename="onRename"
+        @change-view="changeView"
+        @open-modal="onOpenModal"
         @select-icon="setIcon($event, view)"
       />
     </template>

packages/nc-gui/components/smartsheet/toolbar/ViewActionMenu.vue

@@ -97,6 +97,7 @@ function onDuplicate() {
     'selectedViewId': view.value!.id,
     'groupingFieldColumnId': view.value!.view!.fk_grp_col_id,
     'views': views,
+    'calendarRange': view.value!.view!.calendar_range,
     'onUpdate:modelValue': closeDialog,
     'onCreated': async (view: ViewType) => {
       closeDialog()
@@ -141,9 +142,9 @@ const onDelete = async () => {
 <template>
   <NcMenu
     v-if="view"
+    :data-testid="`view-sidebar-view-actions-${view!.alias || view!.title}`"
     class="!min-w-70"
     data-id="toolbar-actions"
-    :data-testid="`view-sidebar-view-actions-${view!.alias || view!.title}`"
   >
     <NcTooltip>
       <template #title> {{ $t('labels.clickToCopyViewID') }} </template>
@@ -155,9 +156,9 @@ const onDelete = async () => {
             })
           }}
         </div>
-        <NcButton size="xsmall" type="secondary" class="!group-hover:bg-gray-100">
-          <GeneralIcon v-if="isViewIdCopied" icon="check" class="max-h-4 min-w-4" />
-          <GeneralIcon v-else else icon="copy" class="max-h-4 min-w-4" />
+        <NcButton class="!group-hover:bg-gray-100" size="xsmall" type="secondary">
+          <GeneralIcon v-if="isViewIdCopied" class="max-h-4 min-w-4" icon="check" />
+          <GeneralIcon v-else class="max-h-4 min-w-4" else icon="copy" />
         </NcButton>
       </div>
     </NcTooltip>
@@ -176,7 +177,7 @@ const onDelete = async () => {
         </NcMenuItem>
       </NcTooltip>
       <NcMenuItem @click="onDuplicate">
-        <GeneralIcon icon="duplicate" class="nc-view-copy-icon" />
+        <GeneralIcon class="nc-view-copy-icon" icon="duplicate" />
         {{ $t('labels.duplicateView') }}
       </NcMenuItem>
     </template>
@@ -212,8 +213,8 @@ const onDelete = async () => {
                     sidebar: props.inSidebar,
                   },
                 ]"
-                class="nc-base-menu-item"
                 :class="{ disabled: lockType === LockType.Locked }"
+                class="nc-base-menu-item"
               >
                 <component :is="iconMap.cloudUpload" />
                 {{ `${$t('general.upload')} ${type.toUpperCase()}` }}
@@ -263,9 +264,9 @@ const onDelete = async () => {
             </div>
             <div class="nc-base-menu-item flex !flex-shrink group !py-1 !px-1 rounded-md bg-brand-50">
               <LazySmartsheetToolbarLockType
-                hide-tick
                 :type="lockType"
                 class="flex nc-view-actions-lock-type !text-brand-500 !flex-shrink"
+                hide-tick
               />
             </div>
             <div class="flex flex-grow"></div>
@@ -289,7 +290,7 @@ const onDelete = async () => {
       <NcTooltip v-if="lockType === LockType.Locked">
         <template #title> {{ $t('msg.info.disabledAsViewLocked') }} </template>
         <NcMenuItem class="!cursor-not-allowed !text-gray-400">
-          <GeneralIcon icon="delete" class="nc-view-delete-icon" />
+          <GeneralIcon class="nc-view-delete-icon" icon="delete" />
           {{
             $t('general.deleteEntity', {
               entity: $t('objects.view'),
@@ -298,7 +299,7 @@ const onDelete = async () => {
         </NcMenuItem>
       </NcTooltip>
       <NcMenuItem v-else class="!hover:bg-red-50 !text-red-500" @click="onDelete">
-        <GeneralIcon icon="delete" class="nc-view-delete-icon" />
+        <GeneralIcon class="nc-view-delete-icon" icon="delete" />
         {{
           $t('general.deleteEntity', {
             entity: $t('objects.view'),
@@ -311,9 +312,9 @@ const onDelete = async () => {
         v-for="tp in quickImportDialogTypes"
         :key="tp"
         v-model="quickImportDialogs[tp].value"
+        :import-data-only="true"
         :import-type="tp"
         :source-id="currentBaseId"
-        :import-data-only="true"
       />
     </template>
   </NcMenu>