Skip to content
New issue

Have a question about this project? # for a free GitHub account to open an issue and contact its maintainers and the community.

#

By clicking “#”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? # to your account

Convert remaining sync (search)params access #75389

Merged
merged 1 commit into from
Jan 28, 2025
Merged

Convert remaining sync (search)params access #75389

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 4 additions & 4 deletions docs/01-app/01-getting-started/08-error-handling.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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()
Expand All @@ -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()
Expand Down
10 changes: 5 additions & 5 deletions docs/01-app/03-building-your-application/01-routing/15-internationalization.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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 (
<html lang={params.lang}>
<html lang={(await params).lang}>
<body>{children}</body>
</html>
)
Expand All @@ -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 (
<html lang={params.lang}>
<html lang={(await params).lang}>
<body>{children}</body>
</html>
)
Expand Down
4 changes: 2 additions & 2 deletions docs/01-app/03-building-your-application/06-optimizing/04-metadata.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -298,7 +298,7 @@ Our current recommendation for JSON-LD is to render structured data as a `<scrip

```tsx filename="app/products/[id]/page.tsx" switcher
export default async function Page({ params }) {
const product = await getProduct(params.id)
const product = await getProduct((await params).id)

const jsonLd = {
'@context': 'https://schema.org',
Expand All @@ -323,7 +323,7 @@ export default async function Page({ params }) {

```jsx filename="app/products/[id]/page.js" switcher
export default async function Page({ params }) {
const product = await getProduct(params.id)
const product = await getProduct((await params).id)

const jsonLd = {
'@context': 'https://schema.org',
Expand Down
2 changes: 1 addition & 1 deletion docs/01-app/03-building-your-application/07-configuring/05-mdx.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -287,7 +287,7 @@ export const dynamicParams = false

```jsx filename="app/blog/[slug]/page.js" switcher
export default async function Page({ params }) {
const slug = params.slug
const slug = (await params).slug
const { default: Post } = await import(`@/content/${slug}.mdx`)

return <Post />
Expand Down
2 changes: 1 addition & 1 deletion docs/01-app/03-building-your-application/11-upgrading/05-app-router-migration.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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
Expand Down
12 changes: 6 additions & 6 deletions ...1-app/03-building-your-application/11-upgrading/08-single-page-applications.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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 (
Expand All @@ -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 (
Expand Down
2 changes: 1 addition & 1 deletion docs/01-app/04-api-reference/04-functions/not-found.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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()
Expand Down
2 changes: 1 addition & 1 deletion docs/01-app/04-api-reference/04-functions/permanentRedirect.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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('/#')
}
Expand Down
16 changes: 11 additions & 5 deletions docs/01-app/04-api-reference/04-functions/unstable_cache.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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,
Expand All @@ -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,
Expand Down
Loading