From f4aa6bc22a46df5dd9a00a056637c9cb7cca0a1e Mon Sep 17 00:00:00 2001
From: DarkPhoenix2704 <anbarasun123@gmail.com>
Date: Wed, 20 Nov 2024 17:43:13 +0000
Subject: [PATCH] fix: disable spanning events if no fk_to_column fix: correct
 hover and drag effect for dragging and resizing

---
 .../calendar/DayView/DateTimeField.vue         |  6 +++++-
 .../smartsheet/calendar/MonthView.vue          | 12 ++++++++++--
 .../calendar/WeekView/DateTimeField.vue        | 18 +++++++++++-------
 3 files changed, 26 insertions(+), 10 deletions(-)

diff --git a/packages/nc-gui/components/smartsheet/calendar/DayView/DateTimeField.vue b/packages/nc-gui/components/smartsheet/calendar/DayView/DateTimeField.vue
index ed8e31f065..8678b6f077 100644
--- a/packages/nc-gui/components/smartsheet/calendar/DayView/DateTimeField.vue
+++ b/packages/nc-gui/components/smartsheet/calendar/DayView/DateTimeField.vue
@@ -895,7 +895,11 @@ const expandRecord = (record: Row) => {
 
 <template>
   <div class="h-[calc(100vh-5.3rem)] overflow-y-auto nc-scrollbar-md">
-    <SmartsheetCalendarDateTimeSpanningContainer :records="recordsAcrossAllRange.spanningRecords" @expand-record="expandRecord" />
+    <SmartsheetCalendarDateTimeSpanningContainer
+      v-if="calendarRange.some((range) => range.fk_to_col !== null && range.fk_to_col !== undefined)"
+      :records="recordsAcrossAllRange.spanningRecords"
+      @expand-record="expandRecord"
+    />
     <div ref="container" class="w-full flex relative no-selection" data-testid="nc-calendar-day-view" @drop="dropEvent">
       <div
         v-if="shouldEnableOverlay"
diff --git a/packages/nc-gui/components/smartsheet/calendar/MonthView.vue b/packages/nc-gui/components/smartsheet/calendar/MonthView.vue
index f89f8305ae..8b2f8b5e02 100644
--- a/packages/nc-gui/components/smartsheet/calendar/MonthView.vue
+++ b/packages/nc-gui/components/smartsheet/calendar/MonthView.vue
@@ -872,7 +872,11 @@ const addRecord = (date: dayjs.Dayjs) => {
                 ? ' 0px 12px 16px -4px rgba(0, 0, 0, 0.10), 0px 4px 6px -2px rgba(0, 0, 0, 0.06)'
                 : 'none',
 
-            opacity: draggingId === null || record.rowMeta.id === draggingId ? 1 : 0.3,
+            opacity:
+              (draggingId === null || record.rowMeta.id === draggingId) &&
+              (resizeRecord === undefined || record.rowMeta.id === resizeRecord?.rowMeta.id)
+                ? 1
+                : 0.3,
           }"
           :class="{
             'cursor-pointer': !resizeInProgress,
@@ -884,7 +888,11 @@ const addRecord = (date: dayjs.Dayjs) => {
         >
           <LazySmartsheetRow :row="record">
             <LazySmartsheetCalendarRecordCard
-              :hover="hoverRecord === record.rowMeta.id || record.rowMeta.id === draggingId"
+              :hover="
+                hoverRecord === record.rowMeta.id ||
+                record.rowMeta.id === draggingId ||
+                record.rowMeta.id === resizeRecord?.rowMeta.id
+              "
               :position="record.rowMeta.position"
               :record="record"
               :resize="!!record.rowMeta.range?.fk_to_col && isUIAllowed('dataEdit')"
diff --git a/packages/nc-gui/components/smartsheet/calendar/WeekView/DateTimeField.vue b/packages/nc-gui/components/smartsheet/calendar/WeekView/DateTimeField.vue
index ba85f2f93d..142c922205 100644
--- a/packages/nc-gui/components/smartsheet/calendar/WeekView/DateTimeField.vue
+++ b/packages/nc-gui/components/smartsheet/calendar/WeekView/DateTimeField.vue
@@ -907,6 +907,10 @@ const spanningRecordsContainer = ref<HTMLElement | null>(null)
 
 const isExpanded = ref(false)
 
+const isRangeEnabled = computed(() =>
+  calendarRange.value.some((range) => range.fk_to_col !== null && range.fk_to_col !== undefined),
+)
+
 watch(
   () => spanningRecordsContainer.value?.isSpanningRecordExpanded(),
   () => {
@@ -926,8 +930,8 @@ watch(
       v-if="!isPublic && dayjs().isBetween(selectedDateRange.start, selectedDateRange.end)"
       class="absolute top-16 ml-16 pointer-events-none z-2"
       :class="{
-        'mt-38.5': isExpanded,
-        'mt-23': !isExpanded,
+        'mt-38.5': isExpanded && isRangeEnabled,
+        'mt-23': !isExpanded && isRangeEnabled,
       }"
       :style="overlayStyle"
     >
@@ -957,8 +961,8 @@ watch(
     </div>
     <div
       :class="{
-        'top-16': !isExpanded,
-        'top-32': isExpanded,
+        'top-16': !isExpanded && isRangeEnabled,
+        'top-32': isExpanded && isRangeEnabled,
       }"
       class="absolute bg-white w-16 z-1"
     >
@@ -970,7 +974,7 @@ watch(
         {{ hour.format('hh a') }}
       </div>
     </div>
-    <div class="sticky top-6 bg-white z-3 inset-x-0 w-full">
+    <div v-if="isRangeEnabled" class="sticky top-6 bg-white z-3 inset-x-0 w-full">
       <SmartsheetCalendarDateTimeSpanningContainer
         ref="spanningRecordsContainer"
         :records="recordsAcrossAllRange.spanningRecords"
@@ -980,8 +984,8 @@ watch(
     <div
       ref="container"
       :class="{
-        '!mt-16 ': !isExpanded,
-        'mt-32': isExpanded,
+        '!mt-16 ': !isExpanded && isRangeEnabled,
+        'mt-32': isExpanded && isRangeEnabled,
       }"
       class="absolute ml-16 flex w-[calc(100%-64px)]"
     >