import { Metadata } from "next";
import { createSeo } from "@/seo/MetaSeo";
import { fetchPageData } from "@/services/api";
import { GeneralInternalMedicineCarePageProps } from "@/types/general-internal-medicine";
import Breadcrumbs from "@/components/CommonComponent/BreadCrumbs";
import ServicesBanner from "@/components/CommonComponent/ServicesBanner";
import OurSpecialist from "@/components/CommonComponent/OurSpecialist";
import TreatmentJourney from "@/components/CommonComponent/TreatmentJourney";
import RequestCostResources from "@/components/CommonComponent/CostResources";
import CataractTypes from "@/components/CommonComponent/CataractTypes";
import CausesAndRiskFactor from "@/components/CommonComponent/CausesRiskFactor";
import SymptomsForCataract from "@/components/CommonComponent/SymptomsForCataract";
import OurTreatment from "@/components/CommonComponent/OurTreatment";
import RecoveryAftercare from "@/components/CommonComponent/RecoveryAftercare";
import GeneralTestimonials from "@/components/ReviewsAndTestimonials/GeneralTestimonial";
import MonitoringAndPrevention from "@/components/CommonComponent/MonitoringAndPrevention";
import SafetyRisks from "@/components/CommonComponent/SafetyRisks";
import ImplantsTechinques from "@/components/CommonComponent/ImplantsTechinques";
import Faqs from "@/components/CommonComponent/Faqs";
import LiveBooking from "@/components/CommonComponent/LiveBooking";

export async function generateMetadata(): Promise<Metadata> {
    return createSeo("pages/orthopaedic-surgery", "/general/orthopaedics");
}

export default async function OrthopaedicPage() {
    const orthopaedicPageData = await fetchPageData<GeneralInternalMedicineCarePageProps>("pages/orthopaedic-surgery");


    return (
        <>
            <Breadcrumbs items={orthopaedicPageData?.data?.breadcrumbs} />
            <ServicesBanner
                className="mb-16 md:mb-30"
                maxWidthClasses="md:max-w-[500px]"
                maxWidthDescriptionClasses="md:max-w-[550px] xl:max-w-[630px]"
                {...orthopaedicPageData?.data?.about_banner}
            />
            <CausesAndRiskFactor {...orthopaedicPageData?.data?.causes_risk_factors} />

            <CataractTypes {...orthopaedicPageData?.data?.what_we_offer} />
            <SymptomsForCataract className="!py-0 xl!py-0" {...orthopaedicPageData?.data?.symptoms_and_indications} />
            <OurSpecialist className="bg-[#F2F4F6] py-16 md:py-20 xl:py-30" {...orthopaedicPageData?.data?.homepage_meet_team} />
            <OurTreatment columns={4} {...orthopaedicPageData?.data?.treatment_we_offer} />
            <ImplantsTechinques
                columns={4}
                className="mb-16 md:mb-20 xl:mb-30"
                {...orthopaedicPageData?.data?.homepage_card_content__left_heading}
            />
            <TreatmentJourney
                showCTA={false} className="mb-16 md:mb-24 xl:mb-30"
                {...orthopaedicPageData?.data?.surgery_steps}
            />
            <RecoveryAftercare {...orthopaedicPageData?.data?.recovery_steps} />
            <SafetyRisks className="mb-16 md:mb-20 xl:mb-30" columns={2} {...orthopaedicPageData?.data?.safety_and_risks} />
            <section className="mb-16 md:mb-20 xl:mb-30">
                <div className="container">
                    <GeneralTestimonials />
                </div>
            </section>
            <MonitoringAndPrevention {...orthopaedicPageData?.data?.monitor_and_prevention} />
            <RequestCostResources {...orthopaedicPageData?.data?.clinicpage_left_content_button_with_right_image_with_points} />
            <Faqs {...orthopaedicPageData?.data?.homepage_faqs} />
            <LiveBooking {...orthopaedicPageData?.data?.live_booking} />
        </>
    )
}