refactor Notifications agenda

components/calendar/calendar-widget.tsx

@@ -144,11 +144,12 @@ export function CalendarWidget() {
         setEvents(upcomingEvents.slice(0, 5)); // Keep only 5 for display
         
         // Dispatch event for Outlook-style notifications (when events start)
+        // Always dispatch, not just when count changes, so the hook can track events
         const eventsForNotification = upcomingEvents.map(evt => ({
           id: evt.id,
           title: evt.title,
-          start: evt.start,
+          start: evt.start instanceof Date ? evt.start : new Date(evt.start),
-          end: evt.end,
+          end: evt.end instanceof Date ? evt.end : new Date(evt.end),
           isAllDay: evt.isAllDay,
           calendarName: evt.calendarName,
           calendarColor: evt.calendarColor,
@@ -160,14 +161,20 @@ export function CalendarWidget() {
             id: e.id,
             title: e.title,
             start: e.start instanceof Date ? e.start.toISOString() : e.start,
+            isAllDay: e.isAllDay,
           })),
         });
         
+        try {
           window.dispatchEvent(new CustomEvent('calendar-events-updated', {
             detail: {
               events: eventsForNotification,
             }
           }));
+          console.log('[Calendar Widget] ✅ Event dispatched successfully');
+        } catch (error) {
+          console.error('[Calendar Widget] ❌ Error dispatching event', error);
+        }
         
         setError(null);
       } catch (err) {

hooks/use-calendar-event-notifications.ts

@@ -25,6 +25,8 @@ export function useCalendarEventNotifications() {
   const checkIntervalRef = useRef<NodeJS.Timeout | null>(null);
 
   useEffect(() => {
+    console.log('[useCalendarEventNotifications] 🎧 Hook initialized, listening for calendar-events-updated');
+    
     // Listen for calendar events updates
     const handleEventsUpdate = (event: CustomEvent) => {
       const events = event.detail?.events || [];