Supporting the route switch in time travel debugging

package.json

@@ -33,7 +33,8 @@
     "redbox-react": "^1.3.6",
     "redux": "^3.6.0",
     "redux-thunk": "^2.2.0",
-    "whatwg-fetch": "^2.0.3"
+    "whatwg-fetch": "^2.0.3",
+    "react-router-redux": "4.0.8"
   },
   "devDependencies": {
     "babel-core": "^6.24.1",

src/components/App.js

@@ -2,6 +2,7 @@ import React from 'react'
 import { browserHistory, Router } from 'react-router'
 import { Provider } from 'react-redux'
 import PropTypes from 'prop-types'
+import { syncHistoryWithStore } from 'react-router-redux'
 
 class App extends React.Component {
   static propTypes = {
@@ -14,10 +15,11 @@ class App extends React.Component {
   }
 
   render () {
+    const history = syncHistoryWithStore(browserHistory, this.props.store)
     return (
       <Provider store={this.props.store}>
         <div style={{ height: '100%' }}>
-          <Router history={browserHistory} children={this.props.routes} />
+          <Router history={history} children={this.props.routes} />
         </div>
       </Provider>
     )

src/store/reducers.js

@@ -1,9 +1,11 @@
 import { combineReducers } from 'redux'
 import locationReducer from './location'
+import { routerReducer } from 'react-router-redux'
 
 export const makeRootReducer = (asyncReducers) => {
   return combineReducers({
     location: locationReducer,
+    routing: routerReducer,
     ...asyncReducers
   })
 }

yarn.lock

@@ -4797,6 +4797,10 @@ react-redux@^5.0.4:
     loose-envify "^1.1.0"
     prop-types "^15.0.0"
 
+[email protected]:
+  version "4.0.8"
+  resolved "https://registry.yarnpkg.com/react-router-redux/-/react-router-redux-4.0.8.tgz#227403596b5151e182377dab835b5d45f0f8054e"
+
 react-router@^3.0.0:
   version "3.0.5"
   resolved "https://registry.yarnpkg.com/react-router/-/react-router-3.0.5.tgz#c3b7873758045a8bbc9562aef4ff4bc8cce7c136"