atomicsolutions.dev
Menu

Getting Started

Installation

pnpm add @atomic-solutions/react-woocommerce

Setup

Wrap your app with WooCommerceProvider:

import { WooCommerceProvider } from '@atomic-solutions/react-woocommerce'

function App() {
  return (
    <WooCommerceProvider baseURL="https://your-site.com/wp-json">
      {/* your app */}
    </WooCommerceProvider>
  )
}

Manage the cart

import { useCart, useAddToCart } from '@atomic-solutions/react-woocommerce'

function AddToCartButton({ productId }: { productId: number }) {
  const { data: cart } = useCart()
  const addToCart = useAddToCart()

  return (
    <button onClick={() => addToCart.mutate({ id: productId, quantity: 1 })}>
      Add to cart ({cart?.items_count ?? 0})
    </button>
  )
}

See the API Reference for all hooks.