feat!: update next@15.0.0-canary.173, react@19.0.0-rc-3edc000d-202409…

…26 (#8489) Updates the minimal supported versions of next.js to [`15.0.0-canary.173`](https://github.com/vercel/next.js/releases/tag/v15.0.0-canary.173) and react to `19.0.0-rc-3edc000d-20240926`. Adds neccessary awaits according to this breaking change vercel/next.js#68812 ## Breaking Changes The `params` and `searchParams` types in `app/(payload)/admin/[[...segments]]/page.tsx` and `app/(payload)/admin/[[...segments]]/not-found.tsx` must be changed to promises: ```diff - type Args = { - params: { - segments: string[] - } - searchParams: { - [key: string]: string | string[] - } - } + type Args = { + params: Promise<{ + segments: string[] + }> + searchParams: Promise<{ + [key: string]: string | string[] + }> + } ```
payloadcms · Oct 1, 2024 · fa59d4c · fa59d4c
1 parent d80410b
commit fa59d4c
Show file tree

Hide file tree

Showing 27 changed files with 499 additions and 344 deletions.
diff --git a/app/(payload)/admin/[[...segments]]/not-found.tsx b/app/(payload)/admin/[[...segments]]/not-found.tsx
@@ -3,17 +3,17 @@ import type { Metadata } from 'next'
 
 import config from '@payload-config'
 /* DO NOT MODIFY IT BECAUSE IT COULD BE REWRITTEN AT ANY TIME. */
-import { NotFoundPage, generatePageMetadata } from '@payloadcms/next/views'
+import { generatePageMetadata, NotFoundPage } from '@payloadcms/next/views'
 
 import { importMap } from '../importMap.js'
 
 type Args = {
-  params: {
+  params: Promise<{
     segments: string[]
-  }
-  searchParams: {
+  }>
+  searchParams: Promise<{
     [key: string]: string | string[]
-  }
+  }>
 }
 
 export const generateMetadata = ({ params, searchParams }: Args): Promise<Metadata> =>

diff --git a/app/(payload)/admin/[[...segments]]/page.tsx b/app/(payload)/admin/[[...segments]]/page.tsx
@@ -3,17 +3,17 @@ import type { Metadata } from 'next'
 
 import config from '@payload-config'
 /* DO NOT MODIFY IT BECAUSE IT COULD BE REWRITTEN AT ANY TIME. */
-import { RootPage, generatePageMetadata } from '@payloadcms/next/views'
+import { generatePageMetadata, RootPage } from '@payloadcms/next/views'
 
 import { importMap } from '../importMap.js'
 
 type Args = {
-  params: {
+  params: Promise<{
     segments: string[]
-  }
-  searchParams: {
+  }>
+  searchParams: Promise<{
     [key: string]: string | string[]
-  }
+  }>
 }
 
 export const generateMetadata = ({ params, searchParams }: Args): Promise<Metadata> =>

diff --git a/package.json b/package.json
@@ -105,7 +105,7 @@
   "devDependencies": {
     "@jest/globals": "29.7.0",
     "@libsql/client": "0.6.2",
-    "@next/bundle-analyzer": "15.0.0-canary.160",
+    "@next/bundle-analyzer": "15.0.0-canary.173",
     "@payloadcms/db-postgres": "workspace:*",
     "@payloadcms/eslint-config": "workspace:*",
     "@payloadcms/eslint-plugin": "workspace:*",
@@ -143,15 +143,15 @@
     "lint-staged": "15.2.7",
     "minimist": "1.2.8",
     "mongodb-memory-server": "^9.0",
-    "next": "15.0.0-canary.160",
+    "next": "15.0.0-canary.173",
     "open": "^10.1.0",
     "p-limit": "^5.0.0",
     "playwright": "1.46.0",
     "playwright-core": "1.46.0",
     "prettier": "3.3.3",
     "prompts": "2.4.2",
-    "react": "19.0.0-rc-5dcb0097-20240918",
-    "react-dom": "19.0.0-rc-5dcb0097-20240918",
+    "react": "19.0.0-rc-3edc000d-20240926",
+    "react-dom": "19.0.0-rc-3edc000d-20240926",
     "rimraf": "3.0.2",
     "semver": "^7.5.4",
     "sharp": "0.32.6",
@@ -165,8 +165,8 @@
     "typescript": "5.6.2"
   },
   "peerDependencies": {
-    "react": "^19.0.0 || ^19.0.0-rc-5dcb0097-20240918",
-    "react-dom": "^19.0.0 || ^19.0.0-rc-5dcb0097-20240918"
+    "react": "^19.0.0 || ^19.0.0-rc-3edc000d-20240926",
+    "react-dom": "^19.0.0 || ^19.0.0-rc-3edc000d-20240926"
   },
   "packageManager": "pnpm@9.7.1",
   "engines": {

diff --git a/packages/live-preview-react/package.json b/packages/live-preview-react/package.json
@@ -43,8 +43,8 @@
     "payload": "workspace:*"
   },
   "peerDependencies": {
-    "react": "^19.0.0 || ^19.0.0-rc-5dcb0097-20240918",
-    "react-dom": "^19.0.0 || ^19.0.0-rc-5dcb0097-20240918"
+    "react": "^19.0.0 || ^19.0.0-rc-3edc000d-20240926",
+    "react-dom": "^19.0.0 || ^19.0.0-rc-3edc000d-20240926"
   },
   "publishConfig": {
     "exports": {

diff --git a/packages/next/package.json b/packages/next/package.json
@@ -96,7 +96,7 @@
     "@babel/preset-env": "^7.24.5",
     "@babel/preset-react": "^7.24.1",
     "@babel/preset-typescript": "^7.24.1",
-    "@next/eslint-plugin-next": "15.0.0-canary.160",
+    "@next/eslint-plugin-next": "15.0.0-canary.173",
     "@payloadcms/eslint-config": "workspace:*",
     "@types/busboy": "1.5.4",
     "@types/react": "npm:types-react@19.0.0-rc.1",
@@ -112,7 +112,7 @@
   },
   "peerDependencies": {
     "graphql": "^16.8.1",
-    "next": "^15.0.0-canary.160",
+    "next": "^15.0.0-canary.173",
     "payload": "workspace:*"
   },
   "engines": {

diff --git a/packages/next/src/layouts/Root/index.tsx b/packages/next/src/layouts/Root/index.tsx
@@ -66,25 +66,25 @@ export const RootLayout = async ({
       dependencyVersions: {
         next: {
           required: false,
-          version: '>=15.0.0-canary.160',
+          version: '>=15.0.0-canary.173',
         },
         react: {
           customVersionParser: customReactVersionParser,
           required: false,
-          version: '>=19.0.0-rc-5dcb0097-20240918',
+          version: '>=19.0.0-rc-3edc000d-20240926',
         },
         'react-dom': {
           customVersionParser: customReactVersionParser,
           required: false,
-          version: '>=19.0.0-rc-5dcb0097-20240918',
+          version: '>=19.0.0-rc-3edc000d-20240926',
         },
       },
     })
   }
 
   const config = await configPromise
 
-  const headers = getHeaders()
+  const headers = await getHeaders()
   const cookies = parseCookies(headers)
 
   const languageCode = getRequestLanguage({
@@ -131,10 +131,10 @@ export const RootLayout = async ({
     [],
   )
 
-  // eslint-disable-next-line @typescript-eslint/require-await
   async function switchLanguageServerAction(lang: string): Promise<void> {
     'use server'
-    nextCookies().set({
+    const cookies = await nextCookies()
+    cookies.set({
       name: `${config.cookiePrefix || 'payload'}-lng`,
       path: '/',
       value: lang,

diff --git a/packages/next/src/routes/rest/index.ts b/packages/next/src/routes/rest/index.ts
@@ -229,7 +229,8 @@ export const OPTIONS =
 
 export const GET =
   (config: Promise<SanitizedConfig> | SanitizedConfig) =>
-  async (request: Request, { params: { slug } }: { params: { slug: string[] } }) => {
+  async (request: Request, { params: paramsPromise }: { params: Promise<{ slug: string[] }> }) => {
+    const { slug } = await paramsPromise
     const [slug1, slug2, slug3, slug4] = slug
     let req: PayloadRequest
     let res: Response
@@ -429,15 +430,16 @@ export const GET =
 
 export const POST =
   (config: Promise<SanitizedConfig> | SanitizedConfig) =>
-  async (request: Request, { params: { slug } }: { params: { slug: string[] } }) => {
+  async (request: Request, { params: paramsPromise }: { params: Promise<{ slug: string[] }> }) => {
+    const { slug } = await paramsPromise
     const [slug1, slug2, slug3, slug4] = slug
     let req: PayloadRequest
     let res: Response
     let collection: Collection
 
     const overrideHttpMethod = request.headers.get('X-HTTP-Method-Override')
     if (overrideHttpMethod === 'GET') {
-      return await GET(config)(request, { params: { slug } })
+      return await GET(config)(request, { params: paramsPromise })
     }
 
     try {
@@ -619,7 +621,8 @@ export const POST =
 
 export const DELETE =
   (config: Promise<SanitizedConfig> | SanitizedConfig) =>
-  async (request: Request, { params: { slug } }: { params: { slug: string[] } }) => {
+  async (request: Request, { params: paramsPromise }: { params: Promise<{ slug: string[] }> }) => {
+    const { slug } = await paramsPromise
     const [slug1, slug2] = slug
     let req: PayloadRequest
     let res: Response
@@ -719,7 +722,8 @@ export const DELETE =
 
 export const PATCH =
   (config: Promise<SanitizedConfig> | SanitizedConfig) =>
-  async (request: Request, { params: { slug } }: { params: { slug: string[] } }) => {
+  async (request: Request, { params: paramsPromise }: { params: Promise<{ slug: string[] }> }) => {
+    const { slug } = await paramsPromise
     const [slug1, slug2] = slug
     let req: PayloadRequest
     let res: Response

diff --git a/packages/next/src/utilities/getNextRequestI18n.ts b/packages/next/src/utilities/getNextRequestI18n.ts
@@ -29,6 +29,6 @@ export const getNextRequestI18n = async <
   return (await initI18n({
     config: config.i18n,
     context: 'client',
-    language: getRequestLanguage({ config, cookies: cookies(), headers: headers() }),
+    language: getRequestLanguage({ config, cookies: await cookies(), headers: await headers() }),
   })) as any
 }
diff --git a/packages/next/src/utilities/initPage/index.ts b/packages/next/src/utilities/initPage/index.ts
@@ -19,7 +19,7 @@ export const initPage = async ({
   route,
   searchParams,
 }: Args): Promise<InitPageResult> => {
-  const headers = getHeaders()
+  const headers = await getHeaders()
   const payload = await getPayloadHMR({ config: configPromise, importMap })
   const queryString = `${qs.stringify(searchParams ?? {}, { addQueryPrefix: true })}`
 

diff --git a/packages/next/src/utilities/initReq.ts b/packages/next/src/utilities/initReq.ts
@@ -19,7 +19,7 @@ type Result = {
 export const initReq = cache(async function (config: SanitizedConfig): Promise<Result> {
   const payload = await getPayloadHMR({ config })
 
-  const headers = getHeaders()
+  const headers = await getHeaders()
   const cookies = parseCookies(headers)
 
   const languageCode = getRequestLanguage({

diff --git a/packages/next/src/views/NotFound/index.tsx b/packages/next/src/views/NotFound/index.tsx
@@ -41,21 +41,22 @@ export type GenerateViewMetadata = (args: {
 export const NotFoundPage = async ({
   config: configPromise,
   importMap,
-  params,
-  searchParams,
+  params: paramsPromise,
+  searchParams: searchParamsPromise,
 }: {
   config: Promise<SanitizedConfig>
   importMap: ImportMap
-  params: {
+  params: Promise<{
     segments: string[]
-  }
-  searchParams: {
+  }>
+  searchParams: Promise<{
     [key: string]: string | string[]
-  }
+  }>
 }) => {
   const config = await configPromise
   const { routes: { admin: adminRoute } = {} } = config
 
+  const searchParams = await searchParamsPromise
   const initPageResult = await initPage({
     config,
     importMap,
@@ -64,6 +65,8 @@ export const NotFoundPage = async ({
     searchParams,
   })
 
+  const params = await paramsPromise
+
   return (
     <DefaultTemplate
       i18n={initPageResult.req.i18n}

diff --git a/packages/next/src/views/Root/index.tsx b/packages/next/src/views/Root/index.tsx
@@ -23,17 +23,17 @@ export type GenerateViewMetadata = (args: {
 export const RootPage = async ({
   config: configPromise,
   importMap,
-  params,
-  searchParams,
+  params: paramsPromise,
+  searchParams: searchParamsPromise,
 }: {
   readonly config: Promise<SanitizedConfig>
   readonly importMap: ImportMap
-  readonly params: {
+  readonly params: Promise<{
     segments: string[]
-  }
-  readonly searchParams: {
+  }>
+  readonly searchParams: Promise<{
     [key: string]: string | string[]
-  }
+  }>
 }) => {
   const config = await configPromise
 
@@ -45,13 +45,16 @@ export const RootPage = async ({
     routes: { admin: adminRoute },
   } = config
 
+  const params = await paramsPromise
   const currentRoute = formatAdminURL({
     adminRoute,
     path: `${Array.isArray(params.segments) ? `/${params.segments.join('/')}` : ''}`,
   })
 
   const segments = Array.isArray(params.segments) ? params.segments : []
 
+  const searchParams = await searchParamsPromise
+
   const { DefaultView, initPageOptions, templateClassName, templateType } = getViewFromConfig({
     adminRoute,
     config,

diff --git a/packages/next/src/views/Root/meta.ts b/packages/next/src/views/Root/meta.ts
@@ -27,17 +27,21 @@ const oneSegmentMeta = {
 
 type Args = {
   config: Promise<SanitizedConfig>
-  params: {
+  params: Promise<{
     [key: string]: string | string[]
-  }
-  searchParams: {
+  }>
+  searchParams: Promise<{
     [key: string]: string | string[]
-  }
+  }>
 }
 
-export const generatePageMetadata = async ({ config: configPromise, params }: Args) => {
+export const generatePageMetadata = async ({
+  config: configPromise,
+  params: paramsPromise,
+}: Args) => {
   const config = await configPromise
 
+  const params = await paramsPromise
   const segments = Array.isArray(params.segments) ? params.segments : []
 
   const currentRoute = `/${segments.join('/')}`

diff --git a/packages/payload/package.json b/packages/payload/package.json
@@ -85,7 +85,7 @@
   },
   "dependencies": {
     "@monaco-editor/react": "4.6.0",
-    "@next/env": "^15.0.0-canary.160",
+    "@next/env": "^15.0.0-canary.173",
     "@payloadcms/translations": "workspace:*",
     "@types/busboy": "1.5.4",
     "ajv": "8.17.1",

diff --git a/packages/plugin-form-builder/package.json b/packages/plugin-form-builder/package.json
@@ -69,8 +69,8 @@
   },
   "peerDependencies": {
     "payload": "workspace:*",
-    "react": "^19.0.0 || ^19.0.0-rc-5dcb0097-20240918",
-    "react-dom": "^19.0.0 || ^19.0.0-rc-5dcb0097-20240918"
+    "react": "^19.0.0 || ^19.0.0-rc-3edc000d-20240926",
+    "react-dom": "^19.0.0 || ^19.0.0-rc-3edc000d-20240926"
   },
   "publishConfig": {
     "exports": {

diff --git a/packages/plugin-search/package.json b/packages/plugin-search/package.json
@@ -62,8 +62,8 @@
   },
   "peerDependencies": {
     "payload": "workspace:*",
-    "react": "^19.0.0 || ^19.0.0-rc-5dcb0097-20240918",
-    "react-dom": "^19.0.0 || ^19.0.0-rc-5dcb0097-20240918"
+    "react": "^19.0.0 || ^19.0.0-rc-3edc000d-20240926",
+    "react-dom": "^19.0.0 || ^19.0.0-rc-3edc000d-20240926"
   },
   "publishConfig": {
     "exports": {

diff --git a/packages/plugin-sentry/package.json b/packages/plugin-sentry/package.json
@@ -60,8 +60,8 @@
   },
   "peerDependencies": {
     "payload": "workspace:*",
-    "react": "^19.0.0 || ^19.0.0-rc-5dcb0097-20240918",
-    "react-dom": "^19.0.0 || ^19.0.0-rc-5dcb0097-20240918"
+    "react": "^19.0.0 || ^19.0.0-rc-3edc000d-20240926",
+    "react-dom": "^19.0.0 || ^19.0.0-rc-3edc000d-20240926"
   },
   "publishConfig": {
     "exports": {

diff --git a/packages/plugin-seo/package.json b/packages/plugin-seo/package.json
@@ -69,8 +69,8 @@
   },
   "peerDependencies": {
     "payload": "workspace:*",
-    "react": "^19.0.0 || ^19.0.0-rc-5dcb0097-20240918",
-    "react-dom": "^19.0.0 || ^19.0.0-rc-5dcb0097-20240918"
+    "react": "^19.0.0 || ^19.0.0-rc-3edc000d-20240926",
+    "react-dom": "^19.0.0 || ^19.0.0-rc-3edc000d-20240926"
   },
   "publishConfig": {
     "exports": {