fix route by usertype (#174)

Author: sexta13

client/App.js

@@ -6,7 +6,6 @@ import Loadable from 'react-loadable'
 
 import Loading from './components/Loading/Loading'
 import AuthActionCreator from './actions/auth'
-import CreateProjectForm from './components/CreateProjectForm/CreateProjectForm'
 import ForgotPasswordForm from './components/ForgotPasswordForm/ForgotPasswordForm'
 import Header from './components/Header/Header'
 import Home from './components/Home/Home'
@@ -22,6 +21,11 @@ const ProfileRestrictedLoadable = restricted(Loadable({
   loading: Loading
 }))
 
+const CreateProjectRestrictedLoadable = restricted(Loadable({
+  loader: () => import('./components/CreateProjectForm/CreateProjectForm'),
+  loading: Loading
+}))
+
 class App extends Component {
   componentDidMount () {
     this.props.appLoad()
@@ -34,7 +38,7 @@ class App extends Component {
         <Version />
         <Switch>
           <Route exact path='/' component={Home}/>
-          <Route path='/create-project' component={CreateProjectForm}/>
+          <Route path='/create-project' component={CreateProjectRestrictedLoadable}/>
           <Route path='/forgot-password' component={ForgotPasswordForm}/>
           <Route path='/login' component={LoginForm}/>
           <Route path='/profile' component={ProfileRestrictedLoadable}/>

client/components/Restricted/Restricted.js

@@ -1,6 +1,7 @@
 import React, { Component } from 'react'
 import { connect } from 'react-redux'
 import PropTypes from 'prop-types'
+import {default as constants} from '../../constants'
 
 /**
  * Higher-order component (HOC) to wrap restricted pages
@@ -21,6 +22,18 @@ export default function (BaseComponent) {
       const { history } = params
       if (!params.authenticated) {
         history.replace({ pathname: '/login' })
+      } else {
+        if (!this.routesAvailableByUserType()) {
+          history.replace({pathname: '/'})
+        }
+      }
+    }
+
+    routesAvailableByUserType () {
+      switch (this.props.location.pathname) {
+        case '/create-project':
+          return this.props.user.usertype === constants.USER_TYPE_CONTACT
+        default: return true
       }
     }
 
@@ -31,12 +44,14 @@ export default function (BaseComponent) {
 
   function mapStateToProps (state) {
     return {
-      authenticated: state.auth.authenticated
+      authenticated: state.auth.authenticated,
+      user: state.user
     }
   }
 
   Restricted.propTypes = {
-    location: PropTypes.object
+    location: PropTypes.object,
+    user: PropTypes.object
   }
 
   return connect(mapStateToProps)(Restricted)

client/constants.js

@@ -0,0 +1,4 @@
+export default {
+  USER_TYPE_VOLUNTEER: 'volunteer',
+  USER_TYPE_CONTACT: 'contact'
+}