add support for featuring events

web/src/app/page.tsx

@@ -1,5 +1,5 @@
 import { graphql } from "@/gql";
-import { EventFragment } from "@/gql/graphql";
+import { EventFragment, EventPromoSettingsFragment } from "@/gql/graphql";
 import { getClient } from "@/app/client";
 import { FeaturedEvents } from "@/components/events/FeaturedEvents";
 import { Body } from "@/components/general/Body";
@@ -9,21 +9,44 @@ import { NewsList } from "@/components/news/NewsList";
 import { PersonSection } from "@/components/people/PersonSection";
 import { UpcomingEvents } from "@/components/events/UpcomingEvents";
 
+const EventPromoSettingsFragmentDefinition = graphql(`
+  fragment EventPromoSettings on EventPromoSettings {
+    ... on EventPromoSettings {
+      featuredEvents {
+        id
+      }
+    }
+  }
+`);
+
 export default async function Home() {
   const homeQuery = graphql(`
     query home {
       events: pages(contentType: "events.EventPage") {
         ...Event
       }
+      eventPromoSettings: settings {
+        ... on EventPromoSettings {
+          ...EventPromoSettings
+        }
+      }
     }
   `);
   const { data, error } = await getClient().query(homeQuery, {});
   const events = (data?.events ?? []) as EventFragment[];
+  const eventPromoSettings = (data?.eventPromoSettings[0] ??
+    []) as EventPromoSettingsFragment;
+
+  const featuredEventIds = eventPromoSettings.featuredEvents.map((x) => x.id);
+  const featuredEvents = [
+    ...events.filter((x) => featuredEventIds.includes(x.id)),
+    ...events.filter((x) => !featuredEventIds.includes(x.id)),
+  ];
 
   return (
     <main className="site-main" id="main">
       <div>
-        <FeaturedEvents events={events} />
+        <FeaturedEvents events={featuredEvents} />
         <UpcomingEvents events={events} />
         <NewsList heading="Siste nytt" limit={3} featured />
         <blockquote>«Hvor Glæden hersker, er alltid Fest»</blockquote>