Merge pull request #531 from borisno2/renovate/major-nextjs-monorepo

Update nextjs monorepo to v15 (major)

next.config.js

@@ -2,9 +2,9 @@ const KEYSTONE_URL = process.env.KEYSTONE_URL || 'http://localhost:4000'
 
 /** @type {import('next').NextConfig} */
 module.exports = {
+  serverExternalPackages: ['graphql', 'ws'],
   experimental: {
     scrollRestoration: true,
-    serverComponentsExternalPackages: ['graphql', 'ws'],
   },
   async redirects() {
     return [

package.json

@@ -6,7 +6,7 @@
     "build:keystone": "keystone build",
     "dev": "turbo dev:watch dev:keystone dev:next",
     "dev:keystone": "next start .keystone/admin --port 4000",
-    "dev:next": "next dev --port 3000",
+    "dev:next": "next dev --port 3000 --turbopack",
     "dev:next-ssl": "node server.js",
     "dev:watch": "keystone dev --no-server",
     "format": "prettier --write \"**/*.{ts,tsx,md}\"",
@@ -53,11 +53,11 @@
     "image-size": "^1.1.1",
     "inngest": "^3.23.1",
     "lucide-react": "^0.453.0",
-    "next": "^14.2.16",
+    "next": "15.0.1",
     "next-auth": "^4.24.10",
     "postcss-focus-visible": "^10.0.1",
-    "react": "^18.3.1",
-    "react-dom": "^18.3.1",
+    "react": "19.0.0-rc-69d4b800-20241021",
+    "react-dom": "19.0.0-rc-69d4b800-20241021",
     "react-hook-form": "^7.53.1",
     "react-tailwindcss-datepicker": "^1.7.2",
     "sharp": "^0.33.5",
@@ -75,13 +75,13 @@
     "@eslint/js": "^9.13.0",
     "@types/lodash": "^4.17.12",
     "@types/node": "^20.17.0",
-    "@types/react": "^18.3.12",
-    "@types/react-dom": "^18.3.1",
+    "@types/react": "npm:[email protected]",
+    "@types/react-dom": "npm:[email protected].1",
     "@types/ws": "^8.5.12",
     "@typescript-eslint/eslint-plugin": "^8.11.0",
     "cspell": "^8.15.4",
     "eslint": "9.13.0",
-    "eslint-config-next": "14.2.16",
+    "eslint-config-next": "15.0.1",
     "prettier": "^3.3.3",
     "prettier-plugin-tailwindcss": "^0.6.8",
     "prisma": "5.21.1",
@@ -96,7 +96,13 @@
       "@prisma/client": "5.21.1",
       "@prisma/internals": "5.21.1",
       "@prisma/migrate": "5.21.1",
-      "next": "^14.2.16"
+      "next": "^15.0.1",
+      "react": "19.0.0-rc-69d4b800-20241021",
+      "react-dom": "19.0.0-rc-69d4b800-20241021",
+      "@types/react": "npm:[email protected]",
+      "@types/react-dom": "npm:[email protected]",
+      "@apollo/client": "^3.11.8",
+      "react-day-picker": "^9.2.0"
     }
   }
 }

src/app/(home)/lessons/[slug]/page.tsx

@@ -49,23 +49,35 @@ const getLessonCategory = cache(async (slug: string) => {
   return lessonCategory
 })
 
-export async function generateMetadata({
-  params: { slug },
-}: {
-  params: { slug: string }
-}): Promise<Metadata> {
+export async function generateMetadata(
+  props: {
+    params: Promise<{ slug: string }>
+  }
+): Promise<Metadata> {
+  const params = await props.params;
+
+  const {
+    slug
+  } = params;
+
   const lessonCategory = await getLessonCategory(slug)
   if (lessonCategory && lessonCategory.name) {
     return getMetadata(lessonCategory.name)
   }
   return getMetadata('Lessons')
 }
 
-export default async function Page({
-  params: { slug },
-}: {
-  params: { slug: string }
-}) {
+export default async function Page(
+  props: {
+    params: Promise<{ slug: string }>
+  }
+) {
+  const params = await props.params;
+
+  const {
+    slug
+  } = params;
+
   const lessonCategory = await getLessonCategory(slug)
   if (!lessonCategory) {
     redirect('/')

src/app/(website)/timetable/page.tsx

@@ -9,11 +9,12 @@ export const metadata: Metadata = {
   ...getMetadata('Timetable'),
 }
 
-export default async function TimetablePage({
-  searchParams,
-}: {
-  searchParams: { daySelected: string }
-}) {
+export default async function TimetablePage(
+  props: {
+    searchParams: Promise<{ daySelected: string }>
+  }
+) {
+  const searchParams = await props.searchParams;
 
   const context = await getSessionContext()
   const { lessons } = await context.graphql.run({ query: GET_LESSON_TIMETABLE }).catch((error) => {

src/app/api/graphql/route.ts

@@ -26,5 +26,15 @@ const { handleRequest } = createYoga({
     Response,
   },
 })
-
-export { handleRequest as GET, handleRequest as POST, handleRequest as OPTIONS }
+export async function GET(request: Request) {
+  const ctx = { waitUntil: () => new Promise(() => {}) }
+  return handleRequest(request, ctx)
+}
+export async function POST(request: Request) {
+  const ctx = { waitUntil: () => new Promise(() => {}) }
+  return handleRequest(request, ctx)
+}
+export async function OPTIONS(request: Request) {
+  const ctx = { waitUntil: () => new Promise(() => {}) }
+  return handleRequest(request, ctx)
+}

src/app/api/xero/callback/route.ts

@@ -14,7 +14,7 @@ export async function GET(request: NextRequest) {
     return NextResponse.json({ error: 'Not authorized' }, { status: 403 })
   } else {
     try {
-      const stateCookie = cookies().get('emily_calder_xero_csrf_state')
+      const stateCookie = (await cookies()).get('emily_calder_xero_csrf_state')
       if (!stateCookie) {
         return NextResponse.json({ error: 'Invalid state' }, { status: 403 })
       }

src/app/api/xero/start/route.ts

@@ -17,7 +17,8 @@ export async function GET() {
     return NextResponse.json({ error: 'Not authorized' }, { status: 403 })
   } else {
     const state = generateAntiForgery()
-    cookies().set('emily_calder_xero_csrf_state', state)
+    const { set } = await cookies()
+    set('emily_calder_xero_csrf_state', state)
     const { xeroClient } = await getXeroClient({
       context,
       state,

src/app/auth/register/_action.ts

@@ -60,7 +60,7 @@ export async function registerAccount(data: z.infer<typeof registerSchema>) {
   const form = new URLSearchParams()
   form.append('secret', SECRET_KEY)
   form.append('response', validationResult.turnstileRes)
-  const headersList = headers()
+  const headersList = await headers()
   form.append('remoteip', headersList.get('x-forwarded-for') as string)
 
   const url = 'https://challenges.cloudflare.com/turnstile/v0/siteverify'

src/app/auth/register/page.tsx

@@ -11,11 +11,12 @@ export const metadata: Metadata = {
   ...getMetadata('Register'),
 }
 
-export default async function RegisterPage({
-  searchParams,
-}: {
-  searchParams?: { [key: string]: string | string[] | undefined }
-}) {
+export default async function RegisterPage(
+  props: {
+    searchParams?: Promise<{ [key: string]: string | string[] | undefined }>
+  }
+) {
+  const searchParams = await props.searchParams;
   const context = await getSessionContext()
   if (context.session) {
     redirect('/dashboard')

src/app/auth/signin/page.tsx

@@ -9,11 +9,12 @@ export const metadata: Metadata = {
   ...getMetadata('Sign In'),
 }
 
-export default async function SignInPage({
-  searchParams,
-}: {
-  searchParams?: { [key: string]: string | string[] | undefined }
-}) {
+export default async function SignInPage(
+  props: {
+    searchParams?: Promise<{ [key: string]: string | string[] | undefined }>
+  }
+) {
+  const searchParams = await props.searchParams;
   const callbackUrl =
     typeof searchParams?.callbackUrl === 'string'
       ? searchParams?.callbackUrl

src/app/dashboard/lessons/[id]/page.tsx

@@ -16,11 +16,12 @@ export const metadata: Metadata = {
 }
 
 export const dynamic = 'force-dynamic'
-export default async function LessonPage({
-  params,
-}: {
-  params: { id?: string }
-}) {
+export default async function LessonPage(
+  props: {
+    params: Promise<{ id?: string }>
+  }
+) {
+  const params = await props.params;
   if (!params.id || !isCuid(params.id)) {
     redirect('/dashboard/lessons')
   }

src/app/dashboard/profile/page.tsx

@@ -31,11 +31,12 @@ const GET_ACCOUNT = graphql(`
   }
 `)
 
-export default async function Profile({
-  searchParams,
-}: {
-  searchParams?: { [key: string]: string | string[] | undefined }
-}) {
+export default async function Profile(
+  props: {
+    searchParams?: Promise<{ [key: string]: string | string[] | undefined }>
+  }
+) {
+  const searchParams = await props.searchParams;
   let redirectOnSave: boolean = false
   if (searchParams?.incomplete === 'true') {
     redirectOnSave = true

src/app/dashboard/students/[id]/page.tsx

@@ -15,11 +15,12 @@ export const metadata: Metadata = {
 }
 
 export const dynamic = 'force-dynamic'
-export default async function Students({
-  params,
-}: {
-  params: { id?: string }
-}) {
+export default async function Students(
+  props: {
+    params: Promise<{ id?: string }>
+  }
+) {
+  const params = await props.params;
   if (!params.id || !isCuid(params.id)) {
     redirect('/dashboard/students')
   }

src/components/Calendar.tsx

@@ -135,7 +135,7 @@ function classNames(...classes: (string | boolean | undefined)[]) {
 
 export default function Example() {
   return (
-    <div className="lg:flex lg:h-full lg:flex-col">
+    (<div className="lg:flex lg:h-full lg:flex-col">
       <header className="flex items-center justify-between border-b border-gray-200 px-6 py-4 lg:flex-none">
         <h1 className="text-lg font-semibold text-gray-900">
           <time dateTime="2022-01">January 2022</time>
@@ -327,6 +327,6 @@ export default function Example() {
           </ol>
         </div>
       )}
-    </div>
-  )
+    </div>)
+  );
 }

src/graphql-env.d.ts

@@ -1,20 +1,7 @@
 /* eslint-disable */
 /* prettier-ignore */
 
-/** An IntrospectionQuery representation of your schema.
- *
- * @remarks
- * This is an introspection of your schema saved as a file by GraphQLSP.
- * It will automatically be used by `gql.tada` to infer the types of your GraphQL documents.
- * If you need to reuse this data or update your `scalars`, update `tadaOutputLocation` to
- * instead save to a .ts instead of a .d.ts file.
- */
-export type introspection = {
-  name: never;
-  query: 'Query';
-  mutation: 'Mutation';
-  subscription: never;
-  types: {
+export type introspection_types = {
     'Account': { kind: 'OBJECT'; name: 'Account'; fields: { 'bills': { name: 'bills'; type: { kind: 'LIST'; name: never; ofType: { kind: 'NON_NULL'; name: never; ofType: { kind: 'OBJECT'; name: 'Bill'; ofType: null; }; }; } }; 'billsCount': { name: 'billsCount'; type: { kind: 'SCALAR'; name: 'Int'; ofType: null; } }; 'createdAt': { name: 'createdAt'; type: { kind: 'SCALAR'; name: 'DateTime'; ofType: null; } }; 'firstName': { name: 'firstName'; type: { kind: 'SCALAR'; name: 'String'; ofType: null; } }; 'id': { name: 'id'; type: { kind: 'NON_NULL'; name: never; ofType: { kind: 'SCALAR'; name: 'ID'; ofType: null; }; } }; 'name': { name: 'name'; type: { kind: 'SCALAR'; name: 'String'; ofType: null; } }; 'phone': { name: 'phone'; type: { kind: 'SCALAR'; name: 'String'; ofType: null; } }; 'postcode': { name: 'postcode'; type: { kind: 'SCALAR'; name: 'Int'; ofType: null; } }; 'secondContactName': { name: 'secondContactName'; type: { kind: 'SCALAR'; name: 'String'; ofType: null; } }; 'secondContactPhone': { name: 'secondContactPhone'; type: { kind: 'SCALAR'; name: 'String'; ofType: null; } }; 'streetAddress': { name: 'streetAddress'; type: { kind: 'SCALAR'; name: 'String'; ofType: null; } }; 'students': { name: 'students'; type: { kind: 'LIST'; name: never; ofType: { kind: 'NON_NULL'; name: never; ofType: { kind: 'OBJECT'; name: 'Student'; ofType: null; }; }; } }; 'studentsCount': { name: 'studentsCount'; type: { kind: 'SCALAR'; name: 'Int'; ofType: null; } }; 'suburb': { name: 'suburb'; type: { kind: 'SCALAR'; name: 'String'; ofType: null; } }; 'surname': { name: 'surname'; type: { kind: 'SCALAR'; name: 'String'; ofType: null; } }; 'user': { name: 'user'; type: { kind: 'OBJECT'; name: 'User'; ofType: null; } }; 'xeroId': { name: 'xeroId'; type: { kind: 'SCALAR'; name: 'String'; ofType: null; } }; }; };
     'AccountCreateInput': { kind: 'INPUT_OBJECT'; name: 'AccountCreateInput'; isOneOf: false; inputFields: [{ name: 'user'; type: { kind: 'INPUT_OBJECT'; name: 'UserRelateToOneForCreateInput'; ofType: null; }; defaultValue: null }, { name: 'firstName'; type: { kind: 'SCALAR'; name: 'String'; ofType: null; }; defaultValue: null }, { name: 'surname'; type: { kind: 'SCALAR'; name: 'String'; ofType: null; }; defaultValue: null }, { name: 'phone'; type: { kind: 'SCALAR'; name: 'String'; ofType: null; }; defaultValue: null }, { name: 'secondContactName'; type: { kind: 'SCALAR'; name: 'String'; ofType: null; }; defaultValue: null }, { name: 'secondContactPhone'; type: { kind: 'SCALAR'; name: 'String'; ofType: null; }; defaultValue: null }, { name: 'students'; type: { kind: 'INPUT_OBJECT'; name: 'StudentRelateToManyForCreateInput'; ofType: null; }; defaultValue: null }, { name: 'bills'; type: { kind: 'INPUT_OBJECT'; name: 'BillRelateToManyForCreateInput'; ofType: null; }; defaultValue: null }, { name: 'streetAddress'; type: { kind: 'SCALAR'; name: 'String'; ofType: null; }; defaultValue: null }, { name: 'suburb'; type: { kind: 'SCALAR'; name: 'String'; ofType: null; }; defaultValue: null }, { name: 'postcode'; type: { kind: 'SCALAR'; name: 'Int'; ofType: null; }; defaultValue: null }, { name: 'xeroId'; type: { kind: 'SCALAR'; name: 'String'; ofType: null; }; defaultValue: null }, { name: 'createdAt'; type: { kind: 'SCALAR'; name: 'DateTime'; ofType: null; }; defaultValue: null }]; };
     'AccountOrderByInput': { kind: 'INPUT_OBJECT'; name: 'AccountOrderByInput'; isOneOf: false; inputFields: [{ name: 'id'; type: { kind: 'ENUM'; name: 'OrderDirection'; ofType: null; }; defaultValue: null }, { name: 'firstName'; type: { kind: 'ENUM'; name: 'OrderDirection'; ofType: null; }; defaultValue: null }, { name: 'surname'; type: { kind: 'ENUM'; name: 'OrderDirection'; ofType: null; }; defaultValue: null }, { name: 'phone'; type: { kind: 'ENUM'; name: 'OrderDirection'; ofType: null; }; defaultValue: null }, { name: 'secondContactName'; type: { kind: 'ENUM'; name: 'OrderDirection'; ofType: null; }; defaultValue: null }, { name: 'secondContactPhone'; type: { kind: 'ENUM'; name: 'OrderDirection'; ofType: null; }; defaultValue: null }, { name: 'streetAddress'; type: { kind: 'ENUM'; name: 'OrderDirection'; ofType: null; }; defaultValue: null }, { name: 'suburb'; type: { kind: 'ENUM'; name: 'OrderDirection'; ofType: null; }; defaultValue: null }, { name: 'postcode'; type: { kind: 'ENUM'; name: 'OrderDirection'; ofType: null; }; defaultValue: null }, { name: 'xeroId'; type: { kind: 'ENUM'; name: 'OrderDirection'; ofType: null; }; defaultValue: null }, { name: 'createdAt'; type: { kind: 'ENUM'; name: 'OrderDirection'; ofType: null; }; defaultValue: null }]; };
@@ -207,7 +194,22 @@ export type introspection = {
     'XeroSettingsUpdateInput': { kind: 'INPUT_OBJECT'; name: 'XeroSettingsUpdateInput'; isOneOf: false; inputFields: [{ name: 'tokenSet'; type: { kind: 'SCALAR'; name: 'JSON'; ofType: null; }; defaultValue: null }, { name: 'tenantId'; type: { kind: 'SCALAR'; name: 'String'; ofType: null; }; defaultValue: null }]; };
     'XeroSettingsWhereInput': { kind: 'INPUT_OBJECT'; name: 'XeroSettingsWhereInput'; isOneOf: false; inputFields: [{ name: 'AND'; type: { kind: 'LIST'; name: never; ofType: { kind: 'NON_NULL'; name: never; ofType: { kind: 'INPUT_OBJECT'; name: 'XeroSettingsWhereInput'; ofType: null; }; }; }; defaultValue: null }, { name: 'OR'; type: { kind: 'LIST'; name: never; ofType: { kind: 'NON_NULL'; name: never; ofType: { kind: 'INPUT_OBJECT'; name: 'XeroSettingsWhereInput'; ofType: null; }; }; }; defaultValue: null }, { name: 'NOT'; type: { kind: 'LIST'; name: never; ofType: { kind: 'NON_NULL'; name: never; ofType: { kind: 'INPUT_OBJECT'; name: 'XeroSettingsWhereInput'; ofType: null; }; }; }; defaultValue: null }, { name: 'id'; type: { kind: 'INPUT_OBJECT'; name: 'IDFilter'; ofType: null; }; defaultValue: null }, { name: 'tenantId'; type: { kind: 'INPUT_OBJECT'; name: 'StringFilter'; ofType: null; }; defaultValue: null }]; };
     'XeroSettingsWhereUniqueInput': { kind: 'INPUT_OBJECT'; name: 'XeroSettingsWhereUniqueInput'; isOneOf: false; inputFields: [{ name: 'id'; type: { kind: 'SCALAR'; name: 'ID'; ofType: null; }; defaultValue: null }]; };
-  };
+};
+
+/** An IntrospectionQuery representation of your schema.
+ *
+ * @remarks
+ * This is an introspection of your schema saved as a file by GraphQLSP.
+ * It will automatically be used by `gql.tada` to infer the types of your GraphQL documents.
+ * If you need to reuse this data or update your `scalars`, update `tadaOutputLocation` to
+ * instead save to a .ts instead of a .d.ts file.
+ */
+export type introspection = {
+  name: never;
+  query: 'Query';
+  mutation: 'Mutation';
+  subscription: never;
+  types: introspection_types;
 };
 
 import * as gqlTada from 'gql.tada';

src/keystone/context/nextAuthFix.ts

@@ -6,9 +6,9 @@ import type { Context } from '.keystone/types'
 
 export async function getServerActionContext() {
   const req = {
-    headers: Object.fromEntries(headers() as Headers),
+    headers: Object.fromEntries(await headers() as Headers),
     cookies: Object.fromEntries(
-      cookies()
+      (await cookies())
         .getAll()
         .map((c) => [c.name, c.value]),
     ),

src/styles/tailwind.css

@@ -1,4 +1,4 @@
+@import './prism.css';
 @import 'tailwindcss/base';
 @import 'tailwindcss/components';
-@import './prism.css';
 @import 'tailwindcss/utilities';