Fix RequireLogin onEnter hook

Author: stevoland

src/client.js

@@ -11,7 +11,7 @@ import io from 'socket.io-client';
 import {Provider} from 'react-redux';
 import {reduxReactRouter, ReduxRouter} from 'redux-router';
 
-import routes from './routes';
+import getRoutes from './routes';
 
 const client = new ApiClient();
 
@@ -35,7 +35,7 @@ global.socket = initSocket();
 
 const component = (
   <Provider store={store} key="provider">
-    <ReduxRouter routes={routes} />
+    <ReduxRouter routes={getRoutes(store)} />
   </Provider>
 );
 

src/containers/RequireLogin/RequireLogin.js

@@ -1,20 +1,14 @@
-import {Component, PropTypes} from 'react';
-import {connect} from 'react-redux';
+import {Component} from 'react';
 
-@connect(state => ({user: state.auth.user}))
 export default class RequireLogin extends Component {
-  static propTypes = {
-    user: PropTypes.object,
-    history: PropTypes.object.isRequired
-  }
-
-  componentWillMount() {
-    const {history, user} = this.props;
-    if (!user) {
-      setTimeout(() => {
-        history.replaceState(null, '/');
-      });
-    }
+  static onEnter(store) {
+    return (nextState, replaceState) => {
+      const { auth: { user }} = store.getState();
+      if (!user) {
+        // oops, not logged in, so can't be here!
+        replaceState(null, '/');
+      }
+    };
   }
 
   render() {

src/redux/create.js

@@ -2,7 +2,7 @@ import { createStore as _createStore, applyMiddleware, compose } from 'redux';
 import createMiddleware from './middleware/clientMiddleware';
 import transitionMiddleware from './middleware/transitionMiddleware';
 
-export default function createStore(reduxReactRouter, routes, createHistory, client, data) {
+export default function createStore(reduxReactRouter, getRoutes, createHistory, client, data) {
   const middleware = [createMiddleware(client)];
 
   if (__CLIENT__) {
@@ -21,7 +21,7 @@ export default function createStore(reduxReactRouter, routes, createHistory, cli
     finalCreateStore = applyMiddleware(...middleware)(_createStore);
   }
 
-  finalCreateStore = reduxReactRouter({ routes, createHistory })(finalCreateStore);
+  finalCreateStore = reduxReactRouter({ getRoutes, createHistory })(finalCreateStore);
 
   const reducer = require('./modules/reducer');
   const store = finalCreateStore(reducer, data);

src/routes.js

@@ -13,17 +13,19 @@ import {
     NotFound,
   } from 'containers';
 
-export default (
-  <Route component={App}>
-    <Route path="/" component={Home}/>
-    <Route path="/widgets" component={Widgets}/>
-    <Route path="/about" component={About}/>
-    <Route path="/login" component={Login}/>
-    <Route component={RequireLogin}>
-      <Route path="/chat" component={Chat}/>
-      <Route path="/loginSuccess" component={LoginSuccess}/>
+export default (store) => {
+  return (
+    <Route component={App}>
+      <Route path="/" component={Home}/>
+      <Route path="/widgets" component={Widgets}/>
+      <Route path="/about" component={About}/>
+      <Route path="/login" component={Login}/>
+      <Route component={RequireLogin} onEnter={RequireLogin.onEnter(store)}>
+        <Route path="/chat" component={Chat}/>
+        <Route path="/loginSuccess" component={LoginSuccess}/>
+      </Route>
+      <Route path="/survey" component={Survey}/>
+      <Route path="*" component={NotFound} status={404} />
     </Route>
-    <Route path="/survey" component={Survey}/>
-    <Route path="*" component={NotFound} status={404} />
-  </Route>
-);
+  );
+};

src/server.js

@@ -18,7 +18,7 @@ import {ReduxRouter} from 'redux-router';
 import {reduxReactRouter, match} from 'redux-router/server';
 import {Provider} from 'react-redux';
 import qs from 'query-string';
-import routes from './routes';
+import getRoutes from './routes';
 import getStatusFromRoutes from './helpers/getStatusFromRoutes';
 
 const pretty = new PrettyError();
@@ -58,7 +58,7 @@ app.use((req, res) => {
     webpackIsomorphicTools.refresh();
   }
   const client = new ApiClient(req);
-  const store = createStore(reduxReactRouter, routes, null, client);
+  const store = createStore(reduxReactRouter, getRoutes, null, client);
 
   function hydrateOnClient() {
     res.send('<!doctype html>\n' +