'use client';

import { Plus, Minus, Trash2 } from "lucide-react";
import { useCart } from "./context/cartcontext";
interface ProductCartActionProps {
  product: any;
}

export default function ProductCartAction({ product }: ProductCartActionProps) {
  const { addToCart, decreaseQuantity, cart } = useCart();
  
  // بررسی وجود و تعداد محصول در سبد خرید
  const cartItem = cart.find((item) => item.id === product.id);
  const quantity = cartItem ? cartItem.quantity : 0;

  const handleIncrease = (e: React.MouseEvent) => {
    e.preventDefault();
    addToCart(product);
  };

  const handleDecrease = (e: React.MouseEvent) => {
    e.preventDefault();
    decreaseQuantity(product.id);
  };

  // اگر محصول ناموجود بود
  if (!product.stock) {
    return (
      <div className="flex gap-3 mb-8 h-[52px]">
        <button disabled className="w-full rounded-xl font-bold text-white bg-gray-300 cursor-not-allowed">
          ناموجود در انبار
        </button>
      </div>
    );
  }

  return (
    <div className="flex gap-3 mb-8 h-[52px]">
      {quantity > 0 ? (
        // حالت ۲: محصول در سبد خرید وجود دارد (نمایش کنترلر کم و زیاد)
        <div className="flex-1 flex items-center justify-between bg-white border-2 border-[#f59e0b] rounded-xl px-4 shadow-sm transition-all">
          <button 
            onClick={handleIncrease}
            className="text-gray-500 hover:text-green-600 transition-colors p-2 cursor-pointer"
          >
            <Plus size={20} />
          </button>
          
          <span className="text-xl font-bold text-gray-800 w-8 text-center">
            {quantity}
          </span>
          
          <button 
            onClick={handleDecrease}
            className="text-gray-500 hover:text-red-500 transition-colors p-2 cursor-pointer"
          >
            {quantity === 1 ? <Trash2 size={20} /> : <Minus size={20} />}
          </button>
        </div>
      ) : (
        // حالت ۱: پیش‌فرض (دکمه نارنجی افزودن به سبد مطابق با تصویر)
        <>
          <button 
            onClick={handleIncrease}
            className="flex-1 rounded-xl font-bold text-white transition-all flex items-center justify-center gap-2 bg-[#f59e0b] hover:bg-amber-600 shadow-lg shadow-amber-500/20 cursor-pointer"
          >
            افزودن به سبد
          </button>
       
        </>
      )}
    </div>
  );
}