import type { Metadata } from "next";

import "../src/globals.css";
import { headers } from "next/headers";
import { routing } from "../routing";
import "aos/dist/aos.css";
import { Cairo, Lexend } from "next/font/google";
import { getTranslations } from "next-intl/server";
import Header2 from "@/components/header/Header2";
import Footer from "@/components/footer/Footer";
import { NextIntlClientProvider } from "next-intl";
import Providers from "@/providers/providers";
import AOSInitializer from "@/components/AOSInitializer";
import { getMessages } from "next-intl/server";
import { getFooterData } from "@/lib/serverActions";
import whatsapps from "@/public/assets/icons/rwhatsapp.svg";
import Image from "next/image";
import Link from "next/link";
import { Toaster } from "react-hot-toast";

export async function generateMetadata(): Promise<Metadata> {
  const t = await getTranslations("seo");
  return {
    title: t("home.title"),
    description: t("home.description"),
    keywords: [
      t("home.real_estate_Dubai"),
      t("home.property_investment_UAE"),
      t("home.Dubai_real_estate_consultancy"),
      t("home.off_plan_properties"),
      t("home.luxury_homes_Dubai"),
      t("home.ready_properties_UAE"),
    ].join(", "),
  };
}
const lexend = Lexend({
  subsets: ["latin"],
  weight: ["100", "200", "300", "400", "500", "600", "700", "800", "900"],
});

const cairo = Cairo({
  subsets: ["arabic"],
  weight: ["200", "300", "400", "500", "600", "700", "800", "900"],
});
// export const metadata: Metadata = {
//   title: "Title: Capital H&R | Real Estate Investment & Consultancy in Dubai",
//   description: "Your premier destination for R&H",
// };

export default async function RootLayout({
  children,
  params,
}: {
  children: React.ReactNode;
  params: { locale: string };
}) {
  const { locale } = await params;
  const footerData = await getFooterData(locale);
  // Get the current locale from headers
  const headersList = await headers();
  const currentLocale =
    headersList.get("x-next-intl-locale") || routing.defaultLocale;
  const messages = await getMessages();
  return (
    <NextIntlClientProvider
      // locale={currentLocale || routing.defaultLocale}
      locale={currentLocale || "en"}
      messages={messages}
      timeZone="Asia/Dubai"
    >
      <Providers locale={currentLocale || "en"}>
        <AOSInitializer />

        <html
          lang={currentLocale}
          dir={currentLocale === "ar" ? "rtl" : "ltr"}
          suppressHydrationWarning
        >
          <body
            // className={`bg-white min-h-screen ${
            //   currentLocale === "ar" ? ibmPlexSansArabic.className : inter.className
            // }`}
            className={lexend.className}
            suppressHydrationWarning
          >
            <div
              dir={currentLocale === "ar" ? "rtl " : "ltr"}
              lang={currentLocale}
              className={`  ${
                currentLocale === "ar" ? cairo.className : lexend.className
              }`}
            >
              <Header2 locale={currentLocale || "en"} />

              {children}
              <Footer
                locale={currentLocale || "en"}
                data={footerData?.data?.socials}
              />
              <Link
                href="https://api.whatsapp.com/send/?phone=971555549114&text&type=phone_number&app_absent=0"
                target="_blank"
                rel="noopener noreferrer"
                className="cursor-pointer fixed bottom-10 right-10  z-10 w-[50px] h-[50px] md:w-[70px] md:h-[70px] lg:w-[100px] lg:h-[100px]  transition-all hover:duration-1000 hover:ease-in-out hover:animate-bounce "
              >
                <Image
                  className="w-[100px] h-[100px]"
                  src={whatsapps}
                  alt="whatsapp"
                  width={100}
                  height={100}
                  priority
                  fetchPriority="high"
                />
              </Link>
              <Toaster position="top-right" reverseOrder={false} />
            </div>
          </body>
        </html>
      </Providers>
    </NextIntlClientProvider>
  );
}
