LLC/src/app/[locale]/layout.jsx

97 lines
2.3 KiB
React
Raw Normal View History

2025-02-20 14:53:06 +03:30
import { NextIntlClientProvider } from "next-intl";
2025-02-22 19:14:53 +03:30
import { getLocale, getMessages } from "next-intl/server";
2025-02-20 14:53:06 +03:30
import { notFound } from "next/navigation";
import { routing } from "src/i18n/routing";
import "../../styles/globals.css";
2025-02-22 19:14:53 +03:30
import Navbar from "src/components/NavBar";
import Footer from "src/view/Landing/components/Footer";
import { ToastContainer } from 'react-toastify';
import graphql from "src/utils/graphql";
import { Rubik, Roboto } from "next/font/google";
const gql = `
query Navbars($locale: I18NLocaleCode) {
navbars(locale: $locale, sort: ["order:asc"]) {
documentId
title
link
children {
id
title
link
}
}
}
`
const rubik = Rubik({
subsets: ["arabic"],
weight: ["400", "700"],
variable: "--font-rubik", // This will create a CSS variable for easy use
});
const roboto = Roboto({
subsets: ["latin"],
weight: ["400", "700"],
variable: "--font-roboto", // Create a CSS variable for Roboto
});
const fetchNavbarItems = async () => {
const locale = await getLocale()
const { navbars } = await graphql(gql, {
locale: locale
})
return navbars
}
// app/[locale]/page.js
export const generateMetadata = async ({ params }) => {
2025-02-22 22:59:55 +03:30
const { locale } = await params
2025-02-22 19:14:53 +03:30
const t = await getMessages(locale)
// Define titles and descriptions for each locale
return {
title: t.HomePage.SEO.title,
description: t.HomePage.SEO.descriptions,
};
};
2025-02-20 14:53:06 +03:30
export default async function LocaleLayout({
children,
2025-02-22 19:14:53 +03:30
params
2025-02-20 14:53:06 +03:30
}) {
2025-02-22 19:14:53 +03:30
const { locale } = await params
const navbaritems = await fetchNavbarItems()
2025-02-20 14:53:06 +03:30
// Ensure that the incoming `locale` is valid
if (!routing.locales.includes(locale)) {
notFound();
}
// Providing all messages to the client
// side is the easiest way to get started
const messages = await getMessages();
return (
2025-02-22 19:14:53 +03:30
<html lang={locale} dir={locale === "en" ? "ltr" : "rtl"}>
<head>
<meta name="apple-mobile-web-app-title" content="AdHorizonIntl" />
</head>
<body className={`${rubik.variable} ${roboto.variable} `} suppressHydrationWarning>
2025-02-20 14:53:06 +03:30
<NextIntlClientProvider messages={messages}>
2025-02-22 19:14:53 +03:30
<Navbar items={navbaritems} />
2025-02-20 14:53:06 +03:30
{children}
2025-02-22 19:14:53 +03:30
<Footer />
<ToastContainer />
2025-02-20 14:53:06 +03:30
</NextIntlClientProvider>
</body>
</html>
);
}