Overwrite entire state in redux

Question

This is yet another novice question about redux. In my app, i would like to be able to load the state from a text file, i.e. to be able to completely re-initialise the whole state object. So I don't want to reset the state to an initial value, but replace it with a new one. (FYI the application stores data merely in the browser's localStorage. Also, so far I have followed the awesome tutorial from http://redux.js.org/docs/introduction/index.html) I have tried several approaches, but none of them have yielded results. For example, in my reducers/index.js i have:

export default function App (state = {}, action) {
  return {
    todos: todos(state.todos, action),
    ...
    global: global(state, action)
  }
}

In reducers/global.js I have:

const global = (state = {}, action) => {
  switch(action.type) {
    case 'LOAD_DB_FROM_FILE':
      return action.fileContents;
    default:
      return state
  }
}

What happens is that the state object, oddly (or not :)) enough, gets a new field called global which contains the original state (and not the one read from the file) and it even gets nested for a couple of levels (so i have a replica of the state at state.global.global.)

I am aware of the hackiness of this approach, even willing to accept a fundamental flaw (due to my ignorance) in my setup, still i haven't been able to find a simple and unambiguous answer to my problem.

As always, any help would be much appreciated.

Answer 1

I know little about redux, but based on what I know about JavaScript I would say you need something like this:

// reducers/index.js

export default function App (state = {}, action) {
  state = global(state, action);
  return {
    todos: todos(state.todos, action),
    ...
  };
}

So the reducer named global has a chance to replace the whole state object at once.