devops
474ac3795b
variant.available (calculado en lib/headless/providers/medusa.ts a partir de manage_inventory/allow_backorder/inventory_quantity) ya llegaba correcto hasta el componente, pero ningun boton de compra lo usaba -- se podia seguir agregando al carrito un producto con stock 0. Afecta product-purchase.tsx (pagina de producto), mobile-add-to-cart.tsx (barra fija mobile) y product-card.tsx (tarjetas de catalogo): boton deshabilitado + label "Agotado" en los tres, mas badge/overlay en la tarjeta de catalogo.
26 lines
846 B
TypeScript
26 lines
846 B
TypeScript
"use client";
|
|
|
|
import { ShoppingBag } from "lucide-react";
|
|
import { Button } from "@/components/ui/button";
|
|
import type { Product } from "@/lib/headless/types";
|
|
import { useCartStore } from "@/store/cart-store";
|
|
|
|
export function MobileAddToCart({ product }: { product: Product }) {
|
|
const addItem = useCartStore((state) => state.addItem);
|
|
const outOfStock = product.variants[0]?.available === false;
|
|
return (
|
|
<div className="fixed inset-x-0 bottom-0 z-40 border-t border-slate-200 bg-white/95 p-3 shadow-2xl backdrop-blur lg:hidden">
|
|
<Button
|
|
variant="primary"
|
|
size="lg"
|
|
className="w-full"
|
|
disabled={outOfStock}
|
|
onClick={() => addItem(product, product.variants[0]?.id)}
|
|
>
|
|
<ShoppingBag />
|
|
{outOfStock ? "Agotado" : "Añadir al carrito"}
|
|
</Button>
|
|
</div>
|
|
);
|
|
}
|