⬆️ Upgrade to Next.js 15.2

apps/web/next-env.d.ts

@@ -2,4 +2,4 @@
 /// <reference types="next/image-types/global" />
 
 // NOTE: This file should not be edited
-// see https://nextjs.org/docs/app/building-your-application/configuring/typescript for more information.
+// see https://nextjs.org/docs/app/api-reference/config/typescript for more information.

apps/web/next.config.js

@@ -25,14 +25,6 @@ const nextConfig = {
     "@rallly/posthog",
     "@rallly/emails",
   ],
-  webpack(config) {
-    config.module.rules.push({
-      test: /\.svg$/,
-      use: ["@svgr/webpack"],
-    });
-
-    return config;
-  },
   eslint: {
     ignoreDuringBuilds: true,
   },
@@ -58,9 +50,19 @@ const nextConfig = {
       },
     ];
   },
+  serverExternalPackages: ["@aws-sdk", "@sentry/nextjs"],
   experimental: {
-    // necessary for server actions using aws-sdk
-    serverComponentsExternalPackages: ["@aws-sdk"],
+    turbo: {
+      rules: {
+        "*.svg": {
+          loaders: ["@svgr/webpack"],
+          as: "*.js",
+        },
+      },
+    },
+  },
+  devIndicators: {
+    position: "bottom-right",
   },
 };
 

apps/web/package.json

@@ -3,7 +3,7 @@
   "version": "0.0.0",
   "private": true,
   "scripts": {
-    "dev": "next dev",
+    "dev": "next dev --turbopack",
     "build": "next build",
     "build:test": "NODE_ENV=test next build",
     "analyze": "cross-env ANALYZE=true next build",
@@ -22,7 +22,7 @@
     "@aws-sdk/client-s3": "^3.645.0",
     "@aws-sdk/s3-request-presigner": "^3.645.0",
     "@hookform/resolvers": "^3.3.1",
-    "@next/bundle-analyzer": "^12.3.4",
+    "@next/bundle-analyzer": "15.2.0",
     "@panva/hkdf": "^1.2.1",
     "@radix-ui/react-slot": "^1.0.1",
     "@radix-ui/react-switch": "^1.0.2",
@@ -34,7 +34,7 @@
     "@rallly/posthog": "*",
     "@rallly/tailwind-config": "*",
     "@rallly/ui": "*",
-    "@sentry/nextjs": "*",
+    "@sentry/nextjs": "^9.3.0",
     "@svgr/webpack": "^6.5.1",
     "@t3-oss/env-nextjs": "^0.11.0",
     "@tanstack/react-query": "^4.0.0",
@@ -81,7 +81,10 @@
     "smoothscroll-polyfill": "^0.4.4",
     "spacetime": "^7.4.7",
     "superjson": "^2.0.0",
-    "timezone-soft": "^1.5.1"
+    "timezone-soft": "^1.5.1",
+    "next": "^15.2.0",
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0"
   },
   "devDependencies": {
     "@playwright/test": "^1.49.1",

apps/web/src/app/[locale]/(admin)/events/page.tsx

@@ -8,7 +8,8 @@ import {
 } from "@/app/components/page-layout";
 import { getTranslation } from "@/i18n/server";
 
-export default async function Page({ params }: { params: Params }) {
+export default async function Page(props: { params: Promise<Params> }) {
+  const params = await props.params;
   const { t } = await getTranslation(params.locale);
   return (
     <PageContainer>
@@ -28,11 +29,12 @@ export default async function Page({ params }: { params: Params }) {
   );
 }
 
-export async function generateMetadata({
-  params,
-}: {
-  params: { locale: string };
-}) {
+export async function generateMetadata(
+  props: {
+    params: Promise<{ locale: string }>;
+  }
+) {
+  const params = await props.params;
   const { t } = await getTranslation(params.locale);
   return {
     title: t("events", {

apps/web/src/app/[locale]/(admin)/menu/page.tsx

@@ -10,7 +10,8 @@ import {
 } from "@/app/components/page-layout";
 import { getTranslation } from "@/i18n/server";
 
-export default async function Page({ params }: { params: Params }) {
+export default async function Page(props: { params: Promise<Params> }) {
+  const params = await props.params;
   const { t } = await getTranslation(params.locale);
   return (
     <PageContainer>

apps/web/src/app/[locale]/(admin)/page.tsx

@@ -14,7 +14,8 @@ import {
 import { getTranslation } from "@/i18n/server";
 import { createSSRHelper } from "@/trpc/server/create-ssr-helper";
 
-export default async function Page({ params }: { params: Params }) {
+export default async function Page(props: { params: Promise<Params> }) {
+  const params = await props.params;
   const { t } = await getTranslation(params.locale);
   const helpers = await createSSRHelper();
   await helpers.dashboard.info.prefetch();
@@ -41,11 +42,12 @@ export default async function Page({ params }: { params: Params }) {
   );
 }
 
-export async function generateMetadata({
-  params,
-}: {
-  params: { locale: string };
-}) {
+export async function generateMetadata(
+  props: {
+    params: Promise<{ locale: string }>;
+  }
+) {
+  const params = await props.params;
   const { t } = await getTranslation(params.locale);
   return {
     title: t("home", {

apps/web/src/app/[locale]/(admin)/polls/page.tsx

@@ -11,12 +11,13 @@ import {
 } from "@/app/components/page-layout";
 import { getTranslation } from "@/i18n/server";
 
-export default async function Page({
-  params,
-}: {
-  params: Params;
-  children?: React.ReactNode;
-}) {
+export default async function Page(
+  props: {
+    params: Promise<Params>;
+    children?: React.ReactNode;
+  }
+) {
+  const params = await props.params;
   const { t } = await getTranslation(params.locale);
   return (
     <PageContainer>
@@ -39,11 +40,12 @@ export default async function Page({
   );
 }
 
-export async function generateMetadata({
-  params,
-}: {
-  params: { locale: string };
-}) {
+export async function generateMetadata(
+  props: {
+    params: Promise<{ locale: string }>;
+  }
+) {
+  const params = await props.params;
   const { t } = await getTranslation(params.locale);
   return {
     title: t("polls", {

apps/web/src/app/[locale]/(admin)/settings/layout.tsx

@@ -10,12 +10,17 @@ import { getTranslation } from "@/i18n/server";
 
 import { SettingsMenu } from "./settings-menu";
 
-export default async function ProfileLayout({
-  children,
-  params,
-}: React.PropsWithChildren<{
-  params: { locale: string };
-}>) {
+export default async function ProfileLayout(
+  props: React.PropsWithChildren<{
+    params: { locale: string };
+  }>
+) {
+  const params = await props.params;
+
+  const {
+    children
+  } = props;
+
   const { t } = await getTranslation(params.locale);
   return (
     <PageContainer>

apps/web/src/app/[locale]/(admin)/settings/preferences/page.tsx

@@ -7,7 +7,8 @@ export default async function Page() {
   return <PreferencesPage />;
 }
 
-export async function generateMetadata({ params }: { params: Params }) {
+export async function generateMetadata(props: { params: Promise<Params> }) {
+  const params = await props.params;
   const { t } = await getTranslation(params.locale);
   return {
     title: t("preferences"),

apps/web/src/app/[locale]/(admin)/settings/profile/page.tsx

@@ -7,7 +7,8 @@ export default async function Page() {
   return <ProfilePage />;
 }
 
-export async function generateMetadata({ params }: { params: Params }) {
+export async function generateMetadata(props: { params: Promise<Params> }) {
+  const params = await props.params;
   const { t } = await getTranslation(params.locale);
   return {
     title: t("profile"),

apps/web/src/app/[locale]/(auth)/auth/login/page.tsx

@@ -18,7 +18,8 @@ const magicLinkParams = z.object({
   token: z.string(),
 });
 
-export default function Page({ searchParams }: { searchParams: SearchParams }) {
+export default async function Page(props: { searchParams: Promise<SearchParams> }) {
+  const searchParams = await props.searchParams;
   const parse = searchParamsSchema.safeParse(searchParams);
 
   if (!parse.success) {
@@ -42,11 +43,12 @@ export default function Page({ searchParams }: { searchParams: SearchParams }) {
   return <LoginPage magicLink={magicLink} email={email} />;
 }
 
-export async function generateMetadata({
-  params,
-}: {
-  params: { locale: string };
-}) {
+export async function generateMetadata(
+  props: {
+    params: Promise<{ locale: string }>;
+  }
+) {
+  const params = await props.params;
   const { t } = await getTranslation(params.locale);
   return {
     title: t("login"),

apps/web/src/app/[locale]/(auth)/login/actions.ts

@@ -14,7 +14,7 @@ export async function setVerificationEmail(email: string) {
   });
 
   if (user) {
-    cookies().set("verification-email", user.email, {
+    (await cookies()).set("verification-email", user.email, {
       httpOnly: true,
       secure: process.env.NODE_ENV === "production",
       sameSite: "lax",

apps/web/src/app/[locale]/(auth)/login/page.tsx

@@ -20,13 +20,14 @@ import { LoginWithOIDC } from "./components/login-with-oidc";
 import { OrDivider } from "./components/or-divider";
 import { SSOProvider } from "./components/sso-provider";
 
-export default async function LoginPage({
-  searchParams,
-}: {
-  searchParams?: {
-    redirectTo?: string;
-  };
-}) {
+export default async function LoginPage(
+  props: {
+    searchParams?: Promise<{
+      redirectTo?: string;
+    }>;
+  }
+) {
+  const searchParams = await props.searchParams;
   const { t } = await getTranslation();
 
   const oidcProvider = OIDCProvider();
@@ -87,11 +88,12 @@ export default async function LoginPage({
   );
 }
 
-export async function generateMetadata({
-  params,
-}: {
-  params: { locale: string };
-}) {
+export async function generateMetadata(
+  props: {
+    params: Promise<{ locale: string }>;
+  }
+) {
+  const params = await props.params;
   const { t } = await getTranslation(params.locale);
   return {
     title: t("login"),

apps/web/src/app/[locale]/(auth)/login/verify/page.tsx

@@ -17,7 +17,7 @@ import { OTPForm } from "./components/otp-form";
 
 export default async function VerifyPage() {
   const { t } = await getTranslation();
-  const email = cookies().get("verification-email")?.value;
+  const email = (await cookies()).get("verification-email")?.value;
   if (!email) {
     return redirect("/login");
   }
@@ -53,11 +53,12 @@ export default async function VerifyPage() {
   );
 }
 
-export async function generateMetadata({
-  params,
-}: {
-  params: { locale: string };
-}) {
+export async function generateMetadata(
+  props: {
+    params: Promise<{ locale: string }>;
+  }
+) {
+  const params = await props.params;
   const { t } = await getTranslation(params.locale);
   return {
     title: t("verifyEmail", {

apps/web/src/app/[locale]/(auth)/register/actions.ts

@@ -3,7 +3,7 @@
 import { cookies } from "next/headers";
 
 export async function setToken(token: string) {
-  cookies().set("registration-token", token, {
+  (await cookies()).set("registration-token", token, {
     httpOnly: true,
     secure: process.env.NODE_ENV === "production",
     sameSite: "lax",

apps/web/src/app/[locale]/(auth)/register/page.tsx

@@ -13,11 +13,12 @@ import {
 } from "../components/auth-page";
 import { RegisterNameForm } from "./components/register-name-form";
 
-export default async function Register({
-  params,
-}: {
-  params: { locale: string };
-}) {
+export default async function Register(
+  props: {
+    params: Promise<{ locale: string }>;
+  }
+) {
+  const params = await props.params;
   const { t } = await getTranslation(params.locale);
 
   return (
@@ -58,11 +59,12 @@ export default async function Register({
   );
 }
 
-export async function generateMetadata({
-  params,
-}: {
-  params: { locale: string };
-}) {
+export async function generateMetadata(
+  props: {
+    params: Promise<{ locale: string }>;
+  }
+) {
+  const params = await props.params;
   const { t } = await getTranslation(params.locale);
   return {
     title: t("register"),