requireAuth higher order component

Author: Remchi

client/routes.js

@@ -7,11 +7,13 @@ import SignupPage from './components/signup/SignupPage';
 import LoginPage from './components/login/LoginPage';
 import NewEventPage from './components/events/NewEventPage';
 
+import requireAuth from './utils/requireAuth';
+
 export default (
   <Route path="/" component={App}>
     <IndexRoute component={Greetings} />
     <Route path="signup" component={SignupPage} />
     <Route path="login" component={LoginPage} />
-    <Route path="new-event" component={NewEventPage} />
+    <Route path="new-event" component={requireAuth(NewEventPage)} />
   </Route>
 )

client/utils/requireAuth.js

@@ -0,0 +1,46 @@
+import React from 'react';
+import { connect } from 'react-redux';
+import { addFlashMessage } from '../actions/flashMessages';
+
+export default function(ComposedComponent) {
+  class Authenticate extends React.Component {
+    componentWillMount() {
+      if (!this.props.isAuthenticated) {
+        this.props.addFlashMessage({
+          type: 'error',
+          text: 'You need to login to access this page'
+        });
+        this.context.router.push('/login');
+      }
+    }
+
+    componentWillUpdate(nextProps) {
+      if (!nextProps.isAuthenticated) {
+        this.context.router.push('/');
+      }
+    }
+
+    render() {
+      return (
+        <ComposedComponent {...this.props} />
+      );
+    }
+  }
+
+  Authenticate.propTypes = {
+    isAuthenticated: React.PropTypes.bool.isRequired,
+    addFlashMessage: React.PropTypes.func.isRequired
+  }
+
+  Authenticate.contextTypes = {
+    router: React.PropTypes.object.isRequired
+  }
+
+  function mapStateToProps(state) {
+    return {
+      isAuthenticated: state.auth.isAuthenticated
+    };
+  }
+
+  return connect(mapStateToProps, { addFlashMessage })(Authenticate);
+}