"use client";

import Link from "next/link";
import { useCart } from "@/lib/cart-context";
import { useSalesSettings } from "@/lib/sales-settings-context";
import { parseImages, type ProductCardData } from "@/lib/types";

const buttonClass =
  "block w-full rounded-md py-2 text-center text-sm font-semibold transition";

export default function QuickAddButton({ product }: { product: ProductCardData }) {
  const { items, addItem } = useCart();
  const { salesEnabled } = useSalesSettings();

  if (!salesEnabled) return null;

  const outOfStock = product.stock !== null && product.stock <= 0;
  if (outOfStock) {
    return (
      <span className={`${buttonClass} cursor-not-allowed bg-stone-100 text-stone-400`}>Out of stock</span>
    );
  }

  const needsChoice = product.variants.length > 0 || product.personalizable;
  if (needsChoice) {
    return (
      <Link
        href={`/product/${product.slug}`}
        className={`${buttonClass} border border-rose-700 text-rose-700 hover:bg-rose-50`}
      >
        Select options
      </Link>
    );
  }

  const alreadyInCart = items.some((i) => i.productId === product.id && !i.variantId);
  if (alreadyInCart) {
    return (
      <Link href="/cart" className={`${buttonClass} border border-rose-700 text-rose-700 hover:bg-rose-50`}>
        Go to cart
      </Link>
    );
  }

  const unitPrice = product.salePrice != null && product.salePrice < product.basePrice ? product.salePrice : product.basePrice;
  const image = parseImages(product.images)[0];

  return (
    <button
      onClick={(e) => {
        e.preventDefault();
        e.stopPropagation();
        addItem({
          productId: product.id,
          name: product.name,
          slug: product.slug,
          image,
          unitPrice,
          quantity: product.minOrderQty || 1,
          minOrderQty: product.minOrderQty || 1,
        });
      }}
      className={`${buttonClass} bg-rose-700 text-white hover:bg-rose-800`}
    >
      Add to cart
    </button>
  );
}