Add to Cart
Add a product to the cart with quantity and variant.
Updated
Add a product to the cart with quantity and variant.
Updated
| Parameter | Type | Required | Description |
|---|---|---|---|
productId | string | Yes | The product ID |
sizeId | string | Yes | The specific size/variant ID |
quantity | number | No | Quantity to add (default: 1) |
freestyleSelections | array | No | Custom selections for freestyle/bundle products |
subscriptionPlanId | string | No | Start a subscription instead of buying once. A plan id from size.subscription_plans; see Subscription Cart Lines |
sizeId, not just a product ID. Every purchasable item is a specific size within a product. Get available sizes from the product variations endpoint.
"use client"
import { useState } from "react"
import dash from "@/lib/dash"
export function AddToCartButton({ productId, sizeId }: {
productId: string
sizeId: string
}) {
const [loading, setLoading] = useState(false)
const [added, setAdded] = useState(false)
async function handleAdd() {
setLoading(true)
try {
await dash.cart.add({ productId, sizeId, quantity: 1 })
setAdded(true)
setTimeout(() => setAdded(false), 2000)
} catch (err) {
alert(err.message)
}
setLoading(false)
}
return (
<button onClick={handleAdd} disabled={loading}>
{added ? "Added!" : loading ? "Adding..." : "Add to Cart"}
</button>
)
}
POST /storefront/cart/add
X-API-Key: pk_live_your_key
Content-Type: application/json
{
"product_id": "prod_abc123",
"size_id": "size_1g",
"quantity": 1,
"cart_id": "cart_xyz" // optional — omit to create new cart
}
Common errors when adding to cart:
try {
await dash.cart.add({ productId, sizeId, quantity: 5 })
} catch (err) {
if (err.message.includes("stock")) {
// Show stock warning
}
}