From 65a4cc5df02ac290898b385cbc5c63a2d0003a21 Mon Sep 17 00:00:00 2001
From: Alex Tselegidis <alextselegidis@gmail.com>
Date: Mon, 14 Oct 2024 15:08:21 +0200
Subject: [PATCH] Use the block display mode so that the right colors render in
 the month view

---
 assets/js/utils/calendar_default_view.js | 8 ++++++++
 assets/js/utils/calendar_table_view.js   | 8 ++++++++
 2 files changed, 16 insertions(+)

diff --git a/assets/js/utils/calendar_default_view.js b/assets/js/utils/calendar_default_view.js
index a2154fc377..8bae4ec28c 100755
--- a/assets/js/utils/calendar_default_view.js
+++ b/assets/js/utils/calendar_default_view.js
@@ -1214,6 +1214,7 @@ App.Utils.CalendarDefaultView = (function () {
                         allDay: false,
                         color: appointment.color,
                         data: appointment, // Store appointment data for later use.
+                        display: 'block',
                     };
 
                     calendarEventSource.push(appointmentEvent);
@@ -1237,6 +1238,7 @@ App.Utils.CalendarDefaultView = (function () {
                         editable: true,
                         className: 'fc-unavailability fc-custom',
                         data: unavailability,
+                        display: 'block',
                     };
 
                     calendarEventSource.push(unavailabilityEvent);
@@ -1254,6 +1256,7 @@ App.Utils.CalendarDefaultView = (function () {
                         editable: false,
                         className: 'fc-blocked-period fc-unavailability',
                         data: blockedPeriod,
+                        display: 'block',
                     };
 
                     calendarEventSource.push(blockedPeriodEvent);
@@ -1317,6 +1320,7 @@ App.Utils.CalendarDefaultView = (function () {
                             color: '#879DB4',
                             editable: false,
                             className: 'fc-working-plan-exception fc-custom',
+                            display: 'block',
                             data: {
                                 date: weekdayDate,
                                 workingPlanException: workingPlanExceptions[weekdayDate],
@@ -1339,6 +1343,7 @@ App.Utils.CalendarDefaultView = (function () {
                             editable: false,
                             display: 'background',
                             className: 'fc-unavailability',
+                            display: 'block',
                         };
 
                         calendarEventSource.push(unavailabilityEvent);
@@ -1366,6 +1371,7 @@ App.Utils.CalendarDefaultView = (function () {
                             editable: false,
                             display: 'background',
                             className: 'fc-unavailability',
+                            display: 'block',
                         };
 
                         calendarEventSource.push(unavailabilityEvent);
@@ -1389,6 +1395,7 @@ App.Utils.CalendarDefaultView = (function () {
                             editable: false,
                             display: 'background',
                             className: 'fc-unavailability',
+                            display: 'block',
                         };
 
                         calendarEventSource.push(unavailabilityEvent);
@@ -1415,6 +1422,7 @@ App.Utils.CalendarDefaultView = (function () {
                             editable: false,
                             display: 'background',
                             className: 'fc-unavailability fc-break',
+                            display: 'block',
                         };
 
                         calendarEventSource.push(unavailabilityEvent);
diff --git a/assets/js/utils/calendar_table_view.js b/assets/js/utils/calendar_table_view.js
index 25d6582be6..ab2026e9db 100755
--- a/assets/js/utils/calendar_table_view.js
+++ b/assets/js/utils/calendar_table_view.js
@@ -765,6 +765,7 @@ App.Utils.CalendarTableView = (function () {
                 end: moment(workingPlanExceptionEnd, 'YYYY-MM-DD HH:mm', true).add(1, 'day'),
                 allDay: true,
                 color: '#879DB4',
+                display: 'block',
                 editable: false,
                 className: 'fc-working-plan-exception fc-custom',
                 data: {
@@ -784,6 +785,7 @@ App.Utils.CalendarTableView = (function () {
                 end: end,
                 allDay: false,
                 color: '#BEBEBE',
+                display: 'block',
                 editable: false,
                 display: 'background',
                 className: 'fc-unavailability',
@@ -805,6 +807,7 @@ App.Utils.CalendarTableView = (function () {
                 end: workDateStart.toDate(),
                 allDay: false,
                 color: '#BEBEBE',
+                display: 'block',
                 editable: false,
                 display: 'background',
                 className: 'fc-unavailability',
@@ -823,6 +826,7 @@ App.Utils.CalendarTableView = (function () {
                 end: end.toDate(),
                 allDay: false,
                 color: '#BEBEBE',
+                display: 'block',
                 editable: false,
                 display: 'background',
                 className: 'fc-unavailability',
@@ -845,6 +849,7 @@ App.Utils.CalendarTableView = (function () {
                 end: breakEnd.toDate(),
                 allDay: false,
                 color: '#BEBEBE',
+                display: 'block',
                 editable: false,
                 display: 'background',
                 className: 'fc-unavailability fc-break',
@@ -907,6 +912,7 @@ App.Utils.CalendarTableView = (function () {
                 end: moment(appointment.end_datetime).toDate(),
                 allDay: false,
                 color: appointment.color,
+                display: 'block',
                 data: appointment, // Store appointment data for later use.
             });
         }
@@ -942,6 +948,7 @@ App.Utils.CalendarTableView = (function () {
                 end: moment(unavailability.end_datetime).toDate(),
                 allDay: false,
                 color: '#879DB4',
+                display: 'block',
                 editable: true,
                 className: 'fc-unavailability fc-custom',
                 data: unavailability,
@@ -979,6 +986,7 @@ App.Utils.CalendarTableView = (function () {
                 backgroundColor: '#d65069',
                 borderColor: '#d65069',
                 textColor: '#ffffff',
+                display: 'block',
                 editable: false,
                 className: 'fc-blocked-period fc-unavailability',
                 data: blockedPeriod,