import { NextIntlClientProvider } from "next-intl"
import { getMessages, getTranslations } from "next-intl/server"
import { notFound } from "next/navigation"
import { routing } from "@/i18n/routing"
import "@/styles/globals.css"
import Header from "@/app/components/shared/header"
import Footer from "@/app/components/shared/footer"
import { ReactNode } from "react"
import Providers from "@/styles/providers"
import { Raleway } from "next/font/google" 
import { Icon } from "@iconify/react"

import Link from "next/link"
import Quiz from "../../components/QuizPopUp/Quiz"

import 'aos/dist/aos.css'
import AOSInitializer from '@/app/components/AOSInitializer'
import { Metadata } from "next"



interface LayoutProps {
    children: ReactNode
    params: Promise<{ locale: string | any }>
}

const raleway = Raleway({
    subsets: ["latin"],
    weight: ["400", "700"], 
})
// export const metadata: Metadata ={
// title:"Legacy Properties | Luxury Real Estate in Dubai.",
// description:"Discover exclusive luxury real estate in Dubai with Legacy Properties, the premier brokerage serving discerning French-speaking clients worldwide.",
// }

export async function generateMetadata({params}:LayoutProps) : Promise<Metadata> {
    const t = await getTranslations("meta")
    return{
           title: t("home.title"),
           description: t("home.description"),
    }
} 
export default async function Layout({ children, params }: LayoutProps) {
    const t = await getTranslations("Header")

    
    const resolvedParams = await (params instanceof Promise ? params : Promise.resolve(params))
    const { locale } = resolvedParams

  
    if (!routing.locales.includes(locale as any)) {
        notFound()
    }

    
    const messages = await getMessages()

   
    return (
        <html lang={locale} dir={"ltr"} suppressHydrationWarning>
            <body className={`${raleway.className} bg-bodyColor`} dir={"ltr"}>
                <NextIntlClientProvider locale={locale || "en"} messages={messages}>
                    <Providers locale={locale || "en"}>
                        <AOSInitializer />
                        <Header lang={locale} />

                        <div className="fixed bottom-[90px] right-4 flex gap-5 flex-col z-[999]">
                            {/* <Link href={"tel:+971583856353"} target="_blank" className="bg-secondary hover:bg-primary p-3 rounded-full duration-300">
                                <Icon className="text-white text-3xl" icon="basil:phone-outline" />
                            </Link> */}
                            <Link href={"https://wa.link/813li9"} target="_blank" className="bg-secondary hover:bg-primary p-2 lg:p-3 rounded-full duration-300">
                                <Icon className="text-white text-3xl" icon="hugeicons:whatsapp" />
                            </Link> 


                        </div>
                        <Quiz/> 
                      
                        {children}
                        <Footer locale={locale || "en"} />
                    </Providers>
                </NextIntlClientProvider>
            </body>
        </html>
    )
}
