How to use the easy-peasy.useStore 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 })
github ctrlplusb / easy-peasy / src / __tests__ / typescript / hooks.ts View on Github external
actionImp: Action;
    thunkImp: Thunk;
  };
}

let dispatch = useStoreDispatch();
dispatch({ type: 'FOO' });

let useStoreResult = useStoreState((state: State) => state.stateNumber);
useStoreResult + 1;
let useActionResult = useStoreActions(
  (actions: Actions) => actions.actionImp,
);
useActionResult(1);

let store = useStore();
store.getState().stateString + 'world';

const typedHooks = createTypedHooks();

useStoreResult = typedHooks.useStoreState(state => state.stateNumber);
useStoreResult + 1;
useActionResult = typedHooks.useStoreActions(actions => actions.actionImp);
useActionResult(1);
dispatch = typedHooks.useStoreDispatch();
dispatch({
  type: 'FOO',
});
store = typedHooks.useStore();
store.getState().stateString + 'world';

let actionNoPayload = typedHooks.useStoreActions(
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 / 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) {
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 / 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 / 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) {
          const proceed = confirm(
            'Are you sure you want to abandon your checkout?'
          )
github monsieurBoutte / react-pwa-boilerplate / src / hooks / auth-hook.js View on Github external
export const useAuth = () => {
  const auth = useStore(state => state.auth);
  const cachedAuth = JSON.parse(localStorage.getItem('auth')) || {
    auth: initialState
  };
  return {
    auth,
    cachedAuth
  };
};