Wix React-Native-Navigation v2 and redux-persist
This is how I handle redux, redux persists and wix v2 react-native-navigation
In your store.js
import {createStore,applyMiddleware} from "redux";
import rootReducer from './reducers/RootReducer';
import thunk from 'redux-thunk';
import {persistStore, persistReducer} from 'redux-persist';
import {compact} from "lodash";
import storage from 'redux-persist/lib/storage';
const persistConfig = {
key: 'app',
storage,
};
const persistedReducer = persistReducer(persistConfig, rootReducer);
const middleware =compact([
thunk.withExtraArgument()
]);
export const store = createStore( persistedReducer,applyMiddleware(...middleware));
export const persistor = persistStore(store);
Then in your navigation.js
or where you basically registering the screens
import React from "react";
import {Navigation} from "react-native-navigation";
import {Provider} from 'react-redux';
import {PersistGate} from 'redux-persist/integration/react'
import {store, persistor} from "./config/store"; //Check this line
function WrappedComponent(Component) {
return function inject(props) {
const EnhancedComponent = () => (
<Provider store={store}>
<PersistGate loading={null} persistor={persistor}>
<Component {...props}/>
</PersistGate>
</Provider>
);
return <EnhancedComponent />;
};
}
// Then your normal registration
export function registerScreens() {
Navigation.registerComponent("Initializing", () =>
WrappedComponent(InitializingScreen)
);
Navigation.registerComponent("SignIn", () => WrappedComponent(SignInScreen));
...
}