add lead and body to /lokaler

web/src/app/lokaler/page.tsx

@@ -1,9 +1,21 @@
 import { graphql } from "@/gql";
-import { VenueFragment } from "@/gql/graphql";
+import { VenueFragment, VenueIndexFragment } from "@/gql/graphql";
 import { getClient } from "@/app/client";
 import { VenueList } from "@/components/venues/VenueList";
-import Link from "next/link";
 import { PageHeader } from "@/components/general/PageHeader";
+import { Blocks } from "@/components/blocks/Blocks";
+
+const VenueIndexDefinition = graphql(`
+  fragment VenueIndex on VenueIndex {
+    ... on VenueIndex {
+      title
+      lead
+      body {
+        ...Blocks
+      }
+    }
+  }
+`);
 
 const VenueFragmentDefinition = graphql(`
   fragment Venue on VenuePage {
@@ -31,8 +43,13 @@ const VenueFragmentDefinition = graphql(`
 `);
 
 export default async function Page() {
-  const allVenuesQuery = graphql(`
-    query allVenues {
+  const venueIndexQuery = graphql(`
+    query venueIndex {
+      index: venueIndex {
+        ... on VenueIndex {
+          ...VenueIndex
+        }
+      }
       venues: pages(contentType: "venues.VenuePage") {
         ... on VenuePage {
           ...Venue
@@ -40,16 +57,14 @@ export default async function Page() {
       }
     }
   `);
-  const { data, error } = await getClient().query(allVenuesQuery, {});
+  const { data, error } = await getClient().query(venueIndexQuery, {});
+  const index = (data?.index ?? []) as VenueIndexFragment;
   const venues = (data?.venues ?? []) as VenueFragment[];
 
   return (
     <main className="site-main" id="main">
-      <PageHeader heading="Lokaler" />
-      <p className="lead">
-        Her kan vi presentere lokalene på Chateau Neuf, og eventuelt henvise
-        videre til undersiden om <Link href="/utleie">utleie</Link>.
-      </p>
+      <PageHeader heading={index.title} lead={index.lead} />
+      <Blocks blocks={index.body} />
       <VenueList venues={venues} />
     </main>
   );