The SDK provides React hooks that give you real-time access to cart data, payment methods, shipping options, and store configuration.

​
Hooks

Problem: Need access to cart contents and customer information
useCheckoutSession Hook
import { useCheckoutSession } from '@ollie-shop/sdk';

export default function CartSummary() {
  const { cart, customer, addToCart, removeFromCart } = useCheckoutSession();
  
  return (
    <div>
      <h3>Hello {customer.firstName}!</h3>
      <p>Items: {cart.items.length}</p>
      <p>Total: ${(cart.total / 100).toFixed(2)}</p>
      
      {cart.items.map(item => (
        <div key={item.id}>
          <span>{item.name} (${(item.price / 100).toFixed(2)})</span>
          <button onClick={() => removeFromCart(item.id)}>Remove</button>
        </div>
      ))}
    </div>
  );
}
What you get:
  • Live cart data (items, totals, discounts)
  • Customer information (name, email, type)
  • Cart actions (add, remove, update quantities)
  • Coupon management (apply, remove codes)