From 295d466cc4b745e3fb589d5e0f7409edfe094083 Mon Sep 17 00:00:00 2001
From: Nifemi Ogunmesa <95006475+Nogunmesa@users.noreply.github.com>
Date: Wed, 14 May 2025 22:11:27 +0000
Subject: [PATCH 1/2] Edit button pushes to database, but it doesn't fully
 prefill

---
 frontend/src/app/dashboard/calendar/page.tsx | 34 +++++++++++++++++++-
 1 file changed, 33 insertions(+), 1 deletion(-)

diff --git a/frontend/src/app/dashboard/calendar/page.tsx b/frontend/src/app/dashboard/calendar/page.tsx
index aef66f6b..44455fb3 100644
--- a/frontend/src/app/dashboard/calendar/page.tsx
+++ b/frontend/src/app/dashboard/calendar/page.tsx
@@ -271,6 +271,7 @@ export default function Home() {
     }
   }
 
+
   async function handleDelete() {
     console.log('handleDelete called for event: ', idToDelete);
 
@@ -326,6 +327,26 @@ export default function Home() {
       return;
     }
 
+    if (newEvent.id) {
+      // Editing an existing event
+      axios
+        .put(`${backendBaseUrl}/api/calendar/events/id/${newEvent.id}`, newEvent)
+        .then((response) => {
+          console.log('Successfully updated event:', response.data);
+  
+          // Update the event in the local state
+          setAllEvents(
+            allEvents.map((event) =>
+              event.id === newEvent.id ? { ...event, ...newEvent } : event
+            )
+          );
+        })
+        .catch((error) => {
+          console.error('Error updating event:', error);
+        });
+    } else {
+      // Creating a new event
+
     const eventWithUser: UserEvent & {
       start: Date;
       end?: Date;
@@ -383,7 +404,7 @@ export default function Home() {
       .catch((error) => {
         console.error('Error saving event:', error);
       });
-
+    }
     setShowModal(false);
     setNewEvent({
       ...example,
@@ -602,6 +623,17 @@ export default function Home() {
                     </div>
 
                     <div className="bg-gray-50 px-4 py-3 sm:flex sm:flex-row-reverse sm:px-6">
+                    <button
+    type="button"
+    className="inline-flex w-full justify-center rounded-md bg-blue-600 px-3 py-2 text-sm font-semibold text-white shadow-sm hover:bg-blue-500 sm:ml-3 sm:w-auto"
+    onClick={() => {
+      setShowModal(true); // Open the modal for editing
+      setNewEvent(selectedEvent); // Pre-fill the modal with the selected event's details
+      setIsDeadline(selectedEvent.is_recurring); // Set deadline state based on the event
+    }}
+  >
+    Edit
+  </button>
                       <button
                         type="button"
                         className="inline-flex w-full justify-center rounded-md bg-red-600 px-3 py-2 text-sm

From 57aad0ca267de59495bcf7a1bd4e50d69d126032 Mon Sep 17 00:00:00 2001
From: Nifemi Ogunmesa <95006475+Nogunmesa@users.noreply.github.com>
Date: Wed, 14 May 2025 22:13:13 +0000
Subject: [PATCH 2/2] Edit button pushes to database, but it doesn't fully
 prefill

---
 frontend/src/app/dashboard/calendar/page.tsx | 134 ++++++++++---------
 1 file changed, 68 insertions(+), 66 deletions(-)

diff --git a/frontend/src/app/dashboard/calendar/page.tsx b/frontend/src/app/dashboard/calendar/page.tsx
index 44455fb3..e8a31bba 100644
--- a/frontend/src/app/dashboard/calendar/page.tsx
+++ b/frontend/src/app/dashboard/calendar/page.tsx
@@ -271,7 +271,6 @@ export default function Home() {
     }
   }
 
-
   async function handleDelete() {
     console.log('handleDelete called for event: ', idToDelete);
 
@@ -330,10 +329,13 @@ export default function Home() {
     if (newEvent.id) {
       // Editing an existing event
       axios
-        .put(`${backendBaseUrl}/api/calendar/events/id/${newEvent.id}`, newEvent)
+        .put(
+          `${backendBaseUrl}/api/calendar/events/id/${newEvent.id}`,
+          newEvent
+        )
         .then((response) => {
           console.log('Successfully updated event:', response.data);
-  
+
           // Update the event in the local state
           setAllEvents(
             allEvents.map((event) =>
@@ -347,63 +349,63 @@ export default function Home() {
     } else {
       // Creating a new event
 
-    const eventWithUser: UserEvent & {
-      start: Date;
-      end?: Date;
-      color?: string;
-    } = {
-      ...newEvent,
-      user_id: user.uid,
-      start: new Date(newEvent.start_time), // <-- ensure start is there
-      end: newEvent.end_time ? new Date(newEvent.end_time) : undefined,
-      title: newEvent.title,
-      id: newEvent.id, // this is FullCalendar id
-      break_time: newEvent.break_time,
-      start_time: newEvent.start_time,
-      created_at: new Date().toISOString(),
-      description: newEvent.description,
-      is_generated: false,
-      is_recurring: newEvent.is_recurring,
-      location_place: newEvent.location_place,
-      recurrence_end_date: newEvent.recurrence_end_date,
-      recurrence_pattern: newEvent.recurrence_pattern,
-      recurrence_start_date: newEvent.recurrence_start_date,
-      color: colorTypes.eventByUser,
-    };
+      const eventWithUser: UserEvent & {
+        start: Date;
+        end?: Date;
+        color?: string;
+      } = {
+        ...newEvent,
+        user_id: user.uid,
+        start: new Date(newEvent.start_time), // <-- ensure start is there
+        end: newEvent.end_time ? new Date(newEvent.end_time) : undefined,
+        title: newEvent.title,
+        id: newEvent.id, // this is FullCalendar id
+        break_time: newEvent.break_time,
+        start_time: newEvent.start_time,
+        created_at: new Date().toISOString(),
+        description: newEvent.description,
+        is_generated: false,
+        is_recurring: newEvent.is_recurring,
+        location_place: newEvent.location_place,
+        recurrence_end_date: newEvent.recurrence_end_date,
+        recurrence_pattern: newEvent.recurrence_pattern,
+        recurrence_start_date: newEvent.recurrence_start_date,
+        color: colorTypes.eventByUser,
+      };
 
-    axios
-      .post(backendBaseUrl + `/api/calendar/events`, eventWithUser)
-      .then((response) => {
-        // controller may save multiple events now.
-        console.log('Successfully saved events:', response);
-        console.log('event series', response.data.eventSeries);
-        const eventsToAdd: (typeof eventWithUser)[] = [];
+      axios
+        .post(backendBaseUrl + `/api/calendar/events`, eventWithUser)
+        .then((response) => {
+          // controller may save multiple events now.
+          console.log('Successfully saved events:', response);
+          console.log('event series', response.data.eventSeries);
+          const eventsToAdd: (typeof eventWithUser)[] = [];
 
-        // const { id, start_time, end_time, ...restEvent } = eventWithUser;
+          // const { id, start_time, end_time, ...restEvent } = eventWithUser;
 
-        for (const newEvent of response.data.eventSeries) {
-          // Notice that the keys might not be in the correct order
-          eventsToAdd.push({
-            ...eventWithUser,
-            id: newEvent.id,
-            start_time: new Date(newEvent.start_time).toISOString(),
-            end_time: newEvent.endTime,
-            start: new Date(newEvent.start_time),
-            end: newEvent.end_time ? new Date(newEvent.end_time) : undefined,
-          });
-        }
+          for (const newEvent of response.data.eventSeries) {
+            // Notice that the keys might not be in the correct order
+            eventsToAdd.push({
+              ...eventWithUser,
+              id: newEvent.id,
+              start_time: new Date(newEvent.start_time).toISOString(),
+              end_time: newEvent.endTime,
+              start: new Date(newEvent.start_time),
+              end: newEvent.end_time ? new Date(newEvent.end_time) : undefined,
+            });
+          }
 
-        setAllEvents([...allEvents, ...eventsToAdd]);
+          setAllEvents([...allEvents, ...eventsToAdd]);
 
-        // We want to be consistent and use our backend id
-        // const correctId = response.data.id;
-        // const { id, ...restEvent } = eventWithUser;
-        // console.log(`Replace ${id} with ${correctId}`);
-        // setAllEvents([...allEvents, { id: correctId, ...restEvent }]);
-      })
-      .catch((error) => {
-        console.error('Error saving event:', error);
-      });
+          // We want to be consistent and use our backend id
+          // const correctId = response.data.id;
+          // const { id, ...restEvent } = eventWithUser;
+          // console.log(`Replace ${id} with ${correctId}`);
+          // setAllEvents([...allEvents, { id: correctId, ...restEvent }]);
+        })
+        .catch((error) => {
+          console.error('Error saving event:', error);
+        });
     }
     setShowModal(false);
     setNewEvent({
@@ -623,17 +625,17 @@ export default function Home() {
                     </div>
 
                     <div className="bg-gray-50 px-4 py-3 sm:flex sm:flex-row-reverse sm:px-6">
-                    <button
-    type="button"
-    className="inline-flex w-full justify-center rounded-md bg-blue-600 px-3 py-2 text-sm font-semibold text-white shadow-sm hover:bg-blue-500 sm:ml-3 sm:w-auto"
-    onClick={() => {
-      setShowModal(true); // Open the modal for editing
-      setNewEvent(selectedEvent); // Pre-fill the modal with the selected event's details
-      setIsDeadline(selectedEvent.is_recurring); // Set deadline state based on the event
-    }}
-  >
-    Edit
-  </button>
+                      <button
+                        type="button"
+                        className="inline-flex w-full justify-center rounded-md bg-blue-600 px-3 py-2 text-sm font-semibold text-white shadow-sm hover:bg-blue-500 sm:ml-3 sm:w-auto"
+                        onClick={() => {
+                          setShowModal(true); // Open the modal for editing
+                          setNewEvent(selectedEvent); // Pre-fill the modal with the selected event's details
+                          setIsDeadline(selectedEvent.is_recurring); // Set deadline state based on the event
+                        }}
+                      >
+                        Edit
+                      </button>
                       <button
                         type="button"
                         className="inline-flex w-full justify-center rounded-md bg-red-600 px-3 py-2 text-sm