From 166cbd201a3f24f72a3d5ad1e2f679699864244f Mon Sep 17 00:00:00 2001
From: SamR1 <samira.rabaaoui@coding-academy.fr>
Date: Sun, 17 Dec 2017 14:33:04 +0100
Subject: [PATCH] Client: handling Link w/o page refresh

need to update "react-router-redux" to "^5.0.0-alpha.9" to avoid errors (undefined ConnectedRouter)
---
 mpwo_client/package-lock.json         | 11 ++++++++---
 mpwo_client/package.json              |  2 +-
 mpwo_client/src/components/NavBar.jsx | 10 +++++++++-
 mpwo_client/src/components/Root.jsx   | 11 +++++++++++
 mpwo_client/src/index.js              |  6 +++---
 5 files changed, 32 insertions(+), 8 deletions(-)
 create mode 100644 mpwo_client/src/components/Root.jsx

diff --git a/mpwo_client/package-lock.json b/mpwo_client/package-lock.json
index 14dda483..89702d90 100644
--- a/mpwo_client/package-lock.json
+++ b/mpwo_client/package-lock.json
@@ -9332,9 +9332,14 @@
       }
     },
     "react-router-redux": {
-      "version": "4.0.8",
-      "resolved": "https://registry.npmjs.org/react-router-redux/-/react-router-redux-4.0.8.tgz",
-      "integrity": "sha1-InQDWWtRUeGCN32rg1tdRfD4BU4="
+      "version": "5.0.0-alpha.9",
+      "resolved": "https://registry.npmjs.org/react-router-redux/-/react-router-redux-5.0.0-alpha.9.tgz",
+      "integrity": "sha512-euSgNIANnRXr4GydIuwA7RZCefrLQzIw5WdXspS8NPYbV+FxrKSS9MKG7U9vb6vsKHONnA4VxrVNWfnMUnUQAw==",
+      "requires": {
+        "history": "4.7.2",
+        "prop-types": "15.6.0",
+        "react-router": "4.2.0"
+      }
     },
     "react-scripts": {
       "version": "1.0.17",
diff --git a/mpwo_client/package.json b/mpwo_client/package.json
index 005a02d9..c7864fc8 100644
--- a/mpwo_client/package.json
+++ b/mpwo_client/package.json
@@ -8,7 +8,7 @@
     "react-dom": "^16.2.0",
     "react-redux": "^5.0.6",
     "react-router-dom": "^4.2.2",
-    "react-router-redux": "^4.0.8",
+    "react-router-redux": "^5.0.0-alpha.9",
     "react-scripts": "1.0.17",
     "redux": "^3.7.2",
     "redux-thunk": "^2.2.0"
diff --git a/mpwo_client/src/components/NavBar.jsx b/mpwo_client/src/components/NavBar.jsx
index 42479f58..edf6dd68 100644
--- a/mpwo_client/src/components/NavBar.jsx
+++ b/mpwo_client/src/components/NavBar.jsx
@@ -1,4 +1,5 @@
 import React from 'react'
+import { Link } from 'react-router-dom'
 
 export default class NavBar extends React.Component {
   constructor(props) {
@@ -26,7 +27,14 @@ export default class NavBar extends React.Component {
         <div className="collapse navbar-collapse" id="navbarSupportedContent">
           <ul className="navbar-nav mr-auto">
             <li className="nav-item">
-              <a className="nav-link" href="/">Home</a>
+              <Link
+                className="nav-link"
+                to={{
+                  pathname: '/',
+                }}
+              >
+                Home
+              </Link>
             </li>
           </ul>
         </div>
diff --git a/mpwo_client/src/components/Root.jsx b/mpwo_client/src/components/Root.jsx
new file mode 100644
index 00000000..54f02b86
--- /dev/null
+++ b/mpwo_client/src/components/Root.jsx
@@ -0,0 +1,11 @@
+import React from 'react'
+import { Provider } from 'react-redux'
+import { ConnectedRouter } from 'react-router-redux'
+
+export default function Root({ store, history, children }) {
+  return (
+    <Provider store={store}>
+      <ConnectedRouter history={history}>{children}</ConnectedRouter>
+    </Provider>
+  )
+}
diff --git a/mpwo_client/src/index.js b/mpwo_client/src/index.js
index bb764612..a4516d9d 100644
--- a/mpwo_client/src/index.js
+++ b/mpwo_client/src/index.js
@@ -2,12 +2,12 @@
 import { createBrowserHistory } from 'history'
 import React from 'react'
 import ReactDOM from 'react-dom'
-import { Provider } from 'react-redux'
 import { routerMiddleware } from 'react-router-redux'
 import { applyMiddleware, createStore, compose } from 'redux'
 import thunk from 'redux-thunk'
 
 import App from './components/App'
+import Root from './components/Root'
 import registerServiceWorker from './registerServiceWorker'
 import reducers from './reducers'
 
@@ -25,9 +25,9 @@ export const store = createStore(
 )
 
 ReactDOM.render(
-  <Provider store={store} history={history}>
+  <Root store={store} history={history}>
     <App />
-  </Provider>,
+  </Root>,
   rootNode
 )
 registerServiceWorker()