How to use the easy-peasy.useActions function in easy-peasy

To help you get started, we’ve selected a few easy-peasy examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github moltin / shopkit / src / components / CartButton.js View on Github external
function CartButton({ moltinText, moltinShowTotal }) {
  const { count, subTotal } = useStore(({ cart }) => cart)
  const {
    initialize,
    modal: { goToCart }
  } = useActions(actions => actions)

  const [cartId, setCartId] = useLocalStorage('mcart', createCartIdentifier())
  // const [customerToken, setCustomerToken] = useLocalStorage('mtoken', null)
  // const [customerId, setCustomerId] = useLocalStorage('mcustomer', null)

  const btnSuffix =
    subTotal || count
      ? ` (${moltinShowTotal ? subTotal : pluralize(count, 'item')})`
      : null

  useEffect(() => {
    // initialize({ cartId, customerToken, customerId })
    initialize({ cartId })
    setCartId(cartId)
  }, [cartId])
github ctrlplusb / easy-peasy / src / __tests__ / typescript / implementation.tsx View on Github external
function MyComponent() {
  const token = useStore((state: State) => state.user.token);
  const { login } = useActions((dispatch: Actions) => ({
    login: dispatch.user.login,
  }));
  const { addTodo } = useActions((actions: Actions) => ({
    addTodo: actions.todos.addTodo,
  }));
  addTodo('Install easy peasy');
  const dispatch = useDispatch();
  dispatch({
    type: 'ADD_FOO',
    payload: 'bar',
  });
  return (
    <button> login({ username: 'foo', password: 'bar' })}&gt;
      {token || 'Log in'}
    </button>
  );
github moltin / shopkit / src / components / BuyButton.js View on Github external
function BuyButton({
  moltinProductId,
  moltinOpenCart,
  moltinType,
  moltinText,
  ...props
}) {
  if (moltinType !== 'custom' && !moltinProductId) {
    console.warn('No product ID provided to Moltin Btn.')
    return null
  }

  const { addToCart } = useActions(({ cart }) => cart)
  const { goToCart } = useActions(({ modal }) => modal)

  function add() {
    moltinType !== 'custom'
      ? addToCart({ id: moltinProductId })
      : addToCart({
          type: 'custom_item',
          name: props.moltinProductName,
          sku: props.moltinProductSku,
          price: {
            amount: parseInt(props.moltinProductPrice, 10)
          }
        })

    moltinOpenCart && goToCart()
  }
github moltin / shopkit / src / components / Modal / index.js View on Github external
export default function Modal({ stripeKey }) {
  const { open, route } = useStore(({ modal }) =&gt; modal)
  const { closeModal } = useActions(({ modal }) =&gt; modal)
  const [stripeLoaded, stripeError] = useScript('https://js.stripe.com/v3')

  const ref = useRef()

  useOnClickOutside(ref, closeModal, open)

  if (stripeError) {
    console.error(stripeError)
    return null
  }

  if (stripeLoaded &amp;&amp; !stripeError) {
    return (
github moltin / shopkit / src / components / Checkout.js View on Github external
function Checkout({ stripe }) {
  const [initialValues, setInitialValues] = useState({
    billingIsShipping: true
  })
  const [paid, setPaid] = useState(false)
  const [order, setOrder] = useState(null)
  const { route } = useStore(({ modal }) => modal)
  const { id: cartId, subTotal } = useStore(({ cart }) => cart)
  const { createOrder, payForOrder, setDirty } = useActions(
    ({ checkout }) => checkout
  )
  const { goToBilling, goToShipping } = useActions(({ modal }) => modal)
  const { deleteCart } = useActions(({ cart }) => cart)

  function validate(values) {
    if (route === 'shipping') {
      return shippingValidation(values)
    } else {
      return billingValidation(values)
    }
  }

  async function onSubmit(values) {
    if (route === 'shipping') {
      setInitialValues(values)
github moltin / shopkit / src / components / Modal / Header.js View on Github external
export default function Header({ route }) {
  const { closeModal, goToCart, goToShipping } = useActions(
    ({ modal }) => modal
  )
  const { dirty, completed } = useStore(({ checkout }) => checkout)
  const { loggedIn } = useStore(({ user }) => user)

  const handleClick = async () => {
    switch (route) {
      case 'billing':
        if (completed) {
          return closeModal()
        }

        return goToShipping()

      case 'shipping': {
        if (!completed && dirty) {
github moltin / shopkit / src / components / CartItemList.js View on Github external
export default function CartItemList({ items, promotionItems }) {
  const { updateItem, removeItem, addPromotion } = useActions(
    ({ cart }) =&gt; cart
  )

  return (
    
      
        {items.map(item =&gt; (
          
        ))}
github moltin / shopkit / src / components / Cart.js View on Github external
export default function Cart() {
  const { isEmpty, cartItems, promotionItems, subTotal, count } = useStore(
    ({ cart }) =&gt; cart
  )
  const { goToShipping } = useActions(({ modal }) =&gt; modal)

  return (
    
      
        Your shopping cart
      

      {isEmpty ? (
        Your cart is empty
      ) : (
github moltin / shopkit / src / components / LoginButton.js View on Github external
function LoginButton({ text }) {
  const { goToLogin } = useActions(({ modal }) =&gt; modal)

  return (
    
      {text}
    
  )
}