diff --git a/components/calendar/calendar-client.tsx b/components/calendar/calendar-client.tsx
index a7619a54..08ee96fd 100644
--- a/components/calendar/calendar-client.tsx
+++ b/components/calendar/calendar-client.tsx
@@ -528,6 +528,27 @@ export function CalendarClient({ initialCalendars, userId, userProfile }: Calend
     fetchCalendars();
   }, []);
 
+  // Add effect to ensure selectedCalendarId is set
+  useEffect(() => {
+    if (!selectedCalendarId && calendars.length > 0) {
+      console.log("Setting initial calendar selection:", calendars[0]);
+      setSelectedCalendarId(calendars[0].id);
+      setEventForm(prev => ({
+        ...prev,
+        calendarId: calendars[0].id
+      }));
+    }
+  }, [calendars, selectedCalendarId]);
+
+  const handleCalendarSelect = (calendarId: string) => {
+    console.log("Calendar selected:", calendarId);
+    setSelectedCalendarId(calendarId);
+    setEventForm(prev => ({
+      ...prev,
+      calendarId: calendarId
+    }));
+  };
+
   const handleCalendarSave = async (calendarData: Partial<Calendar>) => {
     try {
       setLoading(true);
@@ -587,8 +608,12 @@ export function CalendarClient({ initialCalendars, userId, userProfile }: Calend
     const startDate = new Date(selectInfo.start);
     const endDate = new Date(selectInfo.end);
     
+    console.log("Date select handler - Current calendars:", calendars);
+    console.log("Date select handler - Current selectedCalendarId:", selectedCalendarId);
+    
     // If no calendar is selected, use the first available calendar
     if (!selectedCalendarId && calendars.length > 0) {
+      console.log("No calendar selected, selecting first calendar:", calendars[0]);
       setSelectedCalendarId(calendars[0].id);
     }
     
@@ -625,6 +650,12 @@ export function CalendarClient({ initialCalendars, userId, userProfile }: Calend
   const handleEventSubmit = async () => {
     try {
       if (!eventForm.title || !eventForm.start || !eventForm.end || !selectedCalendarId) {
+        console.log("Form validation failed:", {
+          title: eventForm.title,
+          start: eventForm.start,
+          end: eventForm.end,
+          selectedCalendarId
+        });
         setError("Veuillez remplir tous les champs obligatoires");
         return;
       }
@@ -637,7 +668,9 @@ export function CalendarClient({ initialCalendars, userId, userProfile }: Calend
         userId,
         isAllDay: eventForm.allDay
       };
-      console.log("Submitting event:", eventData);
+      console.log("Submitting event with data:", eventData);
+      console.log("Available calendars:", calendars);
+      console.log("Selected calendar ID:", selectedCalendarId);
       
       const response = await fetch("/api/events", {
         method: selectedEvent ? "PUT" : "POST",
@@ -648,6 +681,7 @@ export function CalendarClient({ initialCalendars, userId, userProfile }: Calend
       });
 
       const responseData = await response.json();
+      console.log("Response from server:", responseData);
       
       if (!response.ok) {
         console.error("Error response:", responseData);
@@ -718,7 +752,7 @@ export function CalendarClient({ initialCalendars, userId, userProfile }: Calend
     }
   };
 
-  // Add a calendar selector component
+  // Update CalendarSelector to use the new handler
   const CalendarSelector = () => (
     <div className="flex flex-wrap items-center gap-2 mb-4">
       {calendars.map((calendar) => (
@@ -726,7 +760,7 @@ export function CalendarClient({ initialCalendars, userId, userProfile }: Calend
           <Button
             variant={calendar.id === selectedCalendarId ? "secondary" : "ghost"}
             className="flex items-center gap-2 pr-8"
-            onClick={() => setSelectedCalendarId(calendar.id)}
+            onClick={() => handleCalendarSelect(calendar.id)}
           >
             <div 
               className="w-3 h-3 rounded-full"