import { Hero, type HeroSlide } from '@/components/hero';
import { CategoryGrid } from '@/components/category-grid';
import { FeaturedProducts } from '@/components/featured-products';
import { BrandMarquee } from '@/components/brand-marquee';
import { WhyChooseUs } from '@/components/why-choose-us';
import { WhatsappCtaSection } from '@/components/whatsapp-cta';
import { Testimonials } from '@/components/testimonials';
import { FaqSection } from '@/components/faq';
import { ContactSection } from '@/components/contact-section';
import {
    getProducts, getCategories, productImage, productCategory,
    type WPProduct,
} from '@/lib/wp';
import type { ProductCardItem } from '@/components/product-card';

export const revalidate = 600;

function toCard(p: WPProduct): ProductCardItem {
    return {
        slug: p.slug,
        title: p.title.rendered.replace(/&/g, '&'),
        image: productImage(p, 'medium_large'),
        category: productCategory(p),
        inStock: true,
    };
}

export default async function HomePage() {
    const [allProducts, cats] = await Promise.all([
        getProducts({ perPage: 12 }).catch(() => [] as WPProduct[]),
        getCategories().catch(() => [] as Awaited<ReturnType<typeof getCategories>>),
    ]);

    const counts: Record<string, number> = {};
    for (const c of cats) counts[c.slug] = c.count;

    const slides: HeroSlide[] = allProducts
        .filter((p) => productImage(p, 'large'))
        .slice(0, 4)
        .map((p) => ({
            id: p.id,
            title: p.title.rendered.replace(/&amp;/g, '&'),
            href: `/products/${p.slug}`,
            image: productImage(p, 'large'),
            badge: 'Featured',
        }));

    const featured = allProducts.slice(0, 12).map(toCard);

    return (
        <>
            <Hero slides={slides} />
            <CategoryGrid counts={counts} />
            <FeaturedProducts products={featured} />
            <BrandMarquee />
            <WhyChooseUs />
            <WhatsappCtaSection />
            <Testimonials />
            <FaqSection />
            <ContactSection />
        </>
    );
}