Skip to content

Conversation

@martinalong-stripe
Copy link
Contributor

@martinalong-stripe martinalong-stripe commented Oct 18, 2022

Summary & motivation

useCartElement
useCartElement is a react hook that retrieves the Cart Element, similar to the effect of calling elements.getElement('cart'). This hook exists so that React users can more easily call cart functions such as:

const cartElement = useCartElement();

cartElement.addLineItem({product: "prod_123"});
cartElement.show();
cartElement.hide();
cartElement.cancelCheckout("Checkout cancelled because...");
cartElement.update({ showOnAdd: false );

useCartElementState
useCartElementState is a react hook that retrieves the last value returned by the ready or change events (or null if no event has occurred yet). This value is used to display the cart count in the merchant's UI. The value returned has the shape:

{
  id: "cart_session_123",
  elementType: 'cart',
  lineItems: {
    count: 1,
  }
}

Testing & documentation

Wrote unit tests, and a ran a storybook scenario to confirm it works

@martinalong-stripe martinalong-stripe changed the title [wip] Add useCartElement and useCartElementState hooks Add useCartElement and useCartElementState hooks Oct 25, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants