web: move page rendering logic from page.tsx to components

web/src/app/arrangementer/page.tsx

@@ -1,7 +1,6 @@
-import { Suspense } from "react";
 import { Metadata, ResolvingMetadata } from "next";
 import { getClient } from "@/app/client";
-import { EventContainer } from "@/components/events/EventContainer";
+import { EventIndexView } from "@/components/events/EventIndexView";
 import {
   eventsOverviewQuery,
   eventIndexMetadataQuery,
@@ -9,7 +8,6 @@ import {
   EventCategory,
   EventOrganizer,
 } from "@/lib/event";
-import { PageHeader } from "@/components/general/PageHeader";
 import { EventIndexFragment, VenueFragment } from "@/gql/graphql";
 import { getSeoMetadata } from "@/lib/seo";
 
@@ -46,23 +44,17 @@ export default async function Page() {
     throw new Error("Failed to render /arrangementer");
   }
 
-  const index = data?.index as EventIndexFragment;
   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 (
-    <main className="site-main" id="main">
-      <PageHeader heading="Dette skjer på Chateau Neuf" align="left" />
-      <Suspense>
-        <EventContainer
-          events={events}
-          eventCategories={eventCategories}
-          eventOrganizers={eventOrganizers}
-          venues={venues}
-        />
-      </Suspense>
-    </main>
+    <EventIndexView
+      events={events}
+      eventCategories={eventCategories}
+      eventOrganizers={eventOrganizers}
+      venues={venues}
+    />
   );
 }