Redux-persist with immutable map not persisting state changes - state

Question

I am using redux-persist with my entire state tree being stored as an immutable map as shown in my store.js file code below.
import {persistReducer, persistStore} from 'redux-persist';
import storage from 'redux-persist/lib/storage';
import autoMergeLevel1 from 'redux-persist/lib/stateReconciler/autoMergeLevel1'
import { Record } from 'immutable';
import immutableTransform from 'redux-persist-transform-immutable';
const history = createHistory();
const middlewares = [thunk, sagaMiddleware, routeMiddleware, ReduxPromise];
// some imports omitted in the interest of brevity.
let persistor;
const MyRecord = Record({
App : {},
Auth : {},
Box : {},
Calendar : {},
Cards : {},
Contacts : {},
Course : {},
DynamicChartComponent : {},
Ecommerce : {},
LanguageSwitcher : {},
Mails : {},
Notes : {},
ThemeSwitcher : {},
Todos : {},
User : {},
YoutubeSearch : {},
githubSearch : {}
}, 'MyRecord')
const persistConfig = {
transforms: [immutableTransform({records: [MyRecord]})],
key: 'root',
storage,
stateReconciler: autoMergeLevel1
}
const persistedReducer = persistReducer(persistConfig, combineReducers({
...reducers,
router: routerReducer
}));
const loggerMiddleware = createLogger({
predicate: () => process.env.NODE_ENV === 'development',
});
middlewares.push(loggerMiddleware);
export default () => {
let store = createStore(persistedReducer, compose(applyMiddleware(...middlewares), reduxReset()))
sagaMiddleware.run(rootSaga);
persistor = persistStore(store);
return { store, history, persistor }
}
export function getPersistor() {
return persistor;
}
My Problem is that even after I make changes to the state tree (which I have confirmed, do in fact take place as they should, using redux logger), the changes aren't shown in my application on refresh despite the fact that I call persistor.flush() like this:
export function* materialUpdate() {
yield takeEvery(actions.COURSE_MAT_UPDATE, function*() {
let secs = 2;
while (secs > 0) {
yield call(delay, 1000);
secs--;
}
// const flushData = persistor => persistor.flush();
// const persistor = yield call(getPersistor);
yield put(getPersistor().flush);
});
}
right after the state change (Also verified that that the flush action fires). I've tried everything and I would really appreciate any advice whatsoever, on the matter. Thanks in advance.