Skip to content

Shorthand for react-redux’s mapStateToProps. Need some props? Just select 'em!

License

Notifications You must be signed in to change notification settings

sibnerian/selectem

Repository files navigation

selectem

Build Status Coverage Status npm version

Shorthand for react-redux’s mapStateToProps. Need some props? Just select 'em!

Before

const mapStateToProps = (state) => ({
  foober: fooberSelector(state),
  goober: gooberSelector(state),
  anotherProp: anotherPropSelector(state),
  youGetTheIdea: youGetTheIdeaSelector(state),
});

a dude banging his keyboard, clearly frustrated

After

const mapStateToProps = selectem({
  fooberSelector,
  gooberSelector,
  anotherPropSelector,
  youGetTheIdeaSelector,
});

a cool kid on a computer giving the thumbs up

Why tho?

  • Avoid typos
  • Write less characters
  • DRY up your code
  • Why not?

Advanced

What if my selectors need ownProps?

Normally react-redux checks the number of arguments of mapStateToProps to determine whether or not to pass in an ownProps parameter [1]. We’ll do the same arity check as react-redux and pass ownProps to each selector that needs it. 👍

I want to give one of my props a custom name! Can it be done?

Yes, only props that end in "Selector" will be renamed! If you give a prop a custom name it will just get passed through automatically.

I have a complicated mapStateToProps function but I still hate typing.

It happens - particularly if you need per-instance memoization. selectem is pretty simple, so you can mix it in with standard mapStateToProps syntax without too much trouble:

const mapStateToProps = () => {
  // some complicated memoization stuff
  return (state, ownProps) => ({
    someProp: myPerInstanceMemoizedSelector(state, ownProps),
    ...selectem({
      fooSelector,
      barSelector,
      bazSelector,
    })(state, ownProps),
  });
};

This basically boils down to calling the selectem function using (state, ownProps) as arguments. I'm not sure if this is actually nicer than just typing it out, but it works!

License

MIT

About

Shorthand for react-redux’s mapStateToProps. Need some props? Just select 'em!

Topics

Resources

License

Stars

Watchers

Forks

Packages

No packages published