import { Carousel } from "@/components/ui/Carousel";
import { ProductCard } from "@/components/ui/ProductCard";
import { SectionTitle } from "@/components/ui/SectionTitle";
import { topSellingProducts } from "@/data/sample";

export function TopSellingCarousel() {
  return (
    <section className="py-10 md:py-14">
      <div className="mx-auto max-w-7xl px-4">
        <SectionTitle
          title="پرفروش‌ترین‌ها"
          enTitle="Top Selling"
          action="مشاهده همه"
        />
        <Carousel ariaLabel="کاروسل پرفروش‌ترین‌ها">
          {topSellingProducts.map((product) => (
            <ProductCard
              key={product.id}
              name={product.name}
              brand={product.brand}
              price={product.price}
              image={product.image}
            />
          ))}
        </Carousel>
      </div>
    </section>
  );
}