Cart Usage
Setup
useCart hook provides the cart state and all mutation methods:
Adding Items
addLines creates one automatically and persists the cart ID.
Documentation Index
Fetch the complete documentation index at: /llms.txt
Use this file to discover all available pages before exploring further.
import { useCart } from 'react-native-stackfront-sdk';
useCart hook provides the cart state and all mutation methods:
function CartScreen() {
const {
cart, // current cart or null
loading, // fetching state
error, // last error
refetch, // reload cart from API
addLines, // add items
updateLines, // change quantities
removeLines, // remove items
clearCart, // start fresh
getCheckoutUrl, // get Shopify checkout URL
updateBuyerIdentity, // set customer on cart
} = useCart();
if (loading && !cart) return <Loading />;
const lines = cart?.lines?.edges ?? [];
return (
<View>
{lines.map(({ node }) => (
<CartLineItem
key={node.id}
item={node}
onUpdateQty={(qty) => updateLines([{ id: node.id, quantity: qty }])}
onRemove={() => removeLines([node.id])}
/>
))}
</View>
);
}
// Add single variant
await addLines([{ merchandiseId: variantId, quantity: 1 }]);
// Add multiple at once
await addLines([
{ merchandiseId: 'gid://shopify/ProductVariant/111', quantity: 2 },
{ merchandiseId: 'gid://shopify/ProductVariant/222', quantity: 1 },
]);
addLines creates one automatically and persists the cart ID.
await updateLines([
{ id: 'line-id-1', quantity: 3 },
{ id: 'line-id-2', quantity: 0 }, // zero does NOT remove — use removeLines
]);
await removeLines(['line-id-1', 'line-id-2']);
await clearCart();
// cart is now null — next addLines creates a fresh cart
await updateBuyerIdentity({
customerAccessToken: 'access-token',
email: 'customer@example.com',
countryCode: 'US',
});
const { cart } = useStackfront();
// Same methods, but no state tracking:
await cart.addLines([...]);
await cart.get(); // returns cart or null
await cart.updateLines([...]);
await cart.removeLines([...]);
await cart.updateBuyerIdentity({...});
await cart.getCheckoutUrl(); // returns URL string
await cart.clear();