'use client';

import type { Product } from 'brainerce';
import { Link } from '@/core/lib/navigation';
import { useTranslations } from '@/core/lib/translations';
import { ProductGrid } from '@/ui/product/product-grid';

/** Homepage featured-products grid with a "view all" link. */
export function FeaturedProductsSection({ products }: { products: Product[] }) {
  const t = useTranslations('home');
  const tc = useTranslations('common');

  return (
    <section className="mx-auto max-w-7xl px-4 py-16 sm:px-6 lg:px-8">
      <div className="mb-8 flex items-center justify-between">
        <h2 className="text-foreground text-2xl font-bold">{t('featuredProducts')}</h2>
        <Link href="/products" className="text-primary text-sm font-medium hover:underline">
          {tc('viewAll')}
        </Link>
      </div>
      <ProductGrid products={products} />
    </section>
  );
}