Are you fed up of hand coding the same pattern over and over again? Fed up of conflicting action names causing your button presses to set off your ajax loading animation? Are you a fan of having a strictly defined structure for your redux store, down to the type level? Then redux-scc may be for you!
#### What does it do?
It takes a defined structure and uses a set of 'behaviors' (a small collection of ways that a reducer can
be updated) to create a set of actions and reducer responses. A selector is also created for every reducer defined, and the set of action generators, selectors, and reducers are then returned.
The behaviors are purposefully simple, and do not do much extend beyond basic updating and resetting the store to the initial state. There are a couple of helper actions to make your life easier (shallow update for object, pop/push for arrays), but the main goal of this library is to produce a simple, dependable, basis for you to build complex functionality on top of, rather than tackle such functionality itself. If you think of redux-scc reducers as a very crude database, with actions providing a limited set of ways to interact and selectors providing simple queries, then you'll be in a great place to start taking advantage of it!
buildStoreChunk takes a name and a structure (more on that later) and will return an object with the properties reducers, actions, and selectors.
The reducers property is simple! It is an object with the top level properties matching up to the top level of the structure you defined. You simply assign/spread that object into your top level store and away you go!
The actions and selectors object follow the defined structure and will contain actions and selectors, respectively, at the leaves of the structure.
Types are the building blocks of the structure, and should be fairly familiar to you if you're used to using React's PropTypes. At the moment, redux-scc offers a cut down version of the various PropTypes:
The types are roughly divided into two categories: simple types (which do not have any internal structure to deal with), and complex types (which do). The structure of complex types is built up using a combination of objects containing Types, or Types. Examples can be found below.
Automatically generating these actions is a nice time saver, but an issue with them at the moment is that, if you want to update several parts of the store,
these actions will need to be dispatched individually. This makes 'time travel' in Redux much more difficult, as the
various updates occur individually and cannot easily be rolled back. Additionally, each update will result in redux informing subscribers of
an update! Redux-scc avoids this by providing `batchUpdate`.
batchUpdate takes a name (so you can easily identify the action in the redux dev tools), and an array of redux-scc actions. These
actions will be performed as part of one redux update, thus avoiding the unfortunate side effects mentioned above.
```
const anExampleBatchUpdate = batchUpdate({
name: 'an example!',
actions: [
actions.someReduxSccReducer.reset(),
actions.anotherReduxSccReducer.replace('foo!'),
],
});
```
If a reducer is affected by the actions multiple times, the actions will play out sequentially.
```
//We start with the reducer (which is an array type reducer) having state: [4,5,6]
As we are not creating a nested reducer structure, the actions and selectors returned are not nested either - simply referring to the created reducer directly.
A more common pattern you may have come across is the idea of combining reducers to more easily manage a certain chunk of the store. It allows you to operate on certain data structures without worrying about the impact on other parts of the store. Redux-scc is designed to handle this, up to any level of arbitrary nesting you'd like!