From 0f10d440377fa2f9b5a9d0975472d03f90f8fd8a Mon Sep 17 00:00:00 2001 From: "Janus C. H. Knudsen" Date: Tue, 18 Nov 2025 16:43:50 +0100 Subject: [PATCH] Refactors date handling in calendar components Updates event and column date parsing to use identifier instead of data attribute Improves date handling consistency across multiple calendar managers and renderers Replaces direct Date casting with dateService.parseISO() for more robust date parsing --- src/managers/AllDayManager.ts | 14 +++++++------- src/renderers/EventRenderer.ts | 6 +++--- src/renderers/EventRendererManager.ts | 8 ++++---- 3 files changed, 14 insertions(+), 14 deletions(-) diff --git a/src/managers/AllDayManager.ts b/src/managers/AllDayManager.ts index 1452b55..6cee9cf 100644 --- a/src/managers/AllDayManager.ts +++ b/src/managers/AllDayManager.ts @@ -165,8 +165,8 @@ export class AllDayManager { eventBus.on('header:ready', async (event: Event) => { let headerReadyEventPayload = (event as CustomEvent).detail; - let startDate = new Date(headerReadyEventPayload.headerElements.at(0)!.data as Date); - let endDate = new Date(headerReadyEventPayload.headerElements.at(-1)!.data as Date); + let startDate = this.dateService.parseISO(headerReadyEventPayload.headerElements.at(0)!.identifier); + let endDate = this.dateService.parseISO(headerReadyEventPayload.headerElements.at(-1)!.identifier); let events: ICalendarEvent[] = await this.eventManager.getEventsForPeriod(startDate, endDate); // Filter for all-day events @@ -398,7 +398,7 @@ export class AllDayManager { this.currentWeekDates = dayHeaders; // Initialize layout engine with provided week dates - let layoutEngine = new AllDayLayoutEngine(dayHeaders.map(column => column.data as Date)); + let layoutEngine = new AllDayLayoutEngine(dayHeaders.map(column => column.identifier)); // Calculate layout for all events together - AllDayLayoutEngine handles CalendarEvents directly return layoutEngine.calculateLayout(events); @@ -489,8 +489,8 @@ export class AllDayManager { const clone = dragEndEvent.draggedClone as SwpAllDayEventElement; const eventId = clone.eventId.replace('clone-', ''); - const targetDate = dragEndEvent.finalPosition.column.data as Date; - + const targetDate = this.dateService.parseISO(dragEndEvent.finalPosition.column.identifier); + console.log('🔄 AllDayManager: Converting timed event to all-day', { eventId, targetDate }); // Create new dates preserving time @@ -537,8 +537,8 @@ export class AllDayManager { const clone = dragEndEvent.draggedClone as SwpAllDayEventElement; const eventId = clone.eventId.replace('clone-', ''); - const targetDate = dragEndEvent.finalPosition.column.data as Date; - + const targetDate = this.dateService.parseISO(dragEndEvent.finalPosition.column.identifier); + // Calculate duration in days const durationDays = this.dateService.differenceInCalendarDays(clone.end, clone.start); diff --git a/src/renderers/EventRenderer.ts b/src/renderers/EventRenderer.ts index a55d0c4..045ffc6 100644 --- a/src/renderers/EventRenderer.ts +++ b/src/renderers/EventRenderer.ts @@ -102,7 +102,7 @@ export class DateEventRenderer implements IEventRenderer { public handleDragMove(payload: IDragMoveEventPayload): void { const swpEvent = payload.draggedClone as SwpEventElement; - const columnDate = this.dateService.parseISO(payload.columnBounds!!.data as Date); + const columnDate = this.dateService.parseISO(payload.columnBounds!!.identifier); swpEvent.updatePosition(columnDate, payload.snappedY); } @@ -118,7 +118,7 @@ export class DateEventRenderer implements IEventRenderer { // Recalculate timestamps with new column date const currentTop = parseFloat(payload.draggedClone.style.top) || 0; const swpEvent = payload.draggedClone as SwpEventElement; - const columnDate = this.dateService.parseISO(payload.newColumn.data as Date); + const columnDate = this.dateService.parseISO(payload.newColumn.identifier); swpEvent.updatePosition(columnDate, currentTop); } } @@ -130,7 +130,7 @@ export class DateEventRenderer implements IEventRenderer { console.log('🎯 DateEventRenderer: Converting all-day to timed event', { eventId: payload.calendarEvent.id, - targetColumn: payload.targetColumn.data as Date, + targetColumn: payload.targetColumn.identifier, snappedY: payload.snappedY }); diff --git a/src/renderers/EventRendererManager.ts b/src/renderers/EventRendererManager.ts index 31ac768..7d2f0fd 100644 --- a/src/renderers/EventRendererManager.ts +++ b/src/renderers/EventRendererManager.ts @@ -216,7 +216,7 @@ export class EventRenderingService { cloneElement.style.display = ''; console.log('🚪 EventRendererManager: Received drag:mouseleave-header', { - targetDate, + targetColumn: targetColumn?.identifier, originalElement: originalElement, cloneElement: cloneElement }); @@ -296,7 +296,7 @@ export class EventRenderingService { } // Re-render target column if exists and different from source - if (targetColumn && (targetColumn.data as Date) !== (originalSourceColumn?.data as Date)) { + if (targetColumn && targetColumn.identifier !== originalSourceColumn?.identifier) { await this.renderSingleColumn(targetColumn); } } @@ -317,7 +317,7 @@ export class EventRenderingService { */ private async renderSingleColumn(column: IColumnBounds): Promise { // Get events for just this column's date - const dateString = (column.data as Date).toISOString().split('T')[0]; + const dateString = column.identifier; const columnStart = this.dateService.parseISO(`${dateString}T00:00:00`); const columnEnd = this.dateService.parseISO(`${dateString}T23:59:59.999`); @@ -343,7 +343,7 @@ export class EventRenderingService { } console.log('🔄 EventRendererManager: Re-rendered single column', { - columnDate: column.data as Date, + columnDate: column.identifier, eventsCount: timedEvents.length }); }