diff --git a/docs/01-app/01-getting-started/08-error-handling.mdx b/docs/01-app/01-getting-started/08-error-handling.mdx index 74d74ce338e2f..6885a529544ed 100644 --- a/docs/01-app/01-getting-started/08-error-handling.mdx +++ b/docs/01-app/01-getting-started/08-error-handling.mdx @@ -151,8 +151,8 @@ You can call the [`notFound`](/docs/app/api-reference/functions/not-found) funct ```tsx filename="app/blog/[slug]/page.tsx" switcher import { getPostBySlug } from '@/lib/posts' -export default function Page({ params }: { params: { slug: string } }) { - const post = getPostBySlug(params.slug) +export default async function Page({ params }: { params: { slug: string } }) { + const post = getPostBySlug((await params).slug) if (!post) { notFound() @@ -165,8 +165,8 @@ export default function Page({ params }: { params: { slug: string } }) { ```jsx filename="app/blog/[slug]/page.js" switcher import { getPostBySlug } from '@/lib/posts' -export default function Page({ params }) { - const post = getPostBySlug(params.slug) +export default async function Page({ params }) { + const post = getPostBySlug((await params).slug) if (!post) { notFound() diff --git a/docs/01-app/03-building-your-application/01-routing/15-internationalization.mdx b/docs/01-app/03-building-your-application/01-routing/15-internationalization.mdx index 1de099fa8af23..f5adefe914a0b 100644 --- a/docs/01-app/03-building-your-application/01-routing/15-internationalization.mdx +++ b/docs/01-app/03-building-your-application/01-routing/15-internationalization.mdx @@ -177,15 +177,15 @@ export async function generateStaticParams() { return [{ lang: 'en-US' }, { lang: 'de' }] } -export default function RootLayout({ +export default async function RootLayout({ children, params, }: Readonly<{ children: React.ReactNode - params: { lang: 'en-US' | 'de' } + params: Promise<{ lang: 'en-US' | 'de' }> }>) { return ( - + {children} ) @@ -197,9 +197,9 @@ export async function generateStaticParams() { return [{ lang: 'en-US' }, { lang: 'de' }] } -export default function RootLayout({ children, params }) { +export default async function RootLayout({ children, params }) { return ( - + {children} ) diff --git a/docs/01-app/03-building-your-application/06-optimizing/04-metadata.mdx b/docs/01-app/03-building-your-application/06-optimizing/04-metadata.mdx index 5ac90b2ce21b9..d966c97051c2a 100644 --- a/docs/01-app/03-building-your-application/06-optimizing/04-metadata.mdx +++ b/docs/01-app/03-building-your-application/06-optimizing/04-metadata.mdx @@ -298,7 +298,7 @@ Our current recommendation for JSON-LD is to render structured data as a ` diff --git a/docs/01-app/03-building-your-application/11-upgrading/05-app-router-migration.mdx b/docs/01-app/03-building-your-application/11-upgrading/05-app-router-migration.mdx index 0fb0a6d5b4ddb..b0d3b8a800907 100644 --- a/docs/01-app/03-building-your-application/11-upgrading/05-app-router-migration.mdx +++ b/docs/01-app/03-building-your-application/11-upgrading/05-app-router-migration.mdx @@ -748,7 +748,7 @@ export async function generateStaticParams() { } async function getPost(params) { - const res = await fetch(`https://.../posts/${params.id}`) + const res = await fetch(`https://.../posts/${(await params).id}`) const post = await res.json() return post diff --git a/docs/01-app/03-building-your-application/11-upgrading/08-single-page-applications.mdx b/docs/01-app/03-building-your-application/11-upgrading/08-single-page-applications.mdx index 512176ed59cf5..d6f60461e1cb1 100644 --- a/docs/01-app/03-building-your-application/11-upgrading/08-single-page-applications.mdx +++ b/docs/01-app/03-building-your-application/11-upgrading/08-single-page-applications.mdx @@ -310,9 +310,9 @@ export default function SortProducts() { const searchParams = useSearchParams() function updateSorting(sortOrder: string) { - const params = new URLSearchParams(searchParams.toString()) - params.set('sort', sortOrder) - window.history.pushState(null, '', `?${params.toString()}`) + const urlSearchParams = new URLSearchParams(searchParams.toString()) + urlSearchParams.set('sort', sortOrder) + window.history.pushState(null, '', `?${urlSearchParams.toString()}`) } return ( @@ -333,9 +333,9 @@ export default function SortProducts() { const searchParams = useSearchParams() function updateSorting(sortOrder) { - const params = new URLSearchParams(searchParams.toString()) - params.set('sort', sortOrder) - window.history.pushState(null, '', `?${params.toString()}`) + const urlSearchParams = new URLSearchParams(searchParams.toString()) + urlSearchParams.set('sort', sortOrder) + window.history.pushState(null, '', `?${urlSearchParams.toString()}`) } return ( diff --git a/docs/01-app/04-api-reference/04-functions/not-found.mdx b/docs/01-app/04-api-reference/04-functions/not-found.mdx index c6827f3f96066..65e0c9824a9e8 100644 --- a/docs/01-app/04-api-reference/04-functions/not-found.mdx +++ b/docs/01-app/04-api-reference/04-functions/not-found.mdx @@ -19,7 +19,7 @@ async function fetchUser(id) { } export default async function Profile({ params }) { - const user = await fetchUser(params.id) + const user = await fetchUser((await params).id) if (!user) { notFound() diff --git a/docs/01-app/04-api-reference/04-functions/permanentRedirect.mdx b/docs/01-app/04-api-reference/04-functions/permanentRedirect.mdx index b1f1166525490..970f9a5d006a1 100644 --- a/docs/01-app/04-api-reference/04-functions/permanentRedirect.mdx +++ b/docs/01-app/04-api-reference/04-functions/permanentRedirect.mdx @@ -49,7 +49,7 @@ async function fetchTeam(id) { } export default async function Profile({ params }) { - const team = await fetchTeam(params.id) + const team = await fetchTeam((await params).id) if (!team) { permanentRedirect('/login') } diff --git a/docs/01-app/04-api-reference/04-functions/unstable_cache.mdx b/docs/01-app/04-api-reference/04-functions/unstable_cache.mdx index bd46dba5add0f..0f4e84e3bd839 100644 --- a/docs/01-app/04-api-reference/04-functions/unstable_cache.mdx +++ b/docs/01-app/04-api-reference/04-functions/unstable_cache.mdx @@ -50,12 +50,17 @@ const data = unstable_cache(fetchData, keyParts, options)() ```tsx filename="app/page.tsx" switcher import { unstable_cache } from 'next/cache' -export default async function Page({ params }: { params: { userId: string } }) { +export default async function Page({ + params, +}: { + params: Promise<{ userId: string }> +}) { + const userId = (await params).userId const getCachedUser = unstable_cache( async () => { - return { id: params.userId } + return { id: userId } }, - [params.userId], // add the user ID to the cache key + [userId], // add the user ID to the cache key { tags: ['users'], revalidate: 60, @@ -70,11 +75,12 @@ export default async function Page({ params }: { params: { userId: string } }) { import { unstable_cache } from 'next/cache'; export default async function Page({ params } }) { + const userId = (await params).userId const getCachedUser = unstable_cache( async () => { - return { id: params.userId }; + return { id: userId }; }, - [params.userId], // add the user ID to the cache key + [userId], // add the user ID to the cache key { tags: ["users"], revalidate: 60,