Fetch only upcoming events from Sanity

Filter and limit in GROQ instead of fetching every event and filtering
in JavaScript. Event dates are stored as Oslo local time strings, so
compare them against the current Oslo time in the same format.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

src/components/page-sections/events.tsx

@@ -1,4 +1,4 @@
-import { getAllEvents } from "@/lib/sanity"
+import { getUpcomingEvents } from "@/lib/sanity"
 
 import { getLocale, getTranslations } from "next-intl/server"
 import Image from "next/image"
@@ -25,14 +25,7 @@ const Events = async () => {
   const tCommon = await getTranslations("common")
   const locale = await getLocale()
 
-  const data: Event[] = await getAllEvents()
-
-  const currentDate = new Date()
-  const filteredEvents = data
-    .filter((event: Event) => {
-      return currentDate <= new Date(event.date)
-    })
-    .slice(0, 2)
+  const events: Event[] = await getUpcomingEvents(2)
 
   const formatDate = (dateString: string) => {
     const date = new Date(dateString)
@@ -105,7 +98,7 @@ const Events = async () => {
     <section id="events">
       <div className={styles.container}>
         <h2 className={styles.sectionHeader}>{t("title")}</h2>
-        <div className={styles.events}>{mapEvents(filteredEvents)}</div>
+        <div className={styles.events}>{mapEvents(events)}</div>
         <div className={"no-mobile " + styles.image}>
           <Image
             src="/event.jpg"

src/lib/sanity.ts

@@ -71,9 +71,27 @@ export async function getEvent(slug: string) {
   )
 }
 
-export async function getAllEvents() {
+export async function getUpcomingEvents(limit: number) {
+  // Event dates are stored as Oslo local time strings ("2026-11-05 17:00"),
+  // which sort correctly as text, so compare against the current time in the
+  // same format
+  const parts = Object.fromEntries(
+    new Intl.DateTimeFormat("en-GB", {
+      timeZone: "Europe/Oslo",
+      year: "numeric",
+      month: "2-digit",
+      day: "2-digit",
+      hour: "2-digit",
+      minute: "2-digit",
+      hourCycle: "h23",
+    })
+      .formatToParts(new Date())
+      .map(({ type, value }) => [type, value])
+  )
+  const now = `${parts.year}-${parts.month}-${parts.day} ${parts.hour}:${parts.minute}`
+
   const query = `
-    *[_type == "event"] | order(date asc) {
+    *[_type == "event" && date >= $now] | order(date asc)[0...$limit] {
       _id,
       title,
       location,
@@ -85,7 +103,7 @@ export async function getAllEvents() {
 
   return sanityClient.fetch(
     query,
-    {},
+    { now, limit },
     {
       cache: "force-cache",
       next: {