From 8d938c721c4540c7c14612fd5b54cb4b70b7f505 Mon Sep 17 00:00:00 2001
From: "Janus C. H. Knudsen" <janus007@gmail.com>
Date: Wed, 17 Dec 2025 18:09:54 +0100
Subject: [PATCH] Refactor calendar event handling with EventBus

Migrates calendar commands from DOM events to EventBus for better decoupling
Adds support for workweek change and simplified rendering commands
Removes direction parameter from render method for cleaner implementation
---
 src/v2/constants/CoreEvents.ts |  5 ++++-
 src/v2/core/CalendarApp.ts     | 38 +++++++++++++++++++++-------------
 src/v2/demo/DemoApp.ts         | 20 +++++++++++-------
 3 files changed, 40 insertions(+), 23 deletions(-)

diff --git a/src/v2/constants/CoreEvents.ts b/src/v2/constants/CoreEvents.ts
index 11ae6c3..1425a2f 100644
--- a/src/v2/constants/CoreEvents.ts
+++ b/src/v2/constants/CoreEvents.ts
@@ -71,5 +71,8 @@ export const CoreEvents = {
 
   // Calendar command events
   CALENDAR_CMD_NAVIGATE_PREV: 'calendar:cmd:navigate:prev',
-  CALENDAR_CMD_NAVIGATE_NEXT: 'calendar:cmd:navigate:next'
+  CALENDAR_CMD_NAVIGATE_NEXT: 'calendar:cmd:navigate:next',
+  CALENDAR_CMD_DRAWER_TOGGLE: 'calendar:cmd:drawer:toggle',
+  CALENDAR_CMD_RENDER: 'calendar:cmd:render',
+  CALENDAR_CMD_WORKWEEK_CHANGE: 'calendar:cmd:workweek:change'
 } as const;
diff --git a/src/v2/core/CalendarApp.ts b/src/v2/core/CalendarApp.ts
index ac86fcd..375ca76 100644
--- a/src/v2/core/CalendarApp.ts
+++ b/src/v2/core/CalendarApp.ts
@@ -86,26 +86,27 @@ export class CalendarApp {
       this.handleNavigateNext();
     });
 
-    // Other commands via container DOM events (migrates later)
-    this.container.addEventListener('calendar:cmd:render', ((e: CustomEvent) => {
-      const { viewId, direction } = e.detail;
-      this.handleRenderCommand(viewId, direction);
+    // Drawer toggle via EventBus
+    this.eventBus.on(CoreEvents.CALENDAR_CMD_DRAWER_TOGGLE, () => {
+      this.headerDrawerManager.toggle();
+    });
+
+    // Render command via EventBus
+    this.eventBus.on(CoreEvents.CALENDAR_CMD_RENDER, ((e: CustomEvent) => {
+      const { viewId } = e.detail;
+      this.handleRenderCommand(viewId);
     }) as EventListener);
 
-    this.container.addEventListener('calendar:cmd:drawer:toggle', (() => {
-      this.headerDrawerManager.toggle();
+    // Workweek change via EventBus
+    this.eventBus.on(CoreEvents.CALENDAR_CMD_WORKWEEK_CHANGE, ((e: CustomEvent) => {
+      const { presetId } = e.detail;
+      this.handleWorkweekChange(presetId);
     }) as EventListener);
   }
 
-  private async handleRenderCommand(viewId: string, direction?: 'left' | 'right'): Promise<void> {
+  private async handleRenderCommand(viewId: string): Promise<void> {
     this.currentViewId = viewId;
-
-    if (direction) {
-      await this.animator.slide(direction, () => this.render());
-    } else {
-      await this.render();
-    }
-
+    await this.render();
     this.emitStatus('rendered', { viewId });
   }
 
@@ -121,6 +122,15 @@ export class CalendarApp {
     this.emitStatus('rendered', { viewId: this.currentViewId });
   }
 
+  private async handleWorkweekChange(presetId: string): Promise<void> {
+    const preset = await this.settingsService.getWorkweekPreset(presetId);
+    if (preset) {
+      this.workweekPreset = preset;
+      await this.render();
+      this.emitStatus('rendered', { viewId: this.currentViewId });
+    }
+  }
+
   private async render(): Promise<void> {
     const storedConfig = await this.viewConfigService.getById(this.currentViewId);
     if (!storedConfig) {
diff --git a/src/v2/demo/DemoApp.ts b/src/v2/demo/DemoApp.ts
index 78c2293..c7083cd 100644
--- a/src/v2/demo/DemoApp.ts
+++ b/src/v2/demo/DemoApp.ts
@@ -41,12 +41,13 @@ export class DemoApp {
     this.setupNavigation();
     this.setupDrawerToggle();
     this.setupViewSwitching();
+    this.setupWorkweekSelector();
 
     // Listen for calendar status events
     this.setupStatusListeners();
 
     // Initial render
-    this.emitRenderCommand(this.currentView);
+    this.eventBus.emit(CoreEvents.CALENDAR_CMD_RENDER, { viewId: this.currentView });
   }
 
   private setupNavigation(): void {
@@ -69,7 +70,7 @@ export class DemoApp {
         const view = (chip as HTMLElement).dataset.view;
         if (view) {
           this.currentView = view;
-          this.emitRenderCommand(view);
+          this.eventBus.emit(CoreEvents.CALENDAR_CMD_RENDER, { viewId: view });
         }
       });
     });
@@ -77,10 +78,18 @@ export class DemoApp {
 
   private setupDrawerToggle(): void {
     document.getElementById('btn-drawer')!.onclick = () => {
-      this.container.dispatchEvent(new CustomEvent('calendar:cmd:drawer:toggle'));
+      this.eventBus.emit(CoreEvents.CALENDAR_CMD_DRAWER_TOGGLE);
     };
   }
 
+  private setupWorkweekSelector(): void {
+    const workweekSelect = document.getElementById('workweek-select') as HTMLSelectElement;
+    workweekSelect?.addEventListener('change', () => {
+      const presetId = workweekSelect.value;
+      this.eventBus.emit(CoreEvents.CALENDAR_CMD_WORKWEEK_CHANGE, { presetId });
+    });
+  }
+
   private setupStatusListeners(): void {
     this.container.addEventListener('calendar:status:ready', () => {
       console.log('[DemoApp] Calendar ready');
@@ -95,9 +104,4 @@ export class DemoApp {
     }) as EventListener);
   }
 
-  private emitRenderCommand(viewId: string, direction?: 'left' | 'right'): void {
-    this.container.dispatchEvent(new CustomEvent('calendar:cmd:render', {
-      detail: { viewId, direction }
-    }));
-  }
 }