title: React Native with Redux-Persist , PersistGate inifinite loading
body: <p>I'm working on an app in react native and must work with Redux-Persist. I have the store configuration set up, no errors occur but the rehydration never happens and the persistentGate is infinitely in the loading state. </p>
  
  <p>Here is my store.js</p>
  
  <pre><code>import { createStore, combineReducers } from 'redux';
  import { persistStore, persistReducer } from 'redux-persist';
  import storage from 'redux-persist/lib/storage';
  import  entriesReducer from './reducers/entries';
  
  import autoMergeLevel2 from 'redux-persist/lib/stateReconciler/autoMergeLevel2';
  
  const rootReducer = combineReducers({
      entries : entriesReducer
  });
  
  const persistConfig = {
      key: 'root',
      storage: storage,
      stateReconciler: autoMergeLevel2 // see "Merge Process" section for details.
     };
  
     const pr = persistReducer(persistConfig, rootReducer);
  
  
  const configureStore = () =&gt; {
      const store = createStore(rootReducer);
      const persistor = persistStore(store);
      return { persistor, store };
    };
  
    export default configureStore;
  </code></pre>
  
  <p>And my index.js</p>
  
  <pre><code>import React from 'react';
  import { AppRegistry } from 'react-native';
  import {Provider} from 'react-redux';
  import App from './App';
  import configureStore from './src/store/configureStore';
  import { PersistGate } from 'redux-persist/lib/integration/react';
  
  const store = configureStore();
  
  const RNRedux = () =&gt; (
      &lt;Provider store={store.store}&gt;
  
      &lt;PersistGate loading={&lt;App /&gt;} persistor={store.persistor}&gt;
  
          &lt;App/&gt;
  
      &lt;/PersistGate&gt;
      &lt;/Provider&gt;
  );
  AppRegistry.registerComponent('PTM', () =&gt; RNRedux);
  </code></pre>
  
  <p>Any help will be very much appreciated, I've been trying to set this up for days now with no success. Previously I would have to deal with errors but now I don't see any and it still refuses to work, I simply don't know where to look for the fault. </p>
  
  <p>Edit: 
  App.js file</p>
  
  <pre><code>import React from 'react';
  import { View, Text, Button, StatusBar } from 'react-native';
  import { StackNavigator } from 'react-navigation'; 
  import {connect} from 'react-redux';
  
  import NavBar from './src/components/NavBar/NavBar';
  import DayPicker from './src/components/DayPicker/DayPicker';
  import TotalTime from './src/components/TotalTime/TotalTime';
  
  import HomeScreen from './screens/HomeScreen';
  import DetailsScreen from './screens/DetailsScreen';
  import EntriesList from './src/components/EntriesList/EntriesList';
  
  
  var x = null;
  
  const RootStack = StackNavigator(
    {
      Home: {
        screen: HomeScreen,
      },
      Details: {
        screen: DetailsScreen,
      },
    },
    {
      initialRouteName: 'Home',
    }
  );
  
  export default class App extends React.Component {
    render() {
      return &lt;RootStack /&gt;;
    }
  }
  </code></pre>
  
  <p>And my HomeScreen is using this:</p>
  
  <pre><code>const mapStateToProps = state =&gt; {
        return {
          data : state.entries.data,
          entriesPerDay : state.entries.entriesPerDay, 
          pickedDate : state.entries.pickedDate,
          total: state.entries.total
        };
    };
  
    const mapDispatchToProps = dispatch =&gt; {
        return {
            onPickDate: (day) =&gt; dispatch(pickDay(day)),
            onDataSet: (data) =&gt; dispatch(setData(data))
        };
    };
  
    export default connect(mapStateToProps, mapDispatchToProps)(HomeScreen);
  </code></pre>