Destructuring with `await`

💡 Ideas
26

I was just wanting this feature. Here is another real-world example using Next.js v15 (relevant docs):

Before

export default async function Page(props) {
  const params = await props.params
  const searchParams = await props.searchParams
  // ...
}

After

export default async function Page({ await params, await searchParams }) {
  // ...
}

And for a more targeted route:

Before

// route: /posts/[id]
export default async function Page({ params }) {
  const id = (await params).id
  // ...
}

After

// route: /posts/[id]
export default async function Page({ await params: { id } }) {
  // ...
}

Also, I didn't see it mentioned elsewhere in this thread, but there was another thread asking for this feature as well: await keyword for destructuring assignment