ecommerce

Implement Wix shopping cart and checkout flows for catalog collections.

Updated May 1, 2026
One-click install
npx skills add https://github.com/Rachit246-art/rvglobal1 --skill ecommerce-rachit246-art
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ecommerce
Source: https://github.com/Rachit246-art/rvglobal1/tree/main/.emdash/skills/ecommerce
Command: npx skills add https://github.com/Rachit246-art/rvglobal1 --skill ecommerce-rachit246-art

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

It solves the problem of implementing reliable shopping cart and checkout flows for Wix-powered catalogs, so customers can add products, review totals, and complete purchases without fragile custom logic.

Core Features & Use Cases

  • Cart & Buy Now for catalog collections: Implements cart and checkout patterns that work only with collections marked as @catalog.
  • Price handling with correct currency formatting: Enforces fixed collection pricing and formats all currency display using useCurrency() + formatPrice() instead of hardcoded symbols.
  • Required UI integration: Provides the expected cart UI responsibilities (cart drawer/modal, header icon + count badge, and product-card add-to-cart buttons).
  • Production-ready interaction rules: Differentiates loading behavior for addToCart (server-confirmed) versus removeFromCart/updateQuantity (optimistic), and disables checkout during checkout progress.

Quick Start

Implement the cart/buyNow flow using the @catalog collection pattern, then create a cart UI component (drawer/modal) with header cart icon + item count, and wire Add to Cart buttons on product listings.

Frequently Asked Questions about ecommerce

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I implement a shopping cart and checkout flow for a Wix catalog collection?▼

To implement shopping cart and checkout purchasing workflows, use the @catalog collection pattern and wire cart UI components with useCart() for cart state, applying @catalog-only rules for product browsing and purchasing workflows.

How do I format currency correctly when displaying product prices in an ecommerce app?▼

Currency formatting uses useCurrency() with formatPrice() instead of hardcoded symbols, applying a DEFAULT_CURRENCY fallback to ensure consistent price display across all cart and checkout interactions.

Does this cart and checkout implementation work with any React collection or only catalog collections?▼

Cart and checkout purchasing workflows work only with collections marked as @catalog, enforcing @catalog-only rules so that add-to-cart and buy-now actions rely strictly on catalog item price data.

How should I handle loading states for add-to-cart and checkout actions in a React integration?▼

Handle loading states using addingItemId for server-confirmed addToCart actions and isCheckingOut for checkout progress, while applying optimistic updates for removeFromCart and updateQuantity operations.

What UI components do I need to build for an ecommerce shopping cart workflow?▼

Shopping cart workflows require a cart drawer or modal, a header cart icon with an item count badge, and product-card add-to-cart buttons on catalog listings to support cart review and checkout.

Why does checkout get disabled during purchase progress in a catalog app?▼

Checkout is disabled during purchase progress by tracking isCheckingOut to prevent duplicate submissions, while addToCart uses addingItemId to show server-confirmed loading states per item.