From 2737da405ad03041a7a2d8653cc0027dc920c908 Mon Sep 17 00:00:00 2001
From: DarkPhoenix2704 <anbarasun123@gmail.com>
Date: Tue, 20 Feb 2024 07:16:17 +0000
Subject: [PATCH] fix(nc-gui): pr review changes

---
 packages/nc-gui/components/dlg/ViewCreate.vue       |  6 +++---
 packages/nc-gui/components/nc/Select.vue            |  2 ++
 packages/nc-gui/components/smartsheet/Toolbar.vue   |  2 +-
 .../components/smartsheet/calendar/SideMenu.vue     | 13 ++++++++++---
 .../components/smartsheet/calendar/VRecordCard.vue  | 12 ++++++------
 .../components/smartsheet/toolbar/CalendarRange.vue |  6 +++---
 6 files changed, 25 insertions(+), 16 deletions(-)

diff --git a/packages/nc-gui/components/dlg/ViewCreate.vue b/packages/nc-gui/components/dlg/ViewCreate.vue
index 072794eafe..8f8d99ed49 100644
--- a/packages/nc-gui/components/dlg/ViewCreate.vue
+++ b/packages/nc-gui/components/dlg/ViewCreate.vue
@@ -451,14 +451,14 @@ onMounted(async () => {
               </a-select-option>
             </NcSelect>
             <div
-              v-if="range.fk_to_column_id === null && isEeUI"
+              v-if="range.fk_to_column_id === null && isEeUI && false"
               class="cursor-pointer flex items-center text-gray-800 gap-1"
               @click="range.fk_to_column_id = undefined"
             >
               <component :is="iconMap.plus" class="h-4 w-4" />
               {{ $t('activity.addEndDate') }}
             </div>
-            <template v-else-if="isEeUI">
+            <template v-else-if="isEeUI && false">
               <span>
                 {{ $t('activity.withEndDate') }}
               </span>
@@ -508,7 +508,7 @@ onMounted(async () => {
               <component :is="iconMap.close" />
             </NcButton>
           </div>
-          <NcButton class="mt-2" size="small" type="secondary" @click="addCalendarRange">
+          <NcButton v-if="false" class="mt-2" size="small" type="secondary" @click="addCalendarRange">
             <component :is="iconMap.plus" />
             Add another date field
           </NcButton>
diff --git a/packages/nc-gui/components/nc/Select.vue b/packages/nc-gui/components/nc/Select.vue
index dca8f83707..41b7f198a8 100644
--- a/packages/nc-gui/components/nc/Select.vue
+++ b/packages/nc-gui/components/nc/Select.vue
@@ -47,6 +47,8 @@ const onChange = (value: string) => {
     :allow-clear="allowClear"
     :disabled="loading"
     :dropdown-class-name="dropdownClassName"
+    :dropdown-match-select-width="dropdownMatchSelectWidth"
+    :filter-option="filterOption"
     :loading="loading"
     :mode="mode"
     :placeholder="placeholder"
diff --git a/packages/nc-gui/components/smartsheet/Toolbar.vue b/packages/nc-gui/components/smartsheet/Toolbar.vue
index e72673ea85..08f9ac852c 100644
--- a/packages/nc-gui/components/smartsheet/Toolbar.vue
+++ b/packages/nc-gui/components/smartsheet/Toolbar.vue
@@ -51,7 +51,7 @@ const { allowCSVDownload } = useSharedView()
       <LazySmartsheetToolbarCalendarRange v-if="isCalendar" />
 
       <LazySmartsheetToolbarFieldsMenu
-        v-if="isGrid || isGallery || isKanban || isMap || isCalendar"
+        v-if="isGrid || isGallery || isKanban || isMap || !isCalendar"
         :show-system-fields="false"
       />
 
diff --git a/packages/nc-gui/components/smartsheet/calendar/SideMenu.vue b/packages/nc-gui/components/smartsheet/calendar/SideMenu.vue
index c6ed309847..1921c2a1da 100644
--- a/packages/nc-gui/components/smartsheet/calendar/SideMenu.vue
+++ b/packages/nc-gui/components/smartsheet/calendar/SideMenu.vue
@@ -276,7 +276,7 @@ onUnmounted(() => {
       :class="{
         '!hidden': height < 918,
       }"
-      class="flex flex-col items-center"
+      class="flex flex-col"
     >
       <NcDateWeekSelector
         v-if="activeCalendarView === ('day' as const)"
@@ -323,14 +323,21 @@ onUnmounted(() => {
             <component :is="iconMap.search" class="h-4 w-4 mr-1 text-gray-500" />
           </template>
         </a-input>
-        <NcSelect v-model:value="sideBarFilterOption" :options="options" />
+        <NcSelect v-model:value="sideBarFilterOption" class="min-w-36">
+          <a-select-option v-for="option in options" :key="option.value" :value="option.value">
+            <NcTooltip :title="option.label" placement="top" show-on-truncate-only>
+              <template #title>{{ option.label }}</template>
+              {{ option.label }}
+            </NcTooltip>
+          </a-select-option>
+        </NcSelect>
       </div>
 
       <div
         v-if="calendarRange"
         :ref="sideBarListRef"
         :class="{
-          'h-[calc(100vh-10.5rem)]': height < 918,
+          '!h-[calc(100vh-10.5rem)]': height < 918,
         'h-[calc(100vh-36.2rem)]': activeCalendarView === ('day' as const) || activeCalendarView === ('week' as const) && height > 918,
         'h-[calc(100vh-25.1rem)]': activeCalendarView === ('month' as const) || activeCalendarView === ('year' as const)  && height > 918,
       }"
diff --git a/packages/nc-gui/components/smartsheet/calendar/VRecordCard.vue b/packages/nc-gui/components/smartsheet/calendar/VRecordCard.vue
index df85b36382..3f48242a45 100644
--- a/packages/nc-gui/components/smartsheet/calendar/VRecordCard.vue
+++ b/packages/nc-gui/components/smartsheet/calendar/VRecordCard.vue
@@ -26,9 +26,9 @@ const emit = defineEmits(['resize-start'])
   >
     <NcButton
       :class="{
-        '!flex border-2 rounded-lg border-brand-500': selected || hover,
+        '!flex border-1 rounded-lg border-brand-500': selected || hover,
       }"
-      class="!group-hover:(border-brand-500) !border-2 cursor-ns-resize"
+      class="!group-hover:(border-brand-500) !border-1 cursor-ns-resize"
       size="xsmall"
       type="secondary"
       @mousedown.stop="emit('resize-start', 'left', $event, record)"
@@ -49,9 +49,9 @@ const emit = defineEmits(['resize-start'])
       'bg-pink-50': color === 'pink',
       'bg-purple-50': color === 'purple',
       'group-hover:(border-brand-500)': resize,
-      '!border-brand-500 border-2': selected || hover,
+      '!border-brand-500 border-1': selected || hover,
     }"
-    class="relative h-full ml-0.25 border-2 border-gray-50"
+    class="relative h-full ml-0.25 border-1 border-gray-50"
   >
     <div class="h-full absolute py-2">
       <div
@@ -82,9 +82,9 @@ const emit = defineEmits(['resize-start'])
   >
     <NcButton
       :class="{
-        '!flex border-2 rounded-lg z-1 cursor-ns-resize	border-brand-500': selected || hover,
+        '!flex border-1 rounded-lg z-1 cursor-ns-resize	border-brand-500': selected || hover,
       }"
-      class="!group-hover:(border-brand-500) !border-2"
+      class="!group-hover:(border-brand-500) !border-1"
       size="xsmall"
       type="secondary"
       @mousedown.stop="emit('resize-start', 'right', $event, record)"
diff --git a/packages/nc-gui/components/smartsheet/toolbar/CalendarRange.vue b/packages/nc-gui/components/smartsheet/toolbar/CalendarRange.vue
index 30eee32044..620805a665 100644
--- a/packages/nc-gui/components/smartsheet/toolbar/CalendarRange.vue
+++ b/packages/nc-gui/components/smartsheet/toolbar/CalendarRange.vue
@@ -150,7 +150,7 @@ const removeRange = async (id: number) => {
           </NcSelect>
 
           <div
-            v-if="range.fk_to_column_id === null && isEeUI"
+            v-if="range.fk_to_column_id === null && isEeUI && false"
             class="flex cursor-pointer flex text-gray-800 items-center gap-1"
             @click="
               () => {
@@ -162,7 +162,7 @@ const removeRange = async (id: number) => {
             <component :is="iconMap.plus" class="h-4 w-4" />
             {{ $t('activity.addEndDate') }}
           </div>
-          <template v-else-if="isEeUI">
+          <template v-else-if="isEeUI && false">
             <span>
               {{ $t('activity.withEndDate') }}
             </span>
@@ -210,7 +210,7 @@ const removeRange = async (id: number) => {
             <component :is="iconMap.close" />
           </NcButton>
         </div>
-        <NcButton class="mt-2" size="small" type="secondary" @click="addCalendarRange">
+        <NcButton v-if="false" class="mt-2" size="small" type="secondary" @click="addCalendarRange">
           <component :is="iconMap.plus" />
           Add another date field
         </NcButton>