From c5c366884a2ec6c9099e46d0e8d9a604a6f80768 Mon Sep 17 00:00:00 2001
From: Leander Furumo <leander@furumo.eu>
Date: Fri, 30 Oct 2026 21:46:06 +0100
Subject: [PATCH] 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 | 13 +++----------
 src/lib/sanity.ts                       | 24 +++++++++++++++++++++---
 2 files changed, 24 insertions(+), 13 deletions(-)

diff --git a/src/components/page-sections/events.tsx b/src/components/page-sections/events.tsx
index 8512768..ddc5ef9 100644
--- a/src/components/page-sections/events.tsx
+++ b/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"
diff --git a/src/lib/sanity.ts b/src/lib/sanity.ts
index 92e65ad..833ad9c 100644
--- a/src/lib/sanity.ts
+++ b/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: {