import React from "react";
import Header1 from "@/components/layout/Header1";
import Footer1 from "@/components/layout/Footer1";
import PageHeader from "@/components/common/PageHeader";
import ServiceDetails from "@/components/services-digital-solutions/ServiceDetails";
import { ourServices } from "@/utils/data";
import { notFound } from "next/navigation";

export async function generateStaticParams() {
    return ourServices.map((service) => ({
        slug: service.slug,
    }));
}

export default async function ServiceDetailsPage({ params }: { params: Promise<{ slug: string }> }) {
    const { slug } = await params;

    const service = ourServices.find((s) => s.slug === slug);

    if (!service) {
        notFound();
    }

    return (
        <>
            <Header1 />
            <main>
                <PageHeader title={service.title} />
                <ServiceDetails service={service} />
            </main>
            <Footer1 />
        </>
    );
}