"use client";

import { useState } from "react";

import AddToCartModal from "@/components/ui/AddToCartModal";
import ProductCard, { type ProductCardProps } from "@/components/ui/ProductCard";

export default function ProductCardWithCartModal(props: ProductCardProps) {
  const [modalOpen, setModalOpen] = useState(false);

  return (
    <>
      <ProductCard
        {...props}
        onAddToCart={() => {
          props.onAddToCart?.();
          setModalOpen(true);
        }}
      />
      <AddToCartModal
        open={modalOpen}
        onClose={() => setModalOpen(false)}
        product={{
          imageSrc: props.imageSrc,
          imageAlt: props.imageAlt,
          name: props.name,
          price: props.price,
          oldPrice: props.oldPrice,
          discountBadge: props.discountBadge,
        }}
      />
    </>
  );
}
