Merge pull request #2 from notrab/fix-change-route-dispatch

Fix changePage function

Author: notrab

package.json

@@ -6,11 +6,11 @@
     "react-scripts": "1.0.0"
   },
   "dependencies": {
-    "react": "^15.4.2",
-    "react-dom": "^15.4.2",
-    "react-redux": "^5.0.3",
-    "react-router": "^4.0.0",
-    "react-router-dom": "^4.0.0",
+    "react": "^15.5.4",
+    "react-dom": "^15.5.4",
+    "react-redux": "^5.0.5",
+    "react-router": "^4.1.1",
+    "react-router-dom": "^4.1.1",
     "react-router-redux": "next",
     "redux": "^3.6.0",
     "redux-thunk": "^2.2.0",

src/containers/app/index.js

@@ -1,5 +1,7 @@
 import React from 'react';
-import { Link } from 'react-router-dom'
+import { Route, Link } from 'react-router-dom'
+import Home from '../home'
+import About from '../about'
 
 const App = ({ children }) => (
   <div>
@@ -9,7 +11,8 @@ const App = ({ children }) => (
     </header>
 
     <main>
-      {children}
+      <Route exact path="/" component={Home} />
+      <Route exact path="/about-us" component={About} />
     </main>
   </div>
 )

src/containers/home/index.js

@@ -39,9 +39,7 @@ const mapDispatchToProps = dispatch => bindActionCreators({
   incrementAsync,
   decrement,
   decrementAsync,
-  changePage: () => {
-    dispatch(push('/about-us'))
-  }
+  changePage: () => push('/about-us')
 }, dispatch)
 
 export default connect(

src/index.js

@@ -1,12 +1,9 @@
 import React from 'react'
 import { render } from 'react-dom'
 import { Provider } from 'react-redux'
-import { Route } from 'react-router'
 import { ConnectedRouter } from 'react-router-redux'
 import store, { history } from './store'
 import App from './containers/app'
-import Home from './containers/home'
-import About from './containers/about'
 
 import 'sanitize.css/sanitize.css'
 import './index.css'
@@ -16,10 +13,9 @@ const target = document.querySelector('#root')
 render(
   <Provider store={store}>
     <ConnectedRouter history={history}>
-      <App>
-        <Route exact path="/" component={Home} />
-        <Route exact path="/about-us" component={About} />
-      </App>
+      <div>
+        <App />
+      </div>
     </ConnectedRouter>
   </Provider>,
   target