Need to merge with updated defaultState

[jrdn91]

If I add new things to a reducer, if that reducer was persisted to local storage it's not being merged with the new things being added to the reducer.

Am I misunderstanding the merge property in the docs? Or is this not something this library is meant to do at all?

[yoloVoe]

I have the same issue as you. It's because of the way merge is defined in mergePersistedState. It uses Object.assign, which doesn't work recursively (so doesn't care about nested objects).

UPDATE: I might have been looking at the wrong version. The correct code is here: https://github.com/elgerlambert/redux-localstorage/blob/master/src/util/mergeState.js

Honestly, at this point, you might want to consider reimplementing the library yourself for two reasons:

• This library doesn't seem well maintained
• This library doesn't do much; might as well write it yourself so its more customizable

UPDATE: Found a quicker fix. Have a case in your reducer for INIT/local-storage or whatever the action type of the local storage initialization is.

[nikksan]

I am having the same issue, merge callback is invoked with the initialState and not with the updated default one.

UPDATE This issue can be fixed by creating your initial state instead of supplying the default empty object. Simply export the default state in the reducer and use it to create the initial state.

// configureStore.js
import propReducer, { initialState as propInitialState } from './propReducer';

const initialState = {
    prop: propInitialState
}

const store = createStore(
  rootReducer,
  initialState,
  compose([ persistImmutableState(['prop']) ])
);

// propReducer.js
export const initialState = {
    bar: 'foo'
}

export default function propReducer(state = initialState) {
    // logic
}