Made redux store fully immutable

7 files changed, 59 insertions, 7 deletions

diff --git a/frontend/package.json b/frontend/package.json
index 574e1c1c..6151c09b 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -16,9 +16,11 @@
     "react-router-redux": "^4.0.7",
     "rebass": "^0.3.3",
     "redux": "^3.6.0",
+    "redux-immutable": "^3.0.10",
     "redux-saga": "^0.14.3",
     "redux-saga-router": "^1.1.0",
     "reflexbox": "^2.2.3",
+    "reselect": "^2.5.4",
     "sockjs-client": "latest",
     "webstomp-client": "^1.0.3"
   },
diff --git a/frontend/src/containers/gameBrowser.js b/frontend/src/containers/gameBrowser.js
index bc3933fa..11cadcf6 100644
--- a/frontend/src/containers/gameBrowser.js
+++ b/frontend/src/containers/gameBrowser.js
@@ -40,8 +40,8 @@ class App extends Component {
 }
 
 const mapStateToProps = (state) => ({
-  username: state.players.get('all').get(state.players.get('current')).get('displayName'),
-  games: state.games
+  username: state.get('players').get('all').get(state.get('players').get('current')).get('displayName'),
+  games: state.get('games')
 })
 
 
diff --git a/frontend/src/index.js b/frontend/src/index.js
index 1959b14a..08f257f3 100644
--- a/frontend/src/index.js
+++ b/frontend/src/index.js
@@ -4,6 +4,7 @@ import React from 'react'
 import ReactDOM from 'react-dom'
 import { Router } from 'react-router'
 import { Provider } from 'react-redux'
+
 import configureStore from './store'
 import { routes } from './routes'
 
diff --git a/frontend/src/reducers.js b/frontend/src/reducers.js
index 9befff13..097f9243 100644
--- a/frontend/src/reducers.js
+++ b/frontend/src/reducers.js
@@ -1,5 +1,20 @@
-import { combineReducers } from 'redux'
-import { routerReducer } from 'react-router-redux'
+import { combineReducers } from 'redux-immutable'
+
+// react-router-redux immutable reducer
+import { fromJS } from 'immutable'
+import { LOCATION_CHANGE } from 'react-router-redux'
+
+const initialState = fromJS({
+  locationBeforeTransitions: null
+})
+
+const routerImmutableReducer = (state = initialState, action) => {
+  if (action.type === LOCATION_CHANGE) {
+    return state.set('locationBeforeTransitions', action.payload)
+  }
+
+  return state
+}
 
 import gamesReducer from './redux/games'
 import playersReducer from './redux/players'
@@ -7,7 +22,7 @@ import playersReducer from './redux/players'
 export default function createReducer() {
   return combineReducers({
     games: gamesReducer,
-    routing: routerReducer,
+    routing: routerImmutableReducer,
     players: playersReducer,
   })
 }
diff --git a/frontend/src/redux/app.js b/frontend/src/redux/app.js
new file mode 100644
index 00000000..172dc960
--- /dev/null
+++ b/frontend/src/redux/app.js
@@ -0,0 +1,15 @@
+export const makeSelectLocationState = () => {
+  let prevRoutingState;
+  let prevRoutingStateJS;
+
+  return (state) => {
+    const routingState = state.get('routing')
+
+    if (!routingState.equals(prevRoutingState)) {
+      prevRoutingState = routingState
+      prevRoutingStateJS = routingState.toJS()
+    }
+
+    return prevRoutingStateJS;
+  }
+}
diff --git a/frontend/src/store.js b/frontend/src/store.js
index e028bac1..2000d706 100644
--- a/frontend/src/store.js
+++ b/frontend/src/store.js
@@ -1,10 +1,12 @@
 import { createStore, applyMiddleware, compose } from 'redux'
 import { browserHistory } from 'react-router'
 import { syncHistoryWithStore, routerMiddleware } from 'react-router-redux'
+import { fromJS } from 'immutable'
 
 import createReducer from './reducers'
 import createSagaMiddleware from 'redux-saga'
 import rootSaga from './sagas'
+import { makeSelectLocationState } from './redux/app'
 
 export default function configureStore(initialState = {}) {
   const sagaMiddleware = createSagaMiddleware()
@@ -26,7 +28,7 @@ export default function configureStore(initialState = {}) {
 
   const store = createStore(
     createReducer(),
-    initialState,
+    fromJS(initialState),
     composeEnhancers(...enhancers)
   )
 
@@ -34,6 +36,8 @@ export default function configureStore(initialState = {}) {
 
   return {
     store,
-    history: syncHistoryWithStore(browserHistory, store)
+    history: syncHistoryWithStore(browserHistory, store, {
+      selectLocationState: makeSelectLocationState()
+    })
   }
 }
diff --git a/frontend/yarn.lock b/frontend/yarn.lock
index 0148efbc..a7556445 100644
--- a/frontend/yarn.lock
+++ b/frontend/yarn.lock
@@ -2147,6 +2147,10 @@ flatten@^1.0.2:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/flatten/-/flatten-1.0.2.tgz#dae46a9d78fbe25292258cc1e780a41d95c03782"
 
+flow-runtime@0.0.6:
+  version "0.0.6"
+  resolved "https://registry.yarnpkg.com/flow-runtime/-/flow-runtime-0.0.6.tgz#570aeab33dca9d2357d137c0b0a2e141b7342410"
+
 for-in@^0.1.5:
   version "0.1.6"
   resolved "https://registry.yarnpkg.com/for-in/-/for-in-0.1.6.tgz#c9f96e89bfad18a545af5ec3ed352a1d9e5b4dc8"
@@ -4420,6 +4424,13 @@ redux:
     loose-envify "^1.1.0"
     symbol-observable "^1.0.2"
 
+redux-immutable@^3.0.10:
+  version "3.0.10"
+  resolved "https://registry.yarnpkg.com/redux-immutable/-/redux-immutable-3.0.10.tgz#160c9ebfe59cf3f2fd4ee9baf0017cd56fe54649"
+  dependencies:
+    flow-runtime "0.0.6"
+    immutable "^3.8.1"
+
 redux-saga:
   version "0.13.0"
   resolved "https://registry.yarnpkg.com/redux-saga/-/redux-saga-0.13.0.tgz#9294386550deb0d56bc9a1b3c90a613e7ddb6593"
@@ -4560,6 +4571,10 @@ requires-port@1.0.x, requires-port@1.x.x:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/requires-port/-/requires-port-1.0.0.tgz#925d2601d39ac485e091cf0da5c6e694dc3dcaff"
 
+reselect@^2.5.4:
+  version "2.5.4"
+  resolved "https://registry.yarnpkg.com/reselect/-/reselect-2.5.4.tgz#b7d23fdf00b83fa7ad0279546f8dbbbd765c7047"
+
 resolve-from@^1.0.0:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/resolve-from/-/resolve-from-1.0.1.tgz#26cbfe935d1aeeeabb29bc3fe5aeb01e93d44226"