import { notFound } from 'next/navigation';
import Navbar from '@/components/Navbar';
import Footer from '@/components/Footer';
import Hero from '@/components/Hero';
import Compatibility from '@/components/Compatibility';
import PreCAN from '@/components/PreCAN';
import Telemetry from '@/components/Telemetry';
import Sensor from '@/components/Sensor';
import ProductShowcase from '@/components/ProductShowcase';
import CANFlash from '@/components/CANFlash';
import S300 from '@/components/S300';
import MapSensor from '@/components/MapSensor';
import Features from '@/components/Features';
import CTA from '@/components/CTA';
import { products } from '@/lib/products';

export async function generateStaticParams() {
    return products.map((product) => ({
        id: product.id,
    }));
}

interface PageProps {
    params: Promise<{ id: string }>;
}

export default async function ProductDetailPage({ params }: PageProps) {
    const { id } = await params;
    const product = products.find((p) => p.id === id);

    if (!product) {
        notFound();
    }

    return (
        <main>
            <Navbar />
            
            {id === 'kpro' && (
                <>
                    <Hero 
                        version={product.version}
                        title1={product.name}
                        title2={product.subtitle}
                        description={product.description}
                        image={product.image}
                        badge={product.badge}
                    />
                    <Compatibility />
                    <Telemetry />
                </>
            )}

            {id === 'canflash' && (
                <>
                    <CANFlash />
                </>
            )}

            {id === 'precan' && (
                <>
                    <PreCAN />
                </>
            )}

            {id === 's300' && (
                <>
                    <S300 />
                </>
            )}

            {id === 'map-sensor' && (
                <>
                    <MapSensor />
                </>
            )}

            {id !== 'kpro' && id !== 'canflash' && id !== 'precan' && id !== 's300' && id !== 'map-sensor' && <CTA />}
            <Footer />
        </main>
    );
}
