Integrating With Redux-Persist

[mcglabs]

How would one go about integrating redux-persist into this project? I've followed all the instructions and the app runs with no errors, except the state resets with each reload.

This is run in snowflake.js and console logs 'restored'

const store = configureStore(getInitialState()); const persistor = persistStore(store, {whitelist: ['activities'], storage: AsyncStorage}, () => { console.log('restored'); });

This is also included in render: <Provider store={store} persistor={persistor}>

Any advice would be helpful, thanks!

[bartonhammond]

Sorry - I have no idea as I've not used it.

[bartonhammond]

If you figure it out, you could make a PR?

[bartonhammond]

From another project I found this that might help you:

/* @flow */

'use strict';

import {createStore, applyMiddleware, compose} from 'redux'
import devTools from 'remote-redux-devtools'
import thunk from 'redux-thunk'
import reducer from './reducers'
import {autoRehydrate, persistStore} from 'redux-persist'
import {AsyncStorage} from 'react-native'
import promise from './promise';

export default function configureStore(onCompletion:()=>void):any {
    const enhancer = compose(
        applyMiddleware(thunk, promise),
        autoRehydrate(),
        devTools(),
    );

    let store = createStore(reducer, enhancer);
    persistStore(store, {storage: AsyncStorage}, onCompletion);

    return store
}

[mcglabs]

Thanks for the suggestion! I've tried all available configurations suggested around the webs, and nothing seems to work. It seems initialState values override on each reload. Was going to abandon this approach for the react-native-simple-store approach but seems it would disrupt the redux design pattern to utilize in the reducer or not even channel it to through actions/reducer.

Trying to figure out why the docs say it's as simple as (with of course the applyMiddleware and using AsyncStorage):
import {persistStore, autoRehydrate} from 'redux-persist' const store = createStore(reducer, undefined, autoRehydrate()) persistStore(store)

What is exceptional about this project that would cause it not to work? Maybe you've got another suggestion for how to persist state.

[bartonhammond]

Maybe that each of the reducers default the initial state, for instance, look at reducers/auth/authReducer.js. Maybe there is no initial state provided? You may have to get that initial state from where redux-persist stores it?

[mcglabs]

There's some good info here: redux-persist/issues/64. End comment refers to redux-persist-transform-immutable

You're prob a lil more familiar with ImmutableJs and this project than me - any advice gleaned from these references would be great!

[mcglabs]

It's being persisted here as the response:

persistStore(store, {whitelist: ['activities'], storage: AsyncStorage}, (err, res) => { console.log(res); });

[mcglabs]

I've resolved this - will document how shortly.

[bartonhammond]

Great! It's a lot of code to wrangle with - good job! I look forward to seeing your solution in a PR.

[wookiem]

Yeah, this will be great 👍 . I've been using Google Realm as my local store, but it's added a lot of extra programming complexity. I'm going to swiftly jettison Realm once you submit your PR.

[mcglabs]

Great! Any suggestion on what to persist?

In the meantime here's the instruction on how to implement:

npm install redux-persist

In configureStore:

import {AsyncStorage,} from 'react-native';
import { createStore, applyMiddleware, compose } from 'redux';
import { persistStore, autoRehydrate, getStoredState } from 'redux-persist'

const enhancer = compose(
  applyMiddleware(
    thunk
  ),
  autoRehydrate(),
);

export default function configureStore(initalState) {
  const store = createStore(
    reducer,
    initalState,
    enhancer
  );
  //whitelist I believe is optional
  persistStore(store, {whitelist: ['redcuer0', 'reducer1', '...'], storage: AsyncStorage});
  return store;
}

In reducer:

import {REHYDRATE} from 'redux-persist/constants';

case REHYDRATE:
   if(condition(optional)){
     return state.setIn(['record', 'subValue0'], action.payload.record).setIn(['record','subValue1'], action.payload.record);
     //return state.merge(action.payload.reducer) I believe will persist complete store
  }

[bartonhammond]

I think the data returned from Login which contains session token for authentication. You can use that to keep the user from having to log in every time. You'll have to look at the Auth Actions & Reducer to make sure it is saved and restored appropriately.

Do you plan to make a PR for this?

[mcglabs]

I'd be delighted to, though kind of slammed on several projects at the moment, and would prefer to take a adequate time to better understand auth and implement proper mod -- also It's only working on ios, and not tested on android at the moment. Would hate to hold this up if you're eager and prefer this done quickly.

[bartonhammond]

I'm in no hurry. I am battling health issues. It's best to get it working on both devices and take the time to do it right. When you get to it is up to you. No problem.

[mcglabs]

Definitely agree and will comply. Sry to hear about your health issues - hope it's not too serious and you have a positive outcome. Really appreciate your work and responsiveness!

[bartonhammond]

Thanks. Dealing w/ 4 total knee replacement operations due to infections and can only bend my knee 60 degrees. It will take months to get to 90. Then they found thyroid cancer. Will have 2nd surgery for that next week. It's hell getting old but I'm in good hands. Thanks for your well wishes!

[mcglabs]

Absolutely. Hurts when a fellow craftsman is in peril, and that's quite a load of circumstances. Gladly thyroid prognosis is typically positive, the knee stuff is just a pain. You may want to look into ketogenic diet - has interesting affect on cancer development (suggested has to do with ultra low sugar intake), weight loss is dramatic (many health benefits there), energy levels are more consistent, as well as other benefits.

Will be thinking of best approach for PR and will refer to you on possible strategies.

[bartonhammond]

Interesting - I've been on the ketogenic now for about 4 months and have lost 25 lbs and not gone hungry. I actually like this way of eating - I was able to get off my acid reflux medication. I also quit drinking but that's only been a month.

Good luck..

[rbmedia]

For redux-persist implementation, I found this sample:
react-native-starter-kit - https://github.com/philipshurpik/react-native-starter-kit

Barton, we are following in the family also a complex medical path, your open attitude and positiveness will help a lot. We learned a lot about ourselves the last years!

[bartonhammond]

@rbmedia sorry to hear you're having struggles w/ health issues. I keep seeing other veterans who were injured in some war and I know that I am going through nothing compared to their ordeals. It keeps me positive too. They inspire me!

[bartonhammond]

I'm staying w/ react-native-simple-store- it's working just fine.