is redux state name configurable?

[hasakilol]

I have a question:

Take dynamic-counters as the example, I run it in Chrom and use the redux extension to the check the state tree and find that it is like this:

Couter one
      countdown: 0
      counter: 0 
Couter two
      countdown: 0
      counter: 0 

I thought it would be:

counter
   Couter one
         countdown: 0
        counter: 0 
   Couter two
         countdown: 0
         counter: 0 

but it's not. How should I write the code to get my desired effect? Maybe need some work here?

export default dynamic('counter', attachReducer(counterInstanceReducer), runSaga(saga), subspaced())(CounterContainer)

Thanks.

[mpeyper]

At the moment there is no sanctioned way to do this. There has previously been discussions in #3 fixing a bug with the redux-subspace separator character (/) to make inserting arbitrary level in the hierarchy a bit easier, but it was never implemented.

You can fake it by carefully inserting a SubspaceProvider to introduce the artificial layer, but keep in mind that it's easier to get confused about which action/states needs the additional identifier and which don't (I had to mess around with it for about 15 mins trying to get it right myself).

In the end, for this example, it turned out be be just around the this.props.allIds loop in App.js

<SubspaceProvider mapState={state => state.counter || {}} namespace="counter">
  {this.props.allIds.map(id => {
    return (
      <div key={id}>
        <span>{id}</span>
        <DynaCounter id={id} />
        <br />
      </div>
    )
  })}
</SubspaceProvider>

If you were intending to use a similar pattern in a real app, I'd suggest not trying to force the state into the shape you want, but to rather let your component hierarchy dictate the shape for you.

[mpeyper]

Closing. Please see #484 for details.