From 1a0b288f7cf9912d5ef71bc23d1afb5ddb256503 Mon Sep 17 00:00:00 2001
From: DarkPhoenix2704 <anbarasun123@gmail.com>
Date: Tue, 20 Feb 2024 07:15:48 +0000
Subject: [PATCH] fix(nc-gui): calendar toolbar

---
 packages/nc-gui/components/dlg/ViewCreate.vue | 30 +++++++++++++------
 .../smartsheet/toolbar/CalendarRange.vue      |  2 +-
 .../smartsheet/toolbar/FieldsMenu.vue         | 18 +++++------
 3 files changed, 31 insertions(+), 19 deletions(-)

diff --git a/packages/nc-gui/components/dlg/ViewCreate.vue b/packages/nc-gui/components/dlg/ViewCreate.vue
index ab0a1d2ee9..a5fd2cbddd 100644
--- a/packages/nc-gui/components/dlg/ViewCreate.vue
+++ b/packages/nc-gui/components/dlg/ViewCreate.vue
@@ -1,10 +1,20 @@
 <script setup lang="ts">
-import type { ComponentPublicInstance } from '@vue/runtime-core'
-import type { Form as AntForm, SelectProps } from 'ant-design-vue'
-import { capitalize } from '@vue/runtime-core'
-import {CalendarType, FormType, GalleryType, GridType, KanbanType, MapType, TableType} from 'nocodb-sdk'
-import { UITypes, ViewTypes, isSystemColumn } from 'nocodb-sdk'
-import { computed, message, nextTick, onBeforeMount, reactive, ref, useApi, useI18n, useVModel, watch } from '#imports'
+import type {ComponentPublicInstance} from '@vue/runtime-core'
+import {capitalize} from '@vue/runtime-core'
+import type {Form as AntForm, SelectProps} from 'ant-design-vue'
+import {
+  CalendarType,
+  FormType,
+  GalleryType,
+  GridType,
+  isSystemColumn,
+  KanbanType,
+  MapType,
+  TableType,
+  UITypes,
+  ViewTypes
+} from 'nocodb-sdk'
+import {computed, message, nextTick, onBeforeMount, reactive, ref, useApi, useI18n, useVModel, watch} from '#imports'
 
 interface Props {
   modelValue: boolean
@@ -22,6 +32,7 @@ interface Props {
 
 interface Emits {
   (event: 'update:modelValue', value: boolean): void
+
   (event: 'created', value: GridType | KanbanType | GalleryType | FormType | MapType | CalendarType): void
 }
 
@@ -354,7 +365,8 @@ onMounted(async () => {
           </template>
         </template>
         </div>
-        <a v-if="!form.copy_from_id" href="https://docs.nocodb.com/views/view-types/calendar/" target="_blank" class="text-sm !no-underline !hover:text-brand-500 text-brand-500 ">
+        <a v-if="!form.copy_from_id" href="https://docs.nocodb.com/views/view-types/calendar/" target="_blank"
+           class="text-sm !no-underline !hover:text-brand-500 text-brand-500 ">
           Go to Docs
         </a>
       </div>
@@ -409,7 +421,7 @@ onMounted(async () => {
               {{ $t('labels.organizeRecordsBy') }}
             </span>
             <NcSelect
-              v-model:value="range.fk_from_column_id"
+                v-model:value="range.fk_from_column_id"
               class="w-full"
               :disabled="isMetaLoading"
               :loading="isMetaLoading"
@@ -435,7 +447,7 @@ onMounted(async () => {
                          }"/>
             </div>
             <NcSelect
-              v-model:value="range.fk_to_column_id"
+                v-model:value="range.fk_to_column_id"
               class="w-full"
               :disabled="isMetaLoading"
               :loading="isMetaLoading"
diff --git a/packages/nc-gui/components/smartsheet/toolbar/CalendarRange.vue b/packages/nc-gui/components/smartsheet/toolbar/CalendarRange.vue
index 31cbee73cb..fd1000cdbd 100644
--- a/packages/nc-gui/components/smartsheet/toolbar/CalendarRange.vue
+++ b/packages/nc-gui/components/smartsheet/toolbar/CalendarRange.vue
@@ -19,7 +19,7 @@ const {eventBus} = useSmartsheetStoreOrThrow()
 
 const meta = inject(MetaInj, ref())
 
-const { $e, $api } = useNuxtApp()
+const {$e, $api} = useNuxtApp()
 
 const activeView = inject(ActiveViewInj, ref())
 
diff --git a/packages/nc-gui/components/smartsheet/toolbar/FieldsMenu.vue b/packages/nc-gui/components/smartsheet/toolbar/FieldsMenu.vue
index 3a680fbe75..8565018ada 100644
--- a/packages/nc-gui/components/smartsheet/toolbar/FieldsMenu.vue
+++ b/packages/nc-gui/components/smartsheet/toolbar/FieldsMenu.vue
@@ -1,18 +1,17 @@
 <script setup lang="ts">
-import {CalendarType, ColumnType, GalleryType, KanbanType} from 'nocodb-sdk'
-import { UITypes, ViewTypes, isVirtualCol } from 'nocodb-sdk'
+import {CalendarType, ColumnType, GalleryType, isVirtualCol, KanbanType, UITypes, ViewTypes} from 'nocodb-sdk'
 import Draggable from 'vuedraggable'
 
-import type { SelectProps } from 'ant-design-vue'
+import type {SelectProps} from 'ant-design-vue'
 
 import {
   ActiveViewInj,
-  FieldsInj,
-  IsLockedInj,
-  IsPublicInj,
   computed,
+  FieldsInj,
   iconMap,
   inject,
+  IsLockedInj,
+  IsPublicInj,
   ref,
   resolveComponent,
   useMenuCloseOnEsc,
@@ -151,7 +150,7 @@ const coverOptions = computed<SelectProps['options']>(() => {
 
 const updateCoverImage = async (val?: string | null) => {
   if (
-    (activeView.value?.type === ViewTypes.GALLERY || activeView.value?.type === ViewTypes.KANBAN || activeView.value?.type === ViewTypes.CALENDAR) &&
+      (activeView.value?.type === ViewTypes.GALLERY || activeView.value?.type === ViewTypes.KANBAN || activeView.value?.type === ViewTypes.CALENDAR) &&
     activeView.value?.id &&
     activeView.value?.view
   ) {
@@ -178,7 +177,7 @@ const updateCoverImage = async (val?: string | null) => {
 const coverImageColumnId = computed({
   get: () => {
     const fk_cover_image_col_id =
-      (activeView.value?.type === ViewTypes.GALLERY || activeView.value?.type === ViewTypes.KANBAN || activeView.value?.type === ViewTypes.CALENDAR) && activeView.value?.view
+        (activeView.value?.type === ViewTypes.GALLERY || activeView.value?.type === ViewTypes.KANBAN || activeView.value?.type === ViewTypes.CALENDAR) && activeView.value?.view
         ? (activeView.value?.view as GalleryType).fk_cover_image_col_id
         : undefined
     // check if `fk_cover_image_col_id` is in `coverOptions`
@@ -310,7 +309,8 @@ useMenuCloseOnEsc(open)
 
           <!-- Fields -->
           <span v-if="!isMobileMode" class="text-capitalize text-sm font-medium">
-            <template v-if="activeView?.type === ViewTypes.KANBAN || activeView?.type === ViewTypes.GALLERY || activeView?.type === ViewTypes.CALENDAR">
+            <template
+                v-if="activeView?.type === ViewTypes.KANBAN || activeView?.type === ViewTypes.GALLERY || activeView?.type === ViewTypes.CALENDAR">
               {{ $t('title.editCards') }}
             </template>
             <template v-else>