[#30] changed logic to load datas to get all events from calendars

src/features/Calendars/CalendarApi.ts

@@ -19,7 +19,6 @@ export async function getCalendar(
   opaque_token: string,
   match: { start: string; end: string }
 ) {
-  console.log(match)
   const response = await fetch(
     `${(window as any).CALENDAR_BASE_URL}/dav/calendars/${id}.json`,
     {

src/features/Calendars/CalendarSlice.ts

@@ -24,7 +24,7 @@ export const getCalendarsListAsync = createAsyncThunk<
       : cal._links.self.href.replace("/calendars/", "").replace(".json", "");
 
     const color = cal["apple:color"];
-    importedCalendars[id] = { id, name, description, color, events: [] };
+    importedCalendars[id] = { id, name, description, color, events: {} };
   }
 
   return importedCalendars;
@@ -36,10 +36,12 @@ export const getCalendarDetailAsync = createAsyncThunk<
 >("calendars/getCalendarDetails", async ({ access_token, calId, match }) => {
   const calendar = await getCalendar(calId, access_token, match);
   const color = calendar["apple:color"];
-  const events: CalendarEvent[] = calendar._embedded["dav:item"].map(
+  const events: CalendarEvent[] = calendar._embedded["dav:item"].flatMap(
     (eventdata: any) => {
-      const datas = eventdata.data[2][0][1];
-      return parseCalendarEvent(datas, color, calId);
+      const vevents = eventdata.data[2] as any[][]; // array of ['vevent', RawEntry[], []]
+      return vevents.map((vevent: any[]) => {
+        return parseCalendarEvent(vevent[1], color, calId);
+      });
     }
   );
 
@@ -56,28 +58,25 @@ const CalendarSlice = createSlice({
       state.list[id].name = action.payload.name;
       state.list[id].color = action.payload.color;
       state.list[id].description = action.payload.description;
-      state.list[id].events = [];
+      state.list[id].events = {};
     },
     addEvent: (
       state,
       action: PayloadAction<{ calendarUid: string; event: CalendarEvent }>
     ) => {
       if (!state.list[action.payload.calendarUid].events) {
-        state.list[action.payload.calendarUid].events = [];
+        state.list[action.payload.calendarUid].events = {};
       }
-      state.list[action.payload.calendarUid].events.push(action.payload.event);
+      state.list[action.payload.calendarUid].events[action.payload.event.uid] =
+        action.payload.event;
     },
     removeEvent: (
       state,
       action: PayloadAction<{ calendarUid: string; eventUid: string }>
     ) => {
-      state.list[action.payload.calendarUid as string].events = state.list[
-        action.payload.calendarUid
-      ].events.filter((event) => {
-        if (event.uid !== action.payload.calendarUid) {
-          return event;
-        }
-      });
+      delete state.list[action.payload.calendarUid].events[
+        action.payload.eventUid
+      ];
     },
   },
   extraReducers: (builder) => {
@@ -101,14 +100,15 @@ const CalendarSlice = createSlice({
           if (!state.list[action.payload.calId]) {
             state.list[action.payload.calId] = {
               id: action.payload.calId,
-              events: [] as CalendarEvent[],
+              events: {},
             } as Calendars;
           }
           action.payload.events.forEach((event) => {
-            state.list[action.payload.calId].events.push(event);
+            state.list[action.payload.calId].events[event.uid] = event;
           });
-          state.list[action.payload.calId].events.forEach((event) => {
-            event.color = state.list[action.payload.calId].color;
+          Object.keys(state.list[action.payload.calId].events).forEach((id) => {
+            state.list[action.payload.calId].events[id].color =
+              state.list[action.payload.calId].color;
           });
         }
       )

src/features/Calendars/CalendarTypes.ts

@@ -8,5 +8,5 @@ export interface Calendars {
   description?: string;
   calscale?: string;
   version?: string;
-  events: CalendarEvent[];
+  events: Record<string, CalendarEvent>;
 }

src/features/Events/EventsTypes.ts

@@ -17,4 +17,5 @@ export interface CalendarEvent {
   color?: string;
   allday?: Boolean;
   error?: string;
+  status?: string;
 }

src/features/Events/ImportAlert.tsx

@@ -18,18 +18,24 @@ export default function ImportAlert() {
   return (
     <>
       {Object.keys(calendars).map((calendarId) =>
-        calendars[calendarId].events
-          .filter((event) => event.error)
-          .map((event) => {
-            const isVisible = visibleAlerts[event.uid] ?? true; // default to visible
+        Object.keys(calendars[calendarId].events)
+          .filter((id) => calendars[calendarId].events[id].error)
+          .map((id) => {
+            const isVisible =
+              visibleAlerts[calendars[calendarId].events[id].uid] ?? true; // default to visible
 
             return (
-              <Collapse in={isVisible} key={event.uid}>
+              <Collapse
+                in={isVisible}
+                key={calendars[calendarId].events[id].uid}
+              >
                 <Alert
                   severity="error"
-                  onClose={() => toggleEventAlert(event.uid)}
+                  onClose={() =>
+                    toggleEventAlert(calendars[calendarId].events[id].uid)
+                  }
                 >
-                  {event.error}
+                  {calendars[calendarId].events[id].error}
                 </Alert>
               </Collapse>
             );

src/features/Events/eventUtils.ts

@@ -9,6 +9,7 @@ export function parseCalendarEvent(
   calendarid: string
 ): CalendarEvent {
   const event: Partial<CalendarEvent> = { color, attendee: [] };
+  let recurrenceId;
 
   for (const [key, params, type, value] of data) {
     switch (key.toLowerCase()) {
@@ -61,8 +62,16 @@ export function parseCalendarEvent(
       case "sequence":
         event.sequence = Number(value);
         break;
+      case "recurrence-id":
+        recurrenceId = value;
+        break;
+      case "status":
+        event.status = String(value);
     }
   }
+  if (recurrenceId && event.uid) {
+    event.uid = `${event.uid}/${recurrenceId}`;
+  }
 
   if (!event.uid || !event.start) {
     console.error(