import { HeaderWrwpper } from "@/app/components/shared/main-header";
import Filter from "@/app/components/filter";

import InfoSection from "@/app/components/home/InfoSection";
import teamImg from "@/public/assets/img/team.png";

import DeveloperSection from "@/app/components/home/DeveloperSection";
import GetInTouchSection from "@/app/components/home/GetInTouchSection";


import PropertyBanner from "@/app/components/filter/components/property-banner";
import DiscoverBannder from "@/app/components/filter/components/DiscoverBanner";
import PartnerBanner from "@/app/components/filter/components/PartnerBanner";
import TopAreasSlider from "@/app/components/TopAreasSlider";
import TopPlan from "@/app/components/TopPlan";

import Achievements from "@/app/components/Achievements";
import Events from "@/app/components/events/Events";
import WhyUs from "@/app/components/WhyUs/WhyUs";
import {
  getHomeAchievementData,
  getHomeEventsData,
  getHomeHeaderData,
  getHomeTeamData,
  getHomeWhoWeAreData,
} from "@/lib/serverActions";

import { getTranslations } from "next-intl/server";
import { Metadata } from "next";

interface LayoutProps {
  params: Promise<{ locale: string | any }>; // Handle both promise and object
}

// export const metadate: 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 const metadata: Metadata = {
//     title: '...',
//     description: '...',
//   }

export default async function HomePage({ params }: LayoutProps) {
  const { locale } = await params;
  const headerdata = await getHomeHeaderData(locale);
  const achievementsData = await getHomeAchievementData(locale);
  const eventsData = await getHomeEventsData(locale);
  const teamData = await getHomeTeamData(locale);



  const whoWeAreData = await getHomeWhoWeAreData(locale);




  const t = await getTranslations("Header");
  

  

  return (
    <div className="min-h-[438px] w-full flex flex-col gap-[96px] justify-center pb-10 mb-14"
    
    
    >
     
      <HeaderWrwpper
        data={headerdata}
       
         height="  h-fit  lg:h-[98vh] relative"
        isVidoeOrslider
      >
        <div className="flex flex-col items-center  w-full absolute top-[20%] translate-y-[-20%]  lg:top-[45%] lg:translate-y-[-45%]      ">
          <div
            className="flex flex-col gap-6"
            data-aos="fade-down"
            data-aos-delay={100}
            data-aos-duration="800"
          >
            <h1 className="text-[24px] text-center  lg:text-[48px] font-medium ">
              {headerdata?.data?.title}
            </h1>
            <div className="text-[16px] px-10   lg:text-[24px] text-center font-[300px] ">
              {headerdata?.data?.description}
            </div>
          </div>
        </div>
          <Filter locale={locale} filterType="home" />
      </HeaderWrwpper>

      <InfoSection
        title={t("meetourteam")}
        description={teamData?.data?.description}
        image={teamData?.data?.image?.original_url}
        btnText={t("Book a Consultation")}
        btnLink={`contact-us`}
        locale={locale}
      />
      <PropertyBanner locale={(await params).locale} />
      <TopAreasSlider locale={(await params).locale} />

      <DeveloperSection
        locale={locale}
        title={t("Developers")}
        description="We Deal with the best developers in the United Arab Emirates"
        image={teamImg}
        btnText={t("seeall")}
        btnLink="developers"
      />

      <WhyUs locale={locale} />

      <DiscoverBannder locale={(await params).locale} />

      <InfoSection
        title={t("whoweare")}
        description={whoWeAreData?.data?.description}
        image={whoWeAreData?.data?.image?.original_url}
        btnText={t("Meet Our Founders")}
        btnLink="about-us"
        reverse
        locale={locale}
      />

      <TopPlan locale={(await params).locale} />

      <Achievements
        achievements={achievementsData?.data}
        locale={(await params).locale}
      />

      <PartnerBanner locale={(await params).locale} />
      <Events events={eventsData?.data} locale={(await params).locale} />

      <GetInTouchSection locale={(await params).locale} />
    </div>
  );
}