import { TranslationProvider } from "@/hooks/useTranslation";
import AdSenseScript from "@/components/ads/AdSenseScript";
import RouteProgressBar from "@/components/ui/RouteProgressBar";
import WhatsAppFloatButton from "@/components/ui/WhatsAppFloatButton";
import { BASE_URL } from "@/config/env";
import type { Metadata } from "next";
import { Inter, Newsreader, Plus_Jakarta_Sans } from "next/font/google";
import { Suspense } from "react";
import { ToastContainer } from "react-toastify";
import "swiper/css";
import "swiper/css/autoplay";
import "swiper/css/navigation";
import "swiper/css/pagination";
import { AppProviders } from "./AppProviders";
import "./globals.css";

const SITE_DESCRIPTION =
  "KutuBuku - Aplikasi yang dirancang untuk membantu pengguna dalam membaca, menulis, menyunting, dan mengelola naskah penerbitan maupun karya sastra unggulan mereka. Aplikasi ini menawarkan koleksi cerita yang luas dari berbagai genre, menyediakan wadah bagi penulis untuk memublikasikan karya mereka serta bagi pembaca untuk menjelajahi narasi baru yang menarik. Berkat fitur-fitur seperti pengaturan bacaan yang dapat disesuaikan dan interaksi komunitas, aplikasi ini menjadikan pengalaman menemukan serta menikmati novel terasa praktis dan menyenangkan.";

export async function generateMetadata({
  params,
}: {
  params: Promise<{ locale: string }>;
}): Promise<Metadata> {
  const { locale } = await params;

  return {
    metadataBase: new URL(BASE_URL),
    title: {
      default: "KutuBuku",
      template: "%s | KutuBuku",
    },
    description: SITE_DESCRIPTION,
    icons: {
      icon: "/icon.png",
    },
    alternates: {
      languages: {
        id: "/id",
        en: "/en",
      },
    },
    openGraph: {
      type: "website",
      siteName: "KutuBuku",
      title: "KutuBuku",
      description: SITE_DESCRIPTION,
      locale: locale === "en" ? "en_US" : "id_ID",
    },
    twitter: {
      card: "summary_large_image",
      title: "KutuBuku",
      description: SITE_DESCRIPTION,
    },
  };
}

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

const newsreader = Newsreader({
  subsets: ["latin"],
  variable: "--font-newsreader",
});

const plusJakartaSans = Plus_Jakarta_Sans({
  subsets: ["latin"],
  variable: "--font-jakarta",
});

export default async function RootLayout({
  children,
  params,
}: Readonly<{
  children: React.ReactNode;
  params: Promise<{ locale: string }>;
}>) {
  const { locale } = await params;

  return (
    <html lang={locale}>
      <body
        className={`${inter.variable} ${newsreader.variable} ${plusJakartaSans.variable} antialiased`}
      >
        <AdSenseScript />
        <Suspense fallback={null}>
          <RouteProgressBar />
        </Suspense>
        <TranslationProvider>
          <AppProviders>
            <ToastContainer />
            {children}
            <WhatsAppFloatButton />
          </AppProviders>
        </TranslationProvider>
      </body>
    </html>
  );
}
