dynamicIO, ppr, remove dynamicParams = false

amannn · amannn · Nov 11, 2024 · Nov 11, 2024 · Nov 11, 2024 · Nov 12, 2024
commit 550a734179eca634d13262dd79a344c8f407aef4
diff --git a/examples/example-app-router/next.config.mjs b/examples/example-app-router/next.config.mjs
@@ -9,6 +9,11 @@ const withNextIntl = createNextIntlPlugin({
 });
 
 /** @type {import('next').NextConfig} */
-const config = {};
+const config = {
+  experimental: {
+    dynamicIO: true,
+    ppr: true
+  }
+};
 
 export default withNextIntl(config);
diff --git a/examples/example-app-router/src/app/[locale]/layout.tsx b/examples/example-app-router/src/app/[locale]/layout.tsx
@@ -1,6 +1,7 @@
-import {Locale} from 'next-intl';
-import {getTranslations, setRequestLocale} from 'next-intl/server';
-import {ReactNode} from 'react';
+import {notFound} from 'next/navigation';
+import {Locale, hasLocale} from 'next-intl';
+import {getTranslations} from 'next-intl/server';
+import {ReactNode, Suspense} from 'react';
 import BaseLayout from '@/components/BaseLayout';
 import {routing} from '@/i18n/routing';
 
@@ -22,13 +23,27 @@ export async function generateMetadata({params}: Omit<Props, 'children'>) {
   };
 }
 
-// Return a 404 for unknown locales
-export const dynamicParams = false;
+export default function LocaleLayoutMain(props: Props) {
+  return (
+    <Suspense
+      fallback={
+        <html lang="en">
+          <body>
+            <div>Loading …</div>
+          </body>
+        </html>
+      }
+    >
+      <LocaleLayout {...props} />
+    </Suspense>
+  );
+}
 
-export default async function LocaleLayout({children, params}: Props) {
-  // Enable static rendering
+async function LocaleLayout({children, params}: Props) {
   const {locale} = await params;
-  setRequestLocale(locale);
+  if (!hasLocale(routing.locales, locale)) {
+    notFound();
+  }
 
   return <BaseLayout locale={locale}>{children}</BaseLayout>;
 }
diff --git a/examples/example-app-router/src/app/[locale]/page.tsx b/examples/example-app-router/src/app/[locale]/page.tsx
@@ -1,17 +1,7 @@
-import {Locale, useTranslations} from 'next-intl';
-import {setRequestLocale} from 'next-intl/server';
-import {use} from 'react';
+import {useTranslations} from 'next-intl';
 import PageLayout from '@/components/PageLayout';
 
-type Props = {
-  params: Promise<{locale: Locale}>;
-};
-
-export default function IndexPage({params}: Props) {
-  // Enable static rendering
-  const {locale} = use(params);
-  setRequestLocale(locale);
-
+export default function IndexPage() {
   const t = useTranslations('IndexPage');
 
   return (

diff --git a/examples/example-app-router/src/app/[locale]/pathnames/page.tsx b/examples/example-app-router/src/app/[locale]/pathnames/page.tsx
@@ -1,17 +1,7 @@
-import {Locale, useTranslations} from 'next-intl';
-import {setRequestLocale} from 'next-intl/server';
-import {use} from 'react';
+import {useTranslations} from 'next-intl';
 import PageLayout from '@/components/PageLayout';
 
-type Props = {
-  params: Promise<{locale: Locale}>;
-};
-
-export default function PathnamesPage({params}: Props) {
-  // Enable static rendering
-  const {locale} = use(params);
-  setRequestLocale(locale);
-
+export default function PathnamesPage() {
   const t = useTranslations('PathnamesPage');
 
   return (