import type { Metadata } from "next";
import { Inter, Noto_Sans_Devanagari, Noto_Sans_Gujarati } from "next/font/google";
import { notFound } from "next/navigation";

import "@/app/globals.css";
import JsonLd from "@/components/common/JsonLd";
import Footer from "@/components/home/Footer";
import Navbar from "@/components/home/Navbar";
import { siteConfig } from "@/config/site.config";
import { getNavigation } from "@/data/navigation.data";
import { getDictionary } from "@/lib/i18n";
import { hasLocale, locales } from "@/lib/locales";
import { localizedPath } from "@/lib/routes";
import QueryProvider from "@/providers/query-provider";

const inter = Inter({
  variable: "--font-inter",
  subsets: ["latin"],
  display: "swap",
});

const devanagari = Noto_Sans_Devanagari({
  variable: "--font-devanagari",
  subsets: ["devanagari"],
  display: "swap",
  preload: false,
});

const gujarati = Noto_Sans_Gujarati({
  variable: "--font-gujarati",
  subsets: ["gujarati"],
  display: "swap",
  preload: false,
});

export const metadata: Metadata = {
  metadataBase: new URL(siteConfig.url),
  title: {
    default: siteConfig.name,
    template: `%s | ${siteConfig.name}`,
  },
  description: siteConfig.description,
  applicationName: siteConfig.name,
  category: "business software",
  icons: {
    icon: [
      { url: "/favicon.svg", type: "image/svg+xml" },
      { url: "/favicon-32x32.png", sizes: "32x32", type: "image/png" },
      { url: "/favicon-16x16.png", sizes: "16x16", type: "image/png" },
    ],
    apple: [{ url: "/apple-touch-icon.png", sizes: "180x180", type: "image/png" }],
    shortcut: ["/favicon.ico"],
  },
};

export function generateStaticParams() {
  return locales.map((lang) => ({ lang }));
}

export default async function LocaleLayout({
  children,
  params,
}: LayoutProps<"/[lang]">) {
  const { lang } = await params;
  if (!hasLocale(lang)) notFound();

  const dictionary = await getDictionary(lang);
  const navigation = getNavigation(lang, dictionary);
  const organizationJsonLd = {
    "@context": "https://schema.org",
    "@type": "Organization",
    name: siteConfig.name,
    url: siteConfig.url,
    logo: `${siteConfig.url}/images/puresaas_logo.webp`,
    email: siteConfig.email,
    telephone: siteConfig.phone,
    contactPoint: {
      "@type": "ContactPoint",
      contactType: "sales",
      email: siteConfig.email,
      telephone: siteConfig.phone,
      areaServed: "IN",
      availableLanguage: ["English", "Hindi", "Gujarati"],
    },
  };

  return (
    <html
      lang={lang}
      data-scroll-behavior="smooth"
      className={`${inter.variable} ${devanagari.variable} ${gujarati.variable} h-full antialiased`}
    >
      <body className="flex min-h-full flex-col pb-[68px] lg:pb-0">
        <JsonLd data={organizationJsonLd} />
        <QueryProvider>
          <Navbar
            bookDemoLabel={dictionary.common.bookDemo}
            languageLabel={dictionary.common.language}
            locale={lang}
            navItems={navigation}
          />
          <main className="min-h-screen flex-1 overflow-x-clip bg-[#fbfdff] text-[#101a3d]">
            {children}
          </main>
          <Footer dictionary={dictionary} locale={lang} />
        </QueryProvider>
      </body>
    </html>
  );
}

export function getHomeHref(lang: string) {
  return hasLocale(lang) ? localizedPath(lang) : localizedPath("en");
}
