refactor Notifications agenda

components/calendar/calendar-widget.tsx

@@ -144,17 +144,28 @@ export function CalendarWidget() {
         setEvents(upcomingEvents.slice(0, 5)); // Keep only 5 for display
         
         // Dispatch event for Outlook-style notifications (when events start)
+        const eventsForNotification = upcomingEvents.map(evt => ({
+          id: evt.id,
+          title: evt.title,
+          start: evt.start,
+          end: evt.end,
+          isAllDay: evt.isAllDay,
+          calendarName: evt.calendarName,
+          calendarColor: evt.calendarColor,
+        }));
+        
+        console.log('[Calendar Widget] 📅 Dispatching calendar events update', {
+          eventsCount: eventsForNotification.length,
+          events: eventsForNotification.map(e => ({
+            id: e.id,
+            title: e.title,
+            start: e.start instanceof Date ? e.start.toISOString() : e.start,
+          })),
+        });
+        
         window.dispatchEvent(new CustomEvent('calendar-events-updated', {
           detail: {
-            events: upcomingEvents.map(evt => ({
+            events: eventsForNotification,
-              id: evt.id,
-              title: evt.title,
-              start: evt.start,
-              end: evt.end,
-              isAllDay: evt.isAllDay,
-              calendarName: evt.calendarName,
-              calendarColor: evt.calendarColor,
-            })),
           }
         }));
         

hooks/use-calendar-event-notifications.ts

@@ -29,6 +29,16 @@ export function useCalendarEventNotifications() {
     const handleEventsUpdate = (event: CustomEvent) => {
       const events = event.detail?.events || [];
       
+      console.log('[useCalendarEventNotifications] 📅 Received calendar events update', {
+        eventsCount: events.length,
+        events: events.map((e: any) => ({
+          id: e.id,
+          title: e.title,
+          start: e.start,
+          isAllDay: e.isAllDay,
+        })),
+      });
+      
       if (!events || events.length === 0) {
         eventsRef.current = [];
         return;
@@ -46,8 +56,13 @@ export function useCalendarEventNotifications() {
       }));
 
       eventsRef.current = calendarEvents;
-      console.log('[useCalendarEventNotifications] Events updated', {
+      console.log('[useCalendarEventNotifications] Events stored', {
         count: calendarEvents.length,
+        events: calendarEvents.map(e => ({
+          id: e.id,
+          title: e.title,
+          start: e.start.toISOString(),
+        })),
       });
     };
 
@@ -58,23 +73,43 @@ export function useCalendarEventNotifications() {
       const now = new Date();
       const currentTime = now.getTime();
       
-      // Check events that start within the next 2 minutes (to catch events that just started)
+      console.log('[useCalendarEventNotifications] 🔍 Checking for starting events', {
-      const upcomingWindow = 2 * 60 * 1000; // 2 minutes in milliseconds
+        now: now.toISOString(),
+        eventsCount: eventsRef.current.length,
+        notifiedCount: notifiedEventIdsRef.current.size,
+      });
+      
+      // Check events that start within the next 5 minutes (to catch events that just started or are about to start)
+      const upcomingWindow = 5 * 60 * 1000; // 5 minutes in milliseconds
       
       const startingEvents = eventsRef.current.filter((event) => {
         // Skip if already notified
         if (notifiedEventIdsRef.current.has(event.id)) {
+          console.log('[useCalendarEventNotifications] ⏭️ Event already notified', {
+            id: event.id,
+            title: event.title,
+          });
           return false;
         }
 
         const eventStartTime = event.start.getTime();
         const timeUntilStart = eventStartTime - currentTime;
+        const timeUntilStartMinutes = Math.round(timeUntilStart / 1000 / 60);
         
-        // Event is starting now or within the next 2 minutes
+        console.log('[useCalendarEventNotifications] ⏰ Checking event', {
-        // And hasn't started more than 5 minutes ago (to avoid old notifications)
+          id: event.id,
+          title: event.title,
+          start: event.start.toISOString(),
+          now: now.toISOString(),
+          timeUntilStartMinutes,
+          inWindow: timeUntilStart >= -2 * 60 * 1000 && timeUntilStart <= upcomingWindow,
+        });
+        
+        // Event is starting now (within last 2 minutes) or within the next 5 minutes
+        // This allows catching events that just started or are about to start
         return (
-          timeUntilStart >= -5 * 60 * 1000 && // Not more than 5 minutes ago
+          timeUntilStart >= -2 * 60 * 1000 && // Not more than 2 minutes ago (just started)
-          timeUntilStart <= upcomingWindow // Within next 2 minutes
+          timeUntilStart <= upcomingWindow // Within next 5 minutes
         );
       });
 
@@ -85,10 +120,11 @@ export function useCalendarEventNotifications() {
         // Show notification for the first event starting
         const event = startingEvents[0];
         
-        console.log('[useCalendarEventNotifications] 📅 Event starting detected', {
+        console.log('[useCalendarEventNotifications] 📅 Event starting detected!', {
           title: event.title,
-          start: event.start,
+          start: event.start.toISOString(),
-          now: now,
+          now: now.toISOString(),
+          timeUntilStart: Math.round((event.start.getTime() - currentTime) / 1000 / 60),
         });
 
         const timeStr = event.isAllDay
@@ -130,9 +166,9 @@ export function useCalendarEventNotifications() {
       }
     };
 
-    // Check immediately and then every minute
+    // Check immediately and then every 10 seconds for more responsive notifications
     checkForStartingEvents();
-    checkIntervalRef.current = setInterval(checkForStartingEvents, 60000); // Every minute
+    checkIntervalRef.current = setInterval(checkForStartingEvents, 10000); // Every 10 seconds
 
     return () => {
       window.removeEventListener('calendar-events-updated', handleEventsUpdate as EventListener);