Skip to content

Commit 28b2c7f

Browse files
committed
wording
1 parent 5f259ce commit 28b2c7f

File tree

1 file changed

+18
-7
lines changed

1 file changed

+18
-7
lines changed

docs/src/pages/blog/nextjs-root-params.mdx

+18-7
Original file line numberDiff line numberDiff line change
@@ -194,7 +194,7 @@ This needs to be removed now as otherwise this will qualify as a root layout ins
194194

195195
### Avoid reading the `[locale]` segment
196196

197-
Since `next-intl` provides the current locale via [`useLocale` and `getLocale`](/docs/usage/configuration#locale), you can seamlessly read the locale from these APIs instead of `params`:
197+
Since `next-intl` provides the current locale via [`useLocale` and `getLocale`](/docs/usage/configuration#locale), you can seamlessly read the locale from these APIs instead of `params` now:
198198

199199
```diff filename="src/app/[locale]/layout.tsx"
200200
+ import {getLocale} from 'next-intl/server';
@@ -223,7 +223,7 @@ Behind the scenes, if you call `useLocale` or `getLocale` in a Server Component,
223223

224224
### Remove manual locale overrides [#locale-override]
225225

226-
If you're using async APIs like `getTranslations`, you might have previously passed the locale manually, e.g. to enable static rendering in the Metadata API.
226+
If you're using async APIs like `getTranslations`, you might have previously passed the locale manually, typically to enable static rendering in the Metadata API.
227227

228228
Now, you can remove this and rely on the locale that is returned from `i18n/request.ts`:
229229

@@ -243,7 +243,17 @@ export async function generateMetadata(
243243
}
244244
```
245245

246-
The only case where you might still want to pass a locale to `getTranslations` is if your UI renders multiple locales in parallel. If this is the case in your app, you should make sure to accept an override in your `i18n/request.ts` config:
246+
The only rare case where you might still want to pass a locale to `getTranslations` is if your UI renders messages from multiple locales in parallel:
247+
248+
```tsx
249+
// Use messages from the current locale
250+
const t = getTranslations();
251+
252+
// Use messages from 'en', regardless of what the current user locale is
253+
const t = getTranslations({locale: 'en'});
254+
```
255+
256+
In this case, you should make sure to accept an override in your `i18n/request.ts` config:
247257

248258
```tsx filename="src/i18n/request.ts"
249259
import {unstable_rootParams as rootParams} from 'next/server';
@@ -281,9 +291,10 @@ If you've previously used `setRequestLocale` to enable static rendering, you can
281291
- }
282292

283293
- export default function Page({params}: Props) {
284-
- setRequestLocale(params.locale);
294+
- setRequestLocale(params.locale);
285295
+ export default function Page() {
286-
// ...
296+
// ...
297+
}
287298
```
288299

289300
Note that `generateStaticParams` is naturally still required though.
@@ -297,7 +308,7 @@ Not strictly a new feature of Next.js, but in case you're using `generateStaticP
297308
export const dynamicParams = false;
298309
```
299310

300-
If you don't use `generateStaticParams`, you can still disallow unknown locales by manually calling `notFound()` in your root layout:
311+
If you don't use `generateStaticParams`, you can still disallow unknown locales by manually calling `notFound()` based on `params` in your root layout:
301312

302313
```tsx filename="src/app/[locale]/layout.tsx"
303314
import {hasLocale} from 'next-intl';
@@ -321,7 +332,7 @@ export default async function RootLayout({children, params}: Props) {
321332

322333
## Try `rootParams` today!
323334

324-
While this article mentions an upcoming `hasLocale` API from `[email protected]` that simplifies working with `rootParams`, you can already try out the API today in the `3.0` range.
335+
While this article mentions an upcoming `hasLocale` API from `[email protected]` that simplifies working with `rootParams`, you can already try out the API today even in the `3.0` range.
325336

326337
The one rare case where a change from `[email protected]` is required, is if you need to [manually pass a locale](#locale-override) to async APIs like `getTranslations` in case your UI renders multiple locales in parallel.
327338

0 commit comments

Comments
 (0)