Upgrade next 15 (#2422)

.npmrc

@@ -1,7 +1,3 @@
-strict-peer-dependencies=false
-
-auto-install-peers=true
-
 prefer-workspace-packages=true
 
 package-manager-strict=false

apps/cms/package.json

@@ -24,17 +24,18 @@
   ],
   "dependencies": {
     "@echo-webkom/lib": "workspace:*",
-    "@sanity/client": "6.22.5",
-    "@sanity/icons": "3.4.0",
-    "@sanity/ui": "2.8.22",
-    "@sanity/vision": "3.61.0",
+    "@sanity/client": "6.27.2",
+    "@sanity/icons": "3.5.7",
+    "@sanity/ui": "2.11.6",
+    "@sanity/vision": "3.71.2",
     "nanoid": "5.0.9",
     "react": "18.3.1",
     "react-dom": "18.3.1",
     "react-is": "18.3.1",
-    "sanity": "3.61.0",
+    "sanity": "3.71.2",
     "sanity-plugin-markdown": "4.1.2",
     "sanity-plugin-media": "2.3.2",
+    "sanity-plugin-singleton-tools": "^1.1.0",
     "slugify": "1.6.6",
     "styled-components": "6.1.13"
   },

apps/cms/sanity.config.ts

@@ -1,42 +1,32 @@
 import { colorInput } from "@sanity/color-input";
 import { RobotIcon, RocketIcon, TerminalIcon } from "@sanity/icons";
 import { visionTool } from "@sanity/vision";
-import { type Template } from "sanity";
+import { type Config } from "sanity";
 import { markdownSchema } from "sanity-plugin-markdown";
 import { media } from "sanity-plugin-media";
+import { singletonTools } from "sanity-plugin-singleton-tools";
 import { structureTool } from "sanity/structure";
 
 import { schemaTypes } from "./schemas";
 import { deskStructure } from "./src/desk-structure";
 
 // TODO: Type configs using `Config` and or `defineConfig()`
 
-// Configs for singleton
-const singletonActions = new Set(["publish", "discardChanges", "restore"]);
-const singletonTypes = new Set(["banner"]);
-
 const defaultConfig = {
   plugins: [
     structureTool({
-      structure: (S) => deskStructure(S),
+      structure: deskStructure,
     }),
     visionTool(),
     media(),
     markdownSchema(),
     colorInput(),
+    singletonTools(),
   ],
   schema: {
     types: schemaTypes,
-    templates: (templates: Array<Template>) =>
-      templates.filter(({ schemaType }) => !singletonTypes.has(schemaType)),
   },
   projectId: "pgq2pd26",
-  document: {
-    actions: (input: Array<{ action: string | null }>, context: { schemaType: string }) =>
-      singletonTypes.has(context.schemaType)
-        ? input.filter(({ action }) => action && singletonActions.has(action))
-        : input,
-  },
 };
 
 const prodConfig = {
@@ -80,4 +70,4 @@ const getConfig = () => {
   return [prodConfig];
 };
 
-export default getConfig();
+export default getConfig() as Array<Config>;

apps/cms/schemas/banner.tsx

@@ -7,6 +7,10 @@ export default defineType({
   description: "Banner som vises øverst på forsiden",
   icon: InfoOutlineIcon,
   type: "document",
+  options: {
+    // @ts-expect-error custom option
+    singleton: true,
+  },
   preview: {
     select: {
       title: "text",

apps/cms/schemas/movies.tsx

@@ -1,9 +1,11 @@
+import { PresentationIcon } from "@sanity/icons";
 import { defineField, defineType } from "sanity";
 
 export default defineType({
   name: "movie",
   title: "Film",
   type: "document",
+  icon: PresentationIcon,
   fields: [
     defineField({
       name: "title",

apps/cms/schemas/objects/question.tsx

@@ -16,6 +16,7 @@ export default defineType({
       title: "ID",
       type: "string",
       components: {
+        // @ts-expect-error sanity
         input: IdInput,
       },
       initialValue: () => nanoid(),

apps/cms/src/desk-structure.ts

@@ -1,18 +1,14 @@
-import { type StructureBuilder } from "sanity/structure";
+import {
+  filteredDocumentListItems,
+  singletonDocumentListItems,
+} from "sanity-plugin-singleton-tools";
+import { type StructureBuilder, type StructureResolverContext } from "sanity/structure";
 
-const hiddenDocuments = ["media.tag"];
-
-export const deskStructure = (S: StructureBuilder) =>
+export const deskStructure = (S: StructureBuilder, context: StructureResolverContext) =>
   S.list()
     .title("Generelt")
     .items([
+      ...singletonDocumentListItems({ S, context }),
       S.divider(),
-      ...S.documentTypeListItems().filter(
-        (listItem) =>
-          !hiddenDocuments.includes(listItem.getId() ?? "") && listItem.getId() !== "banner",
-      ),
-      S.listItem()
-        .title("Banner")
-        .id("banner")
-        .child(S.document().schemaType("banner").documentId("banner")),
+      ...filteredDocumentListItems({ S, context }).filter((item) => item.getId() !== "media.tag"),
     ]);

apps/web/next.config.mjs → apps/web/next.config.ts

@@ -1,4 +1,5 @@
-/** @type {import("next").NextConfig} */
+import type { NextConfig } from "next";
+
 const config = {
   transpilePackages: [
     "@echo-webkom/db",
@@ -88,6 +89,6 @@ const config = {
 
   eslint: { ignoreDuringBuilds: !!process.env.CI },
   typescript: { ignoreBuildErrors: !!process.env.CI },
-};
+} satisfies NextConfig;
 
 export default config;

apps/web/package.json

@@ -4,7 +4,7 @@
   "private": true,
   "scripts": {
     "build": "pnpm run with-env next build",
-    "dev": "pnpm run with-env next dev",
+    "dev": "pnpm run with-env next dev --turbopack",
     "lint": "next lint",
     "start": "pnpm run with-env next start",
     "clean": "rm -rf .next .turbo node_modules",
@@ -20,22 +20,22 @@
     "@echo-webkom/sanity": "workspace:*",
     "@hookform/resolvers": "3.9.1",
     "@json2csv/plainjs": "7.0.6",
-    "@radix-ui/react-alert-dialog": "1.1.2",
-    "@radix-ui/react-avatar": "1.1.1",
-    "@radix-ui/react-checkbox": "1.1.2",
-    "@radix-ui/react-dialog": "1.1.2",
-    "@radix-ui/react-dropdown-menu": "2.1.2",
-    "@radix-ui/react-hover-card": "1.1.2",
-    "@radix-ui/react-label": "2.1.0",
-    "@radix-ui/react-popover": "1.1.2",
-    "@radix-ui/react-separator": "1.1.0",
-    "@radix-ui/react-slot": "1.1.0",
-    "@radix-ui/react-switch": "1.1.1",
-    "@radix-ui/react-tabs": "1.1.1",
-    "@radix-ui/react-toast": "1.2.2",
+    "@radix-ui/react-alert-dialog": "1.1.5",
+    "@radix-ui/react-avatar": "1.1.2",
+    "@radix-ui/react-checkbox": "1.1.3",
+    "@radix-ui/react-dialog": "1.1.5",
+    "@radix-ui/react-dropdown-menu": "2.1.5",
+    "@radix-ui/react-hover-card": "1.1.5",
+    "@radix-ui/react-label": "2.1.1",
+    "@radix-ui/react-popover": "1.1.5",
+    "@radix-ui/react-separator": "1.1.1",
+    "@radix-ui/react-slot": "1.1.1",
+    "@radix-ui/react-switch": "1.1.2",
+    "@radix-ui/react-tabs": "1.1.2",
+    "@radix-ui/react-toast": "1.2.5",
     "@sanity/client": "6.22.5",
-    "@sanity/image-url": "1.0.2",
-    "@tanstack/react-query": "5.59.16",
+    "@sanity/image-url": "1.1.0",
+    "@tanstack/react-query": "5.65.1",
     "@types/remove-markdown": "0.3.4",
     "@vercel/analytics": "1.3.2",
     "@vercel/speed-insights": "1.0.14",
@@ -47,26 +47,26 @@
     "groq": "3.61.0",
     "ics": "3.8.1",
     "ky": "1.7.2",
-    "lucide-react": "^0.473.0",
+    "lucide-react": "0.473.0",
     "motion": "11.15.0",
     "nanoid": "5.0.9",
-    "next": "14.2.15",
+    "next": "15.1.6",
     "next-auth": "4.24.7",
     "next-themes": "0.3.0",
     "nextjs-toploader": "3.7.15",
-    "react": "18.3.1",
-    "react-confetti": "6.1.0",
-    "react-dom": "18.3.1",
-    "react-fast-marquee": "^1.6.5",
-    "react-hook-form": "7.53.0",
-    "react-icons": "5.3.0",
-    "react-markdown": "9.0.1",
+    "react": "19.0.0",
+    "react-confetti": "6.2.2",
+    "react-dom": "19.0.0",
+    "react-fast-marquee": "1.6.5",
+    "react-hook-form": "7.54.2",
+    "react-icons": "5.4.0",
+    "react-markdown": "9.0.3",
     "react-use-websocket": "4.9.0",
-    "recharts": "^2.15.0",
+    "recharts": "2.15.0",
     "remark-gfm": "4.0.0",
-    "remove-markdown": "0.5.5",
+    "remove-markdown": "0.6.0",
     "sharp": "0.33.0",
-    "tailwind-merge": "2.5.4",
+    "tailwind-merge": "2.6.0",
     "zod": "3.23.8"
   },
   "devDependencies": {
@@ -75,8 +75,8 @@
     "@tailwindcss/typography": "0.5.15",
     "@testing-library/react": "16.0.1",
     "@types/node": "20.17.10",
-    "@types/react": "18.3.12",
-    "@types/react-dom": "18.3.1",
+    "@types/react": "19.0.3",
+    "@types/react-dom": "19.0.2",
     "@vitejs/plugin-react": "4.3.3",
     "autoprefixer": "10.4.20",
     "dotenv-cli": "7.4.4",

apps/web/src/app/(default)/[...path]/page.tsx

@@ -10,9 +10,9 @@ import { pageTypeToUrl } from "@/sanity/utils/mappers";
 export const dynamicParams = false;
 
 type Props = {
-  params: {
+  params: Promise<{
     path: Array<string>;
-  };
+  }>;
 };
 
 export const generateStaticParams = async () => {
@@ -22,7 +22,7 @@ export const generateStaticParams = async () => {
   }));
 };
 
-const getData = cache(async (path: Props["params"]["path"]) => {
+const getData = cache(async (path: Array<string>) => {
   const page = await fetchStaticInfoBySlug(path[0]!, path[1]!);
 
   if (!page) {
@@ -32,14 +32,16 @@ const getData = cache(async (path: Props["params"]["path"]) => {
   return page;
 });
 
-export const generateMetadata = async ({ params }: Props) => {
-  const page = await getData(params.path);
+export const generateMetadata = async (props: Props) => {
+  const { path } = await props.params;
+  const page = await getData(path);
   return {
     title: page.title,
   };
 };
 
-export default async function StaticPage({ params }: Props) {
+export default async function StaticPage(props: Props) {
+  const params = await props.params;
   const page = await getData(params.path);
 
   return (

apps/web/src/app/(default)/arrangement/[slug]/page.tsx

@@ -6,9 +6,9 @@ import { fetchHappeningBySlug } from "@/sanity/happening";
 import { fetchRepeatingHappening } from "@/sanity/repeating-happening";
 
 type Props = {
-  params: {
+  params: Promise<{
     slug: string;
-  };
+  }>;
 };
 
 const getData = cache(async (slug: string) => {
@@ -32,15 +32,17 @@ const getData = cache(async (slug: string) => {
   return notFound();
 });
 
-export const generateMetadata = async ({ params }: Props) => {
+export const generateMetadata = async (props: Props) => {
+  const params = await props.params;
   const event = await getData(params.slug);
 
   return {
     title: event.title,
   };
 };
 
-export default async function EventPage_({ params }: Props) {
+export default async function EventPage_(props: Props) {
+  const params = await props.params;
   const event = await getData(params.slug);
 
   return <EventPage event={event} />;

apps/web/src/app/(default)/auth/logg-inn/page.tsx

@@ -6,12 +6,13 @@ import { signInAttempt } from "@/data/kv/namespaces";
 import { SignInButtons } from "./_components/sign-in-buttons";
 
 type Props = {
-  searchParams: {
+  searchParams: Promise<{
     attemptId?: string;
-  };
+  }>;
 };
 
-export default async function SignInPage({ searchParams }: Props) {
+export default async function SignInPage(props: Props) {
+  const searchParams = await props.searchParams;
   const { attemptId } = searchParams;
 
   const isValidAttemptId = attemptId && (await signInAttempt.get(attemptId));

apps/web/src/app/(default)/auth/tilgang/[id]/page.tsx

@@ -6,12 +6,16 @@ import { signInAttempt } from "@/data/kv/namespaces";
 import { RequestAccessForm } from "./_components/request-access-form";
 
 type Props = {
-  params: {
+  params: Promise<{
     id: string;
-  };
+  }>;
 };
 
-export default async function Access({ params: { id } }: Props) {
+export default async function Access(props: Props) {
+  const params = await props.params;
+
+  const { id } = params;
+
   const attempt = await signInAttempt.get(id);
 
   if (!attempt) {

apps/web/src/app/(default)/bedpres/[slug]/page.tsx

@@ -6,9 +6,9 @@ import { fetchHappeningBySlug } from "@/sanity/happening";
 import { norwegianDateString } from "@/utils/date";
 
 type Props = {
-  params: {
+  params: Promise<{
     slug: string;
-  };
+  }>;
 };
 
 const getData = cache(async (slug: string) => {
@@ -27,7 +27,8 @@ const getData = cache(async (slug: string) => {
   return event;
 });
 
-export const generateMetadata = async ({ params }: Props) => {
+export const generateMetadata = async (props: Props) => {
+  const params = await props.params;
   const event = await getData(params.slug);
 
   const regDate = event.registrationStart
@@ -41,7 +42,8 @@ export const generateMetadata = async ({ params }: Props) => {
   };
 };
 
-export default async function BedpresPage({ params }: Props) {
+export default async function BedpresPage(props: Props) {
+  const params = await props.params;
   const event = await getData(params.slug);
 
   return <EventPage event={event} />;