How to add multiple reducers

I’m trying to add a reducer to the generated application, but haven’t had much luck.

What I’d like to do is separate out my reducers. I modified the file below with two reducers, but whatever I try doesn’t work properly. Each was using a different state object it seemed. I modified case actionTypes.FIELD_UPDATE with what I want to happen in my test and it working as expected, but every time the state changes I wanted the recalculate reducer to run.

Given the way things are setup

import Immutable from 'immutable';

import * as actionTypes from '../constants/volumesConstants.jsx';

// this is the default state that would be used if one were not passed into the store
export const $$initialState = Immutable.fromJS({
  volume: 1000,
  grain: 5,
  calculation: 'standard', // Standard or metric
  batchSize: 0.0,
  hopsAmount: 0.0,
  hopsAbsorptionRate: .0365, //0.031,
  grainWeight: 0.0,
  grainAbsorption: 0.0, //  0.1 - 0.125 gallons of water.
  grainTemperature: 0.0,
  boilOffRate: 0.0,
  boilDuration: 0.0,
  mashTemperature: 0.0
});

export function volumesReducer($$state = $$initialState, action) {
  const { type, id, value } = action;

  switch (type) {
    case actionTypes.FIELD_UPDATE: {
      return $$state.withMutations(function(state) {
        state.set(id, value);
        state.set('total', Number(state.get('grain')) * 10)
      });
    }

    default: {
      return $$state;
    }
  }
}

export function recalculate($$state = $$initialState, action) {
  return $$state.set('total', Number($$state.get('grain')) * 10);
}
1 Like

Hi @martyphee, can you create sample repo, so I can see the whole picture. Now I can’t tell where is the problem, b/c I don’t see how you structure your app outside of reducer file (how you compose your store, how you render the app etc.).

1 Like

@alexfedoseev Thank you for responding. I was trying to delete this post previously. My app is based off the default app layout generated by react_on_rails. It might be more my misunderstanding of reducers. I was trying to add another one to the Hello World example under ./reducers.

Ideally I would like to create multiple reducers to separate the logic. Given the default application layout how would I add one to the Hello World sample app?

Here is a default RoR app with react_on_rails.

1 Like

@martyphee for multiple reducers, simply add to the right directory and the index.js file, as shown here:

Thank you. It turned out to be misunderstanding of how Reduxed worked. I thought I could daisy chain reducers together to work on the state.

thank you for getting back to me.

1 Like

It took me a while to figure out from the 3.0.5 docs what the difference was between registering using registerStore() for use by multiple Providers and the single-store use of the Provider component with createStore(). I think the documentation on that could be a little more explicit. (Like: “in the clientRegistration.jsx file of the store to be shared, you need to use registerStore, and in all Provider components to share the store (e.g. <filename.jsx>, you need to replace calls to createStore() with getStore().”)

I think anything that requires reasoning across bundles is a little difficult to figure out just from following the repository because the repository only has one bundle.

1 Like