fix: issue with end dates and hours text

totaldebug · Sep 12, 2023 · 3c241d3 · 3c241d3
1 parent 0e90793
commit 3c241d3
Show file tree

Hide file tree

Showing 3 changed files with 46 additions and 26 deletions.
diff --git a/src/lib/event.class.ts b/src/lib/event.class.ts
@@ -1,5 +1,7 @@
 import dayjs from 'dayjs';
+import utc from 'dayjs/plugin/utc';
 
+dayjs.extend(utc)
 /**
  * Creates an generalized Calendar Event to use when creating the calendar card
  * There can be Google Events and CalDav Events. This class normalizes those
@@ -70,9 +72,12 @@ export default class EventClass {
 	 */
 	get startDateTime() {
 		if (this._startDateTime === undefined) {
-			const date =
-				(this.rawEvent.start && this.rawEvent.start.date) || this.rawEvent.start.dateTime || this.rawEvent.start || '';
-			this._startDateTime = this._processDate(date);
+			if (this.rawEvent.start.date) {
+				this._startDateTime = this._processDate(dayjs(this.rawEvent.start.date, 'YYYY-MM-DD').startOf('day'));
+			} else {
+				this._startDateTime = this._processDate(dayjs(this.rawEvent.start.dateTime));
+			}
+
 		}
 
 		return this._startDateTime!.clone();
@@ -84,12 +89,15 @@ export default class EventClass {
 	 */
 	get endDateTime() {
 		if (this._endDateTime === undefined) {
-			const date = (this.rawEvent.end && this.rawEvent.end.date) || this.rawEvent.end.dateTime || this.rawEvent.end;
-			this._endDateTime = this._processDate(date, true);
+			if (this.rawEvent.end.date) {
+				this._endDateTime = this._processDate(dayjs(this.rawEvent.end.date, 'YYYY-MM-DD').subtract(1, 'day').endOf('day'), true);
+			} else {
+				this._endDateTime = this._processDate(dayjs(this.rawEvent.end.dateTime), true);
+			}
 		}
-
 		return this._endDateTime!.clone();
 	}
+
 	get addDays() {
 		return this.rawEvent.addDays !== undefined ? this.rawEvent.addDays : false;
 	}
@@ -114,27 +122,22 @@ export default class EventClass {
 
 	/**
 	 *
-	 * @param {string} date
-	 * @param {boolean} isEndDate
+	 * @param {dayjs} date
+	 * @param {boolean} isEndDateTime
 	 */
-	_processDate(date, isEndDate = false) {
-		if (!date) {
-			return date;
-		}
-
-		date = dayjs(date);
+	_processDate(date, isEndDateTime = false) {
 
 		// add days to a start date for multi day event
 		if (this.addDays !== false) {
-			if (!isEndDate && this.addDays) {
+			if (!isEndDateTime && this.addDays) {
 				date = date.add(this.addDays, 'days');
 			}
 
 			// if not the last day and we are modifying the endDateTime then
 			// set end dateTimeDate as end of start day for that partial event
-			if (!this.isLastDay && isEndDate) {
-				date = dayjs(this.startDateTime).endOf('day');
-			} else if (this.isLastDay && !isEndDate) {
+			if (!this.isLastDay && isEndDateTime) {
+				date = this.startDateTime.endOf('day');
+			} else if (!this.isFirstDay && !isEndDateTime) {
 				// if last day and start time then set start as start of day
 				date = date.startOf('day');
 			}
@@ -148,6 +151,7 @@ export default class EventClass {
 	 * @return {boolean}
 	 */
 	get isRecurring() {
+
 		return !!this.rawEvent.recurringEventId;
 	}
 

diff --git a/src/lib/event.func.ts b/src/lib/event.func.ts
@@ -339,7 +339,9 @@ export function processEvents(allEvents: any[], config: atomicCardConfig) {
 		// Update calendar names for the kept events and append removed calendar names
 		updatedEvents.forEach(event => {
 			const eventIdentifier = event.title + '|' + event.startDateTime + '|' + event.endDateTime;
-			event.originName = eventMap[eventIdentifier].calendars.join(', ');
+			if (eventMap[eventIdentifier]) { // Check if eventMap[eventIdentifier] is defined
+				event.originName = eventMap[eventIdentifier].calendars.join(', ');
+			}
 		});
 
 		newEvents = updatedEvents;

diff --git a/src/lib/eventMode.html.ts b/src/lib/eventMode.html.ts
@@ -79,22 +79,36 @@ export function getHoursHTML(config: atomicCardConfig, event: EventClass) {
     				${config.fullDayEventText}, ${config.untilText!.toLowerCase()}
     				${getCurrDayAndMonth(event.endDateTime)}
     			`;
-    } else if (event.isAllDayEvent && event.isMultiDay &&
+    }
+    // 2. Is an all day event, over multiple days and the start time is before today or the
+    // end time is after today -> 'All dat, until end date'
+    else if (event.isAllDayEvent && event.isMultiDay &&
         (event.startDateTime.isBefore(today, 'day') || event.endDateTime.isAfter(today, 'day'))) {
         return html`
                				${config.fullDayEventText}, ${config.untilText!.toLowerCase()}
                				${getCurrDayAndMonth(event.endDateTime)}
                			`;
-    } else if (event.isAllDayEvent) {
+    }
+    // 3. Is an all day event, not matching 1 or 2 -> 'All Day'
+    else if (event.isAllDayEvent) {
         return html`${config.fullDayEventText}`;
-    } else if (event.startDateTime.isBefore(today, 'day') && event.endDateTime.isAfter(today, 'day')) {
+    }
+    // 4. Starts before today, ends after today -> 'Until end date'
+    else if (event.startDateTime.isBefore(today, 'day') && event.endDateTime.isAfter(today, 'day')) {
         return html`${config.untilText} ${getCurrDayAndMonth(event.endDateTime)}`;
-    } else if (event.startTimeToShow.isBefore(today, 'day') && event.endDateTime.isSame(today, 'day')) {
+
+    }
+    // 5. starts before today, ends today -> 'Until end time'
+    else if (event.startDateTime.isBefore(today, 'day') && event.endDateTime.isSame(today, 'day')) {
         return html`${config.untilText} ${event.endDateTime.format('LT')} `;
-    } else if (!event.startDateTime.isBefore(today, 'day') && event.endDateTime.isAfter(event.startDateTime, 'day')) {
+    }
+    // 6. Does not start before today, ends after start
+    else if (!event.startDateTime.isBefore(today, 'day') && event.endDateTime.isAfter(event.startDateTime, 'day')) {
         return html`${event.startDateTime.format('LT')}, ${config.untilText!.toLowerCase()}
-                                                    ${getCurrDayAndMonth(event.endDateTime)} ${event.endDateTime.format('HH:mm')}`;
-    } else {
+                    ${getCurrDayAndMonth(event.endDateTime)} ${event.endDateTime.format('HH:mm')}`;
+    }
+    // 7. anything that doesnt fit -> 'start time - end time'
+    else {
         return html`${event.startDateTime.format('LT')} - ${event.endDateTime.format('LT')} `;
     }
 }