Add PersistGate

packages/redux-devtools-app/src/index.tsx

@@ -1,33 +1,34 @@
 import React, { Component } from 'react';
 import { Provider } from 'react-redux';
 import { Store } from 'redux';
+import { Persistor } from 'redux-persist';
+import { PersistGate } from 'redux-persist/integration/react';
 import configureStore from './store/configureStore';
 import { CONNECT_REQUEST } from './constants/socketActionTypes';
 import App from './containers/App';
 import { StoreState } from './reducers';
-import { ConnectionOptions, StoreAction } from './actions';
+import { StoreAction } from './actions';
 
-interface Props {
+class Root extends Component {
-  socketOptions?: ConnectionOptions;
-}
-
-class Root extends Component<Props> {
   store?: Store<StoreState, StoreAction>;
+  persistor?: Persistor;
 
   UNSAFE_componentWillMount() {
-    this.store = configureStore();
+    const { store, persistor } = configureStore();
-    this.store.dispatch({
+    this.store = store;
+    this.persistor = persistor;
+    store.dispatch({
       type: CONNECT_REQUEST,
     });
-    this.forceUpdate();
   }
 
   render() {
     if (!this.store) return null;
-    const AppAsAny = App as any;
     return (
       <Provider store={this.store}>
-        <AppAsAny {...this.props} />
+        <PersistGate loading={null} persistor={this.persistor!}>
+          <App />
+        </PersistGate>
       </Provider>
     );
   }

packages/redux-devtools-app/src/store/configureStore.ts

@@ -44,6 +44,6 @@ export default function configureStore() {
     persistedReducer as any,
     composeEnhancers(applyMiddleware(exportState, api))
   );
-  persistStore(store);
+  const persistor = persistStore(store);
-  return store;
+  return { store, persistor };
 }