Refactors event handling and grid rendering

Improves calendar performance and data flow by streamlining event emissions and grid rendering logic.

- Replaces generic CONFIG_UPDATE events with REFRESH_REQUESTED
  for more specific refresh triggers.
- Removes redundant grid re-renders on DATE_CHANGED and
  WEEK_CHANGED events, delegating navigation to NavigationManager.
- Introduces VIEW_CHANGED and DATE_CHANGED events for calendar
  mode and date selection, respectively.
- NavigationManager now handles date validation.
- Moves rendering logic from NavigationManager to NavigationRenderer.
- Syncs scroll position based on PERIOD_CHANGED instead of
  NAVIGATION_ANIMATION_COMPLETE.

This change optimizes the calendar's responsiveness and reduces
unnecessary re-renders, leading to a smoother user experience.
This commit is contained in:
Janus Knudsen 2025-08-20 21:38:54 +02:00
parent 4b4dbdc0d6
commit 83c0ce801c
9 changed files with 59 additions and 47 deletions

View file

@ -35,7 +35,7 @@ export class NavigationManager {
private setupEventListeners(): void {
// Initial DOM update when calendar is initialized
this.eventBus.on(CoreEvents.CALENDAR_INITIALIZED, () => {
this.eventBus.on(CoreEvents.INITIALIZED, () => {
console.log('NavigationManager: Received CALENDAR_INITIALIZED, updating week info');
this.updateWeekInfo();
});
@ -63,9 +63,22 @@ export class NavigationManager {
});
// Listen for external navigation requests
this.eventBus.on(CoreEvents.NAVIGATE_TO_DATE, (event: Event) => {
this.eventBus.on(CoreEvents.DATE_CHANGED, (event: Event) => {
const customEvent = event as CustomEvent;
const targetDate = new Date(customEvent.detail.date);
const dateFromEvent = customEvent.detail.date || customEvent.detail.currentDate;
// Validate date before processing
if (!dateFromEvent) {
console.warn('NavigationManager: No date provided in DATE_CHANGED event', customEvent.detail);
return;
}
const targetDate = new Date(dateFromEvent);
if (isNaN(targetDate.getTime())) {
console.warn('NavigationManager: Invalid date in DATE_CHANGED event', dateFromEvent);
return;
}
this.navigateToDate(targetDate);
});
}
@ -189,10 +202,6 @@ export class NavigationManager {
// Update week info and notify other managers
this.updateWeekInfo();
this.eventBus.emit(CoreEvents.WEEK_CHANGED, {
weekStart: this.currentWeek,
weekEnd: this.dateCalculator.addDays(this.currentWeek, 6)
});
// Emit period change event for ScrollManager
this.eventBus.emit(CoreEvents.PERIOD_CHANGED, {
@ -247,11 +256,6 @@ export class NavigationManager {
this.currentWeek = new Date(weekStart);
this.targetWeek = new Date(weekStart);
this.updateWeekInfo();
this.eventBus.emit(CoreEvents.WEEK_CHANGED, {
weekStart: this.currentWeek,
weekEnd: DateUtils.addDays(this.currentWeek, 6)
});
}
// Rendering methods moved to NavigationRenderer for better separation of concerns