Should I store static configuration in redux?

reactjs, redux

Solution

My understanding of `redux` is that we should only be storing stateful data in the `store`, that is, data that is subject to change. Static data by definition does not have state, and therefore does not need to be tracked as such.

As a result, I typically have a `/common/app-const.js` file where I store these types of static objects. In your case, you can simply move all the static data from `exchange.js` into a common file that you then `import` wherever you need it.

/common/app-const.js

export default {
    markets: [
          { pair: ['USD', 'BTC'], minimalOrder: { amount: 0.01, unit: 'asset' } },
          { pair: ['RUR', 'BTC'], minimalOrder: { amount: 0.01, unit: 'asset' } },
          { pair: ['EUR', 'BTC'], minimalOrder: { amount: 0.01, unit: 'asset' } },
          ...
}

I understand your approach however, it would be nice to simply inject your data, by way of `connect()` via `react-redux`, however its a bit more straightforward to just `import` the static data from a file where needed.

Problem

I am building a react/redux web app and am wondering where I should static configuration information that never changes (while the webapp is running anyway). This is the data in question This information is used in different parts of the app, for example: there is a form where you are able to select any item out of the main array, and by doing so populating another select field with properties of the selected array: ``` <select>Choose an exchange</select> <select>Choose a market (that is available in the above exchange)</select> ``` This would lend itself nicely to some reducer logic (that sets `state.markets` based on what is selected in the first `select`), but should it filter based on other state in the tree, or just load the data in a closure inside the reducer (keeping everything unrelated outside of state tree)? Or is this not state at all (and should the container load this file in and filter based on a single `state.exchange` state prop)? When the form is filled in the result will be handled like: ``` {exchange: 'a', market: 'b'} ``` So that would be state too (I guess?)

Original source