selectem

  

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

Before

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

After

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

Why tho?

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

Advanced

$3

Normally react-redux checks the number of arguments of mapStateToProps to determine whether or not to pass in an ownProps parameter [[1]](https://github.com/reactjs/react-redux/blob/master/docs/api.md#the-arity-of-mapstatetoprops-and-mapdispatchtoprops-determines-whether-they-receive-ownprops). We’ll do the same arity check as react-redux and pass ownProps to each selector that needs it. :+1:

$3

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.

$3

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:

`jsx
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