import { fireEvent, render, screen } from "@testing-library/react";
import { describe, expect, it, vi } from "vitest";

import { ProductPurchaseBar } from "../product-purchase-bar";

describe("ProductPurchaseBar", () => {
  it("renders a compact purchase bar and calls add-to-cart with the item id", () => {
    const onAddToCart = vi.fn();

    render(
      <ProductPurchaseBar
        itemId="item-1"
        title="Vintage Tee"
        price={2500}
        originalRetail={5000}
        status="active"
        addToCartPending={false}
        onAddToCart={onAddToCart}
      />,
    );

    expect(
      screen.getByRole("complementary", { name: /Vintage Tee quick purchase/i }),
    ).toBeInTheDocument();
    expect(screen.getByText("Vintage Tee")).toBeInTheDocument();
    expect(screen.getByText("$25.00")).toBeInTheDocument();

    fireEvent.click(screen.getByRole("button", { name: "Add to Cart" }));

    expect(onAddToCart).toHaveBeenCalledWith("item-1");
  });

  it("disables add-to-cart while pending or unavailable", () => {
    const onAddToCart = vi.fn();
    const { rerender } = render(
      <ProductPurchaseBar
        itemId="item-1"
        title="Vintage Tee"
        price={2500}
        status="active"
        addToCartPending
        onAddToCart={onAddToCart}
      />,
    );

    expect(screen.getByRole("button", { name: "Add to Cart" })).toBeDisabled();

    rerender(
      <ProductPurchaseBar
        itemId="item-1"
        title="Vintage Tee"
        price={2500}
        status="sold"
        addToCartPending={false}
        onAddToCart={onAddToCart}
      />,
    );

    expect(screen.getByRole("button", { name: "Add to Cart" })).toBeDisabled();
  });
});
