add wip event occurrences

web/src/app/arrangementer/page.tsx

@@ -1,5 +1,5 @@
 import { graphql } from "@/gql";
-import { EventFragment } from "@/gql/graphql";
+import { EventFragment, EventOccurrence } from "@/gql/graphql";
 import { getClient } from "@/app/client";
 import { EventList } from "@/components/events/EventList";
 
@@ -28,9 +28,31 @@ const EventFragmentDefinition = graphql(`
     priceRegular
     priceMember
     priceStudent
+    occurrences {
+      ... on EventOccurrence {
+        __typename
+        id
+        start
+        end
+        venue {
+          __typename
+          id
+          slug
+          title
+        }
+      }
+    }
   }
 `);
 
+export type SingularEvent = EventFragment & {
+  occurrence: EventOccurrence;
+};
+
+function isDefined<T>(val: T | undefined | null): val is T {
+  return val !== undefined && val !== null;
+}
+
 export default async function Page() {
   const allEventsQuery = graphql(`
     query allEvents {
@@ -42,14 +64,27 @@ export default async function Page() {
     }
   `);
   const { data, error } = await getClient().query(allEventsQuery, {});
-  const events = (data?.events ?? []) as EventFragment[]
+  const events = (data?.events ?? []) as EventFragment[];
+
+  const flattenedEvents = events
+    .map((event) => {
+      return event.occurrences
+        ?.filter((x): x is EventOccurrence => isDefined(x))
+        .map((occurrence) => {
+          const eventOccurrence = structuredClone(event)
+          eventOccurrence.occurrence = occurrence
+          return eventOccurrence
+        });
+    })
+    .flat()
+    .filter((x): x is SingularEvent => isDefined(x));
 
   return (
     <main className="site-main" id="main">
       <section className="page-header">
         <h1>Arrangementer</h1>
       </section>
-      <EventList events={events} />
+      <EventList events={flattenedEvents} />
     </main>
   );
 }