calendar 11

components/calendar/calendar-client.tsx

@@ -391,7 +391,10 @@ function EventPreview({ event, calendar }: { event: Event; calendar: Calendar })
 }
 
 export function CalendarClient({ initialCalendars, userId, userProfile }: CalendarClientProps) {
-  const [calendars, setCalendars] = useState(initialCalendars);
+  const [calendars, setCalendars] = useState(initialCalendars.map(cal => ({
+    ...cal,
+    events: cal.events || []
+  })));
   const [selectedCalendarId, setSelectedCalendarId] = useState<string>(
     initialCalendars[0]?.id || ""
   );
@@ -601,18 +604,20 @@ export function CalendarClient({ initialCalendars, userId, userProfile }: Calend
                 setSelectedCalendar(null);
                 setIsCalendarModalOpen(true);
               }}
+              className="bg-white hover:bg-gray-50 text-gray-900 border-gray-200"
             >
               <Plus className="mr-2 h-4 w-4" />
-              Nouveau calendrier
+              <span className="font-medium">Nouveau calendrier</span>
             </Button>
             <Button
               onClick={() => {
                 setSelectedEvent(null);
                 setIsEventModalOpen(true);
               }}
+              className="bg-primary hover:bg-primary/90 text-white"
             >
               <Plus className="mr-2 h-4 w-4" />
-              Nouvel événement
+              <span className="font-medium">Nouvel événement</span>
             </Button>
           </div>
 
@@ -656,7 +661,7 @@ export function CalendarClient({ initialCalendars, userId, userProfile }: Calend
               right: "",
             }}
             events={calendars.flatMap(cal => 
-              cal.events.map(event => ({
+              (cal.events || []).map(event => ({
                 id: event.id,
                 title: event.title,
                 start: event.start,