chore: upgrade app-router to next 15

Author: sommeeeer

examples/app-router/app/albums/@modal/(.)[album]/[song]/page.tsx

@@ -2,12 +2,13 @@ import { getSong } from "@example/shared/api";
 import Modal from "@example/shared/components/Modal";
 
 type Props = {
-  params: {
+  params: Promise<{
     album: string;
     song: string;
-  };
+  }>;
 };
-export default async function SongPage({ params }: Props) {
+export default async function SongPage(props: Props) {
+  const params = await props.params;
   const song = await getSong(params.album, params.song);
   return (
     <Modal>

examples/app-router/app/albums/@modal/(.)[album]/page.tsx

@@ -1,10 +1,11 @@
 import Modal from "@example/shared/components/Modal";
 
 type Props = {
-  params: {
+  params: Promise<{
     artist: string;
-  };
+  }>;
 };
-export default function ArtistPage({ params }: Props) {
+export default async function ArtistPage(props: Props) {
+  const params = await props.params;
   return <Modal>Artists {params.artist}</Modal>;
 }

examples/app-router/app/albums/[album]/[song]/page.tsx

@@ -1,12 +1,13 @@
 import { getSong } from "@example/shared/api";
 
 type Props = {
-  params: {
+  params: Promise<{
     album: string;
     song: string;
-  };
+  }>;
 };
-export default async function Song({ params }: Props) {
+export default async function Song(props: Props) {
+  const params = await props.params;
   const song = await getSong(params.album, params.song);
 
   return (

examples/app-router/app/headers/page.tsx

@@ -1,7 +1,7 @@
 import { headers } from "next/headers";
 
-export default function Headers() {
-  const middlewareHeader = headers().get("request-header");
+export default async function Headers() {
+  const middlewareHeader = (await headers()).get("request-header");
   return (
     <div>
       <h1>Headers</h1>

examples/app-router/app/search-query/page.tsx

@@ -1,11 +1,10 @@
 import { headers } from "next/headers";
 
-export default function SearchQuery({
-  searchParams: propsSearchParams,
-}: {
-  searchParams: Record<string, string | string[]>;
+export default async function SearchQuery(props: {
+  searchParams: Promise<Record<string, string | string[]>>;
 }) {
-  const mwSearchParams = headers().get("search-params");
+  const propsSearchParams = await props.searchParams;
+  const mwSearchParams = (await headers()).get("search-params");
   const multiValueParams = propsSearchParams["multi"];
   const multiValueArray = Array.isArray(multiValueParams)
     ? multiValueParams

examples/app-router/app/ssr/page.tsx

@@ -13,7 +13,7 @@ async function getTime() {
 
 export default async function SSR() {
   const time = await getTime();
-  const headerList = headers();
+  const headerList = await headers();
   return (
     <div>
       <h1>Time: {time}</h1>

examples/app-router/next.config.js renamed to examples/app-router/next.config.ts

@@ -1,13 +1,11 @@
-/** @type {import('next').NextConfig} */
-const nextConfig = {
+import type { NextConfig } from "next";
+
+const nextConfig: NextConfig = {
   poweredByHeader: false,
   cleanDistDir: true,
   transpilePackages: ["@example/shared"],
   output: "standalone",
-  outputFileTracing: "../sst",
-  experimental: {
-    serverActions: true,
-  },
+  outputFileTracingRoot: "../sst",
   eslint: {
     ignoreDuringBuilds: true,
   },
@@ -19,7 +17,7 @@ const nextConfig = {
       },
     ],
   },
-  redirects: () => {
+  redirects: async () => {
     return [
       {
         source: "/next-config-redirect-missing",
@@ -60,7 +58,7 @@ const nextConfig = {
       },
     ];
   },
-  headers() {
+  async headers() {
     return [
       {
         source: "/(.*)",
@@ -75,4 +73,4 @@ const nextConfig = {
   },
 };
 
-module.exports = nextConfig;
+export default nextConfig;

examples/app-router/package.json

@@ -13,18 +13,24 @@
   "dependencies": {
     "@example/shared": "workspace:*",
     "@open-next/utils": "workspace:*",
-    "next": "^14.1.4",
+    "next": "15.0.0",
     "@opennextjs/aws": "workspace:*",
-    "react": "latest",
-    "react-dom": "latest"
+    "react": "19.0.0-rc-65a56d0e-20241020",
+    "react-dom": "19.0.0-rc-65a56d0e-20241020"
   },
   "devDependencies": {
     "@types/node": "20.5.0",
-    "@types/react": "18.2.20",
-    "@types/react-dom": "18.2.7",
+    "@types/react": "npm:types-react@19.0.0-rc.1",
+    "@types/react-dom": "npm:types-react-dom@19.0.0-rc.1",
     "autoprefixer": "10.4.15",
     "postcss": "8.4.27",
     "tailwindcss": "3.3.3",
     "typescript": "^4.9.3"
+  },
+  "pnpm": {
+    "overrides": {
+      "@types/react": "npm:types-react@19.0.0-rc.1",
+      "@types/react-dom": "npm:types-react-dom@19.0.0-rc.1"
+    }
   }
 }