Return multiple actions from useStoreActions?

So while the naming of useStoreActions would imply you can return multiple actions from a single call, is that safe/performant to do?

For example:

  const { attachPaymentMethod, submit } = useStoreActions(x => ({
    attachPaymentMethod: x.attachPaymentMethod,
    submit: x.submit
  }))

I ask because it seems to be recommended that you return only a single value from useStoreState, so wandered if the same applies?

thx

[joelmoss]

That is one way, but I think that being able to pass a custom equality function to useStoreState is far more flexible…

const equalityFunction = (newState, oldState) => {
  // Some equality check here to compare newState to oldState.
  // For example, we could use lodash's `isEqual`...
  return _.isEqual(newState, oldState)
}

useStoreState(state => ({ foo: state.foo, bar: state.bar }, equalityFunction)

If the equality function is not given, it uses the current strict equality check - maintaining the current functionility.

This obviously allows the user to perform any kind of comparison that they want without dictating too much.

[allpro]

useStoreState(state => ({ foo: state.foo, baz: !state.bar }), equalityFunction);

If you add the ability to pass an equality function like this, it would be nice to also accept an options-hash. I think most uses of this (possibly 99.99%!) would be shallow-equal. Rather than require a separate utility import for this basic need, an ‘equality type’ could be accepted, something like:

useStoreState(state => ({ foo: state.foo, baz: !state.bar }), { shallowEqual: true });

A shallow-equal method is just a couple lines of code so would not bloat the library.

Shallow-equal is the standard comparison offered by React (props/state) and React-Redux (mapStateToProps), so this would replicate that. Anything more complex can be handled by a custom equalityFunction.