[#4] added attendance management

src/features/Calendars/CalendarSlice.ts

@@ -56,9 +56,9 @@ export const putEventAsync = createAsyncThunk<
 >("calendars/putEvent", async ({ cal, newEvent }) => {
   const response = await putEvent(cal, newEvent);
   const calEvents = (await getCalendar(cal.id, {
-    start: formatDateToYYYYMMDDTHHMMSS(newEvent.start),
+    start: formatDateToYYYYMMDDTHHMMSS(new Date(newEvent.start)),
     end: formatDateToYYYYMMDDTHHMMSS(
-      new Date(newEvent.start.getTime() + 86400000)
+      new Date(new Date(newEvent.start).getTime() + 86400000)
     ),
   })) as Record<string, any>;
   const events: CalendarEvent[] = calEvents._embedded["dav:item"].flatMap(

src/features/Events/EventDisplay.tsx

@@ -1,5 +1,5 @@
 import { useEffect, useState } from "react";
-import { deleteEventAsync } from "../Calendars/CalendarSlice";
+import { deleteEventAsync, putEventAsync } from "../Calendars/CalendarSlice";
 import { useAppDispatch, useAppSelector } from "../../app/hooks";
 import {
   Popover,
@@ -25,6 +25,7 @@ import CircleIcon from "@mui/icons-material/Circle";
 import CancelIcon from "@mui/icons-material/Cancel";
 import CheckCircleIcon from "@mui/icons-material/CheckCircle";
 import { userAttendee } from "../User/userDataTypes";
+import { putEvent } from "./EventApi";
 
 function EventDisplayModal({
   eventId,
@@ -74,6 +75,18 @@ function EventDisplayModal({
     (a) => a.cal_address === event.organizer?.cal_address
   );
 
+  function handleRSVP(rsvp: string) {
+    const newEvent = {
+      ...event,
+      attendee: event.attendee?.map((a) =>
+        a.cal_address === user.userData.email ? { ...a, partstat: rsvp } : a
+      ),
+    };
+
+    dispatch(putEventAsync({ cal: calendar, newEvent }));
+    onClose({}, "backdropClick");
+  }
+
   return (
     <Popover open={open} anchorEl={anchorEl} onClose={onClose}>
       <Card sx={{ width: 300, p: 2, position: "relative" }}>
@@ -195,9 +208,36 @@ function EventDisplayModal({
                 Will you attend?
               </Typography>
               <ButtonGroup size="small" fullWidth>
-                <Button>Accept</Button>
-                <Button>Maybe</Button>
-                <Button>Decline</Button>
+                <Button
+                  color={
+                    currentUserAttendee.partstat === "ACCEPTED"
+                      ? "success"
+                      : "primary"
+                  }
+                  onClick={() => handleRSVP("ACCEPTED")}
+                >
+                  Accept
+                </Button>
+                <Button
+                  color={
+                    currentUserAttendee.partstat === "TENTATIVE"
+                      ? "warning"
+                      : "primary"
+                  }
+                  onClick={() => handleRSVP("TENTATIVE")}
+                >
+                  Maybe
+                </Button>
+                <Button
+                  color={
+                    currentUserAttendee.partstat === "DECLINED"
+                      ? "error"
+                      : "primary"
+                  }
+                  onClick={() => handleRSVP("DECLINED")}
+                >
+                  Decline
+                </Button>
               </ButtonGroup>
             </Box>
           )}

src/features/Events/eventUtils.ts

@@ -98,7 +98,7 @@ export function calendarEventToJCal(event: CalendarEvent): any[] {
         "dtstart",
         { tzid },
         event.allday ? "date" : "date-time",
-        formatDateToICal(event.start, event.allday ?? false),
+        formatDateToICal(new Date(event.start), event.allday ?? false),
       ],
       ["class", {}, "text", event.class ?? "PUBLIC"],
       [
@@ -117,7 +117,7 @@ export function calendarEventToJCal(event: CalendarEvent): any[] {
       "dtend",
       { tzid },
       event.allday ? "date" : "date-time",
-      formatDateToICal(event.end, event.allday ?? false),
+      formatDateToICal(new Date(event.end), event.allday ?? false),
     ]);
   }
   if (event.organizer) {