Setup & Installation
openclaw skills install @konscious0beast/cart-management
Or with the ClawHub CLI, for registry-managed skill folders outside a full OpenClaw workspace:
npx clawhub install cart-management
What This Skill Does
Patterns for managing shopping cart state in React apps. Covers duplicate prevention, localStorage persistence, and CartContext design. Centralizes cart logic to avoid scattered state across components.
Centralizing cart logic in a context prevents the duplicate-state bugs that arise when multiple components each manage their own cart slice.
When to use it
- Preventing duplicate products when user clicks Add to Cart twice
- Persisting cart contents after page refresh
- Syncing cart state across multiple tabs
- Updating item quantities without creating duplicate entries
- Centralizing cart logic away from individual product components
Example Workflow
Here's how your AI assistant might use this skill in practice.
INPUT
User asks: How do I add a product to the cart without allowing duplicates, and make it persist on refresh?
AGENT
- 1Create a CartContext with cartItems and productIdsInCart state
- 2Initialize cartItems from localStorage on mount
- 3Implement addToCart that checks productIdsInCart.includes(item.id) before adding
- 4On each add, update both state arrays and write to localStorage
- 5Provide the context via CartProvider wrapping the app
OUTPUT
A CartContext where duplicate adds are silently ignored, cart survives refresh, and all product components consume a single source of truth.