feat: Upgrade Next.js 15 -> 16

Author: Charismara

.eslintrc.json

@@ -120,4 +120,4 @@ async function getData(): Promise<{ users: UserData[], date: Date }> {
 
 export const revalidate = 500;
 export const dynamic = "force-dynamic";
-export const maxDuration = 60;
+export const maxDuration = 60;

app/admin/users/page.tsx

@@ -3,6 +3,6 @@ import {revalidateTag} from 'next/cache';
 
 export async function GET(request: NextRequest) {
     const tag = request.nextUrl.searchParams.get('tag');
-    if (tag) revalidateTag(tag);
+    if (tag) revalidateTag(tag, "max");
     return NextResponse.json({revalidated: !!tag, now: Date.now()});
 }

app/api/revalidate/route.ts

@@ -3,9 +3,7 @@ import {PrismaClient, Role} from "@prisma/client";
 import {getToken} from "next-auth/jwt";
 import {CloudSettingsToken} from "@/src/types/AuthTypes";
 
-export const dynamic = "force-dynamic";
-
-export async function POST(request: NextRequest, {params}: { params: Promise<{ userId: string }> }) {
+export async function POST(request: NextRequest, {params}: RouteContext<"/api/user/[userId]/role">) {
     const nextAuthToken = await getToken({req: request}) as CloudSettingsToken;
     if (!nextAuthToken) {
         return new Response("No valid session token found.", {

app/api/user/[userId]/role/route.ts

@@ -3,12 +3,7 @@ import {PrismaClient} from "@prisma/client";
 import {getToken} from "next-auth/jwt";
 import {CloudSettingsToken} from "@/src/types/AuthTypes";
 
-export const dynamic = "force-dynamic";
-type PathVariables = {
-    params: Promise<{ userId: string }>
-}
-
-export async function DELETE(request: NextRequest, {params}: PathVariables) {
+export async function DELETE(request: NextRequest, {params}: RouteContext<"/api/user/[userId]">) {
     const nextAuthToken = await getToken({req: request}) as CloudSettingsToken;
     if (!nextAuthToken) {
         return new Response("No valid session token found.", {
@@ -69,7 +64,7 @@ export async function DELETE(request: NextRequest, {params}: PathVariables) {
     return NextResponse.json({});
 };
 
-export async function GET(request: NextRequest, {params}: PathVariables) {
+export async function GET(request: NextRequest, {params}: RouteContext<"/api/user/[userId]">) {
     const nextAuthToken = await getToken({req: request}) as CloudSettingsToken;
     if (!nextAuthToken) {
         return new Response("No valid session token found.", {

app/api/user/[userId]/route.ts

@@ -1,31 +1,31 @@
+import '@ant-design/v5-patch-for-react-19';
 import './globals.css'
 import {Inter} from 'next/font/google'
 import {AppShell} from "@/app/AppShell";
 import {AppProvider} from "@/app/AppProvider";
 import {Analytics} from "@vercel/analytics/react";
-import {AntdStyledComponentRegistry} from "@/components/antd/AntdStyledComponentRegistry";
-import {Viewport} from "next";
+import {Metadata, Viewport} from "next";
 import {SpeedInsights} from "@vercel/speed-insights/next"
-import {Suspense} from "react";
+import {AntdRegistry} from "@ant-design/nextjs-registry";
 
 const inter = Inter({subsets: ['latin']});
 
-export const metadata = {
+export const metadata: Metadata = {
     title: 'CloudSettings',
     description: 'Web App for the CloudSettings Minecraft Mod',
     metadataBase: new URL('https://cloudsettings.blutmondgilde.de'),
     appLinks: {
         web: {
             url: 'https://cloudsettings.blutmondgilde.de/',
-            should_fallback: true
-        }
+            should_fallback: true,
+        },
     },
     openGraph: {
         title: 'CloudSettings',
         description: 'Web App for the CloudSettings Minecraft Mod',
         type: 'website',
-        url: 'https://cloudsettings.blutmondgilde.de/'
-    }
+        url: 'https://cloudsettings.blutmondgilde.de/',
+    },
 }
 
 export const viewport: Viewport = {
@@ -34,21 +34,17 @@ export const viewport: Viewport = {
     maximumScale: 1,
 }
 
-type Props = {
-    children: React.ReactNode
-}
-
-export default function RootLayout({children,}: Props) {
+export default function RootLayout({children}: LayoutProps<"/">) {
     return (
         <html lang="en" className={"h-full"}>
         <body className={`${inter.className} min-h-screen m-0`}>
-        <AntdStyledComponentRegistry>
+        <AntdRegistry>
             <AppProvider>
                 <AppShell>
                     {children}
                 </AppShell>
             </AppProvider>
-        </AntdStyledComponentRegistry>
+        </AntdRegistry>
         <Analytics/>
         <SpeedInsights/>
         </body>

app/layout.tsx

@@ -0,0 +1,15 @@
+import { defineConfig } from "eslint/config";
+import nextCoreWebVitals from "eslint-config-next/core-web-vitals";
+import path from "node:path";
+import { fileURLToPath } from "node:url";
+
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
+
+export default defineConfig([{
+    extends: [...nextCoreWebVitals],
+
+    rules: {
+        "@next/next/no-img-element": "off",
+    },
+}]);

bun.lock

@@ -1,33 +1,34 @@
-/** @type {import('next').NextConfig} */
-const nextConfig = {
+import {NextConfig} from "next";
+
+const nextConfig: NextConfig = {
     headers: async () => {
         const headers = [
             {
                 key: "X-DNS-Prefetch-Control",
-                value: "off"
+                value: "off",
             },
             {
                 key: "X-Frame-Options",
-                value: "DENY"
+                value: "DENY",
             },
             {
                 key: 'X-Content-Type-Options',
-                value: 'nosniff'
-            }
+                value: 'nosniff',
+            },
         ];
 
         if (process.env.NODE_ENV !== "development") {
             headers.push({
                 key: "Strict-Transport-Security",
-                value: "max-age=63072000; includeSubDomains; preload"
+                value: "max-age=63072000; includeSubDomains; preload",
             });
         }
 
         return [
             {
                 source: '/',
-                headers: headers
-            }
+                headers: headers,
+            },
         ];
     },
     images: {
@@ -36,22 +37,23 @@ const nextConfig = {
                 protocol: 'https',
                 hostname: 'mc-heads.net',
                 port: '',
-                pathname: '/avatar/**'
+                pathname: '/avatar/**',
             },
             {
                 protocol: 'https',
                 hostname: 'mc-heads.net',
                 port: '',
-                pathname: '/body/**'
+                pathname: '/body/**',
             },
             {
                 protocol: 'https',
                 hostname: "media.forgecdn.net",
                 port: '',
-                pathname: '/attachments/**'
-            }
-        ]
-    }
+                pathname: '/attachments/**',
+            },
+        ],
+    },
+    typedRoutes: true,
 }
 
 module.exports = nextConfig

eslint.config.mjs

@@ -7,44 +7,53 @@
     "dev": "next dev",
     "build": "next build",
     "start": "next start",
-    "lint": "next lint",
-    "prisma:pull": "pnpm exec prisma db pull",
-    "prisma:generate": "pnpm exec prisma generate",
-    "prisma:migrate": "pnpm exec prisma migrate dev --name init",
-    "prisma:migrate_zap": "pnpm exec prisma migrate dev --name init",
+    "lint": "eslint .",
+    "prisma:pull": "prisma db pull",
+    "prisma:generate": "prisma generate",
+    "prisma:migrate": "prisma migrate dev --name init",
+    "prisma:migrate_zap": "prisma migrate dev --name init",
     "vercel-build": "prisma migrate deploy && next build",
     "postinstall": "prisma generate"
   },
   "dependencies": {
-    "@ant-design/cssinjs": "^1.21.1",
     "@ant-design/icons": "5.5.1",
-    "@ant-design/pro-components": "^2.8.1",
-    "@antv/g2": "^5.2.7",
-    "@headlessui/react": "^2.2.0",
-    "@heroicons/react": "^2.1.5",
+    "@ant-design/nextjs-registry": "^1.1.0",
+    "@ant-design/pro-components": "^2.8.10",
+    "@ant-design/v5-patch-for-react-19": "^1.0.3",
+    "@antv/g2": "^5.4.2",
+    "@headlessui/react": "^2.2.9",
+    "@heroicons/react": "^2.2.0",
     "@prisma/client": "^5.22.0",
     "@types/lodash-es": "^4.17.12",
-    "@types/node": "^22.9.0",
-    "@types/react": "^18.3.12",
-    "@types/react-dom": "^18.3.1",
-    "@vercel/analytics": "^1.3.2",
-    "@vercel/speed-insights": "^1.1.0",
-    "antd": "^5.21.6",
-    "autoprefixer": "^10.4.20",
-    "dayjs": "^1.11.13",
-    "eslint": "^9.14.0",
-    "eslint-config-next": "^15.0.3",
+    "@types/node": "^22.18.13",
+    "@types/react": "19.2.2",
+    "@types/react-dom": "19.2.2",
+    "@vercel/analytics": "^1.5.0",
+    "@vercel/speed-insights": "^1.2.0",
+    "antd": "^5.27.6",
+    "autoprefixer": "^10.4.21",
+    "dayjs": "^1.11.18",
+    "eslint": "^9.38.0",
+    "eslint-config-next": "16.0.1",
     "lodash-es": "^4.17.21",
-    "next": "^15.0.3",
-    "next-auth": "^4.24.10",
-    "postcss": "^8.4.47",
+    "next": "16.0.1",
+    "next-auth": "^4.24.12",
+    "postcss": "^8.5.6",
     "prisma": "^5.22.0",
-    "react": "^18.3.1",
-    "react-dom": "^18.3.1",
+    "react": "19.2.0",
+    "react-dom": "19.2.0",
     "react-toastify": "^10.0.6",
-    "recharts": "^2.13.3",
-    "tailwindcss": "^3.4.14",
-    "typescript": "^5.6.3"
+    "recharts": "^2.15.4",
+    "tailwindcss": "^3.4.18",
+    "typescript": "^5.9.3"
   },
-  "packageManager": "pnpm@9.12.2"
+  "packageManager": "bun@1.3.1",
+  "overrides": {
+    "@types/react": "19.2.2",
+    "@types/react-dom": "19.2.2"
+  },
+  "devDependencies": {},
+  "trustedDependencies": [
+    "@vercel/speed-insights"
+  ]
 }