web: centralize prop fetching for live + preview, fix preview banner breakage

web/src/app/arrangementer/page.tsx

@@ -1,60 +1,24 @@
 import { Metadata, ResolvingMetadata } from "next";
 import { getClient } from "@/app/client";
-import { EventIndexView } from "@/components/events/EventIndexView";
 import {
-  eventsOverviewQuery,
-  eventIndexMetadataQuery,
-  EventFragment,
-  EventCategory,
-  EventOrganizer,
-} from "@/lib/event";
-import { EventIndexFragment, VenueFragment } from "@/gql/graphql";
+  EventIndexView,
+  loadEventIndexProps,
+} from "@/components/events/EventIndexView";
+import { EventIndexFragment } from "@/gql/graphql";
+import { eventIndexMetadataQuery } from "@/lib/event";
 import { getSeoMetadata } from "@/lib/seo";
 
 export async function generateMetadata(
-  { params }: { params: Promise<{}> },
+  _: unknown,
   parent: ResolvingMetadata
 ): Promise<Metadata | null> {
   const { data, error } = await getClient().query(eventIndexMetadataQuery, {});
-
-  if (error) {
-    throw new Error(error.message);
-  }
-  if (!data?.index) {
-    return null;
-  }
-
-  const index = data.index as EventIndexFragment;
-  const metadata = await getSeoMetadata(index, parent);
-  return metadata;
+  if (error) throw new Error(error.message);
+  if (!data?.index) return null;
+  return getSeoMetadata(data.index as EventIndexFragment, parent);
 }
 
 export default async function Page() {
-  const { data, error } = await getClient().query(eventsOverviewQuery, {});
-  if (error) {
-    throw new Error(error.message);
-  }
-  if (
-    !data?.index ||
-    !data?.events?.futureEvents ||
-    !data?.eventCategories ||
-    !data?.eventOrganizers ||
-    !data?.venues
-  ) {
-    throw new Error("Failed to render /arrangementer");
-  }
-
-  const events = (data?.events?.futureEvents ?? []) as EventFragment[];
-  const eventCategories = (data?.eventCategories ?? []) as EventCategory[];
-  const eventOrganizers = (data?.eventOrganizers ?? []) as EventOrganizer[];
-  const venues = (data?.venues ?? []) as VenueFragment[];
-
-  return (
-    <EventIndexView
-      events={events}
-      eventCategories={eventCategories}
-      eventOrganizers={eventOrganizers}
-      venues={venues}
-    />
-  );
+  const props = await loadEventIndexProps();
+  return <EventIndexView {...props} />;
 }