How to Localize While Keeping Static Route Mode? #1641

AssadRajab · 2024-12-31T10:50:00Z

AssadRajab
Dec 31, 2024

Hi,
I noticed that I needed to use suspense to get things working. However, this is turning my application into a dynamic rendered page, even though it is empty.
I am using the experimental feature dynamic: true, but I don't know if it has anything to do with it.
Am I doing something wrong? I do know that Suspense will render everything as dynamic content. How should I deal with this else?

This is my Root layout.tsx

import type { Metadata } from "next";
import "./globals.css";
import { Beiruti, Rubik } from "next/font/google";
import { Locale, routing } from "@/i18n/routing";
import { getMessages } from "next-intl/server";
import { NextIntlClientProvider } from "next-intl";
import { Suspense } from "react";
import { twJoin } from "tailwind-merge";

const rubik = Rubik({
  subsets: ["latin"],
  weight: ["400", "500", "700"],
});

const beiruti = Beiruti({
  subsets: ["arabic"],
  weight: "400",
});

export default function RootLayout({
  children,
  params,
}: {
  children: React.ReactNode;
  params: Promise<{ locale: string }>;
}) {
  return (
    <html lang="de">
      <body>
        <Suspense>
          <LayoutComponent params={params}>{children}</LayoutComponent>
        </Suspense>
      </body>
    </html>
  );
}

const LayoutComponent = async ({
  params,
  children,
}: {
  params: Promise<{ locale: string }>;
  children: React.ReactNode;
}) => {
  // Await the params to get the locale
  const { locale } = await params;
  if (!routing.locales.includes(locale as Locale)) {
    // notFound();
    return <div>NotFound</div>;
  }

  // Providing all messages to the client
  // side is the easiest way to get started
  const messages = await getMessages();

  const fontName = locale === "ar" ? beiruti : rubik;
  return (
    <NextIntlClientProvider messages={messages} locale={locale}>
      <div className={twJoin("rootWrapper", fontName.className)}>
        {children}
      </div>
    </NextIntlClientProvider>
  );
};

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

How to Localize While Keeping Static Route Mode? #1641

{{title}}

Replies: 0 comments

Select a reply

How to Localize While Keeping Static Route Mode? #1641

AssadRajab Dec 31, 2024

Replies: 0 comments

AssadRajab
Dec 31, 2024