import { Metadata } from "next";
import { createSeo } from "@/seo/MetaSeo";
import { fetchPageData } from "@/services/api";
import { GeneralLandingePageProps } from "@/types/general-landing";
import Breadcrumbs from "@/components/CommonComponent/BreadCrumbs";
import ServicesBanner from "@/components/CommonComponent/ServicesBanner";
import ContentCounter from "@/components/CommonComponent/ContentCounter";
import MonitoringAndPrevention from "@/components/CommonComponent/MonitoringAndPrevention";
import GeneralSymptomsAndIndications from "@/components/general/SymptomsAndIndications";
import OurLocations from "@/components/CommonComponent/OurLocations";
import GeneralTestimonials from "@/components/ReviewsAndTestimonials/GeneralTestimonial";
import LiveBooking from "@/components/CommonComponent/LiveBooking";
import GeneralWhyChooseoCulsu from "@/components/general/GeneralWhyChooseoCulsu";

export async function generateMetadata(): Promise<Metadata> {
    return createSeo("pages/general-landing", "/general/about-general-services");
}

export default async function BreastReductionPage() {
    const generalLandingPageData = await fetchPageData<GeneralLandingePageProps>("pages/general-landing");

    return (
        <>
            <Breadcrumbs items={generalLandingPageData.data.breadcrumbs} />
            <ServicesBanner
                className="md:mb-5 xl:mb-5"
                maxWidthClasses="md:max-w-[650px]"
                maxWidthDescriptionClasses="md:max-w-[550px] xl:max-w-[630px]"
                {...generalLandingPageData.data.about_banner}
            />
            <ContentCounter
                className="py-8 md:py-6 mb-16 md:mb-30"
                {...generalLandingPageData.data.about_counter}
            />
            <MonitoringAndPrevention
                className="bg-white !p-0 mb-16 md:20 xl:mb-30"
                {...generalLandingPageData.data.monitor_and_prevention}
            />
            <GeneralSymptomsAndIndications {...generalLandingPageData.data.symptoms_and_indications} />
            <OurLocations className="md:!bg-transparent !mb-0 md:!mb-20 xl:!mb-30"  {...generalLandingPageData.data.homepage_locations} />
            <GeneralWhyChooseoCulsu className="bg-[#F2F4F6]" {...generalLandingPageData.data.homepage_card_content__left_heading} />
            <section className="mb-16 md:mb-20 xl:mb-30">
                <div className="container">
                    <GeneralTestimonials />
                </div>
            </section>
            <LiveBooking {...generalLandingPageData.data.live_booking} />
        </>
    )
}