Fix admin/user login issues

website/src/Auth/ConfirmEmail.js

@@ -79,7 +79,7 @@ export class ConfirmEmail extends React.Component {
     return (
       <div>
         <WaitModal
-          active={!!waitModal}
+          open={!!waitModal}
           message={waitModal ? waitModal.message : ""}
         />
 

website/src/Auth/DefaultRoute.js

@@ -1,14 +1,49 @@
 import React, { Component } from "react"
 import { Route, Redirect } from "react-router-dom"
 import PropTypes from "prop-types"
+import { api } from "src/API"
 
 export class DefaultRoute extends Component {
   static propTypes = {
-    redirect: PropTypes.string,
+    location: PropTypes.shape({
+      pathname: PropTypes.string,
+      search: PropTypes.string,
+    }),
+    user: PropTypes.string.isRequired,
+    admin: PropTypes.string.isRequired,
   }
 
   render() {
-    // NOTE: When working on the site, Redirect to the page you are working on
-    return <Route render={() => <Redirect to={this.props.redirect} />} />
+    const user = api.loggedInUser
+
+    if (user.loggedOut) {
+      return <Route render={() => <Redirect to="/login" />} />
+    } else if (user.pending) {
+      // If login token has not yet been confirmed, park until it is then come back here
+      return (
+        <Route
+          render={() => (
+            <Redirect
+              to={`/parking?redirect=${this.props.location.pathname}`}
+            />
+          )}
+        />
+      )
+    } else {
+      // Render a redirect to the user or admin default page
+      return (
+        <Route
+          render={() => (
+            <Redirect
+              to={
+                user._id && user.administrator
+                  ? this.props.admin
+                  : this.props.user
+              }
+            />
+          )}
+        />
+      )
+    }
   }
 }

website/src/Auth/ForgotPassword.js

@@ -151,7 +151,7 @@ export class ForgotPassword extends Component {
         </Column.Item>
         <Column.Item grow>
           <WaitModal
-            active={!!waitModal}
+            open={!!waitModal}
             message={waitModal ? waitModal.message : ""}
           />
 

website/src/Auth/Login.js

@@ -75,7 +75,9 @@ export class Login extends Component {
           this.setState({ waitModal: false })
           if (this.props.history) {
             let url =
-              new URLSearchParams(window.location.search).get("redirect") || "/"
+              new URLSearchParams(this.props.history.location.search).get(
+                "redirect"
+              ) || "/"
 
             try {
               this.props.history.replace(url)
@@ -224,7 +226,7 @@ export class Login extends Component {
           </Row>
         </Column.Item>
         <Column.Item grow>
-          <WaitModal active={waitModal} message="Logging in..." />
+          <WaitModal open={waitModal} message="Logging in..." />
           <MessageModal
             error
             open={!!messageModal}

website/src/Auth/Parking.js

@@ -0,0 +1,53 @@
+import React, { Component, Fragment } from "react"
+import PropTypes from "prop-types"
+import { api } from "src/API"
+import { WaitModal } from "../Modal"
+import { Column } from "ui"
+import autobind from "autobind-decorator"
+
+export class Parking extends Component {
+  static propTypes = {
+    history: PropTypes.oneOfType([PropTypes.array, PropTypes.object]),
+  }
+
+  componentDidMount() {
+    api.addListener("login", this.goToRedirect)
+    api.addListener("logout", this.goToLogin)
+  }
+
+  componentWillUnmount() {
+    api.removeListener("login", this.goToRedirect)
+    api.removeListener("logout", this.goToLogin)
+  }
+
+  @autobind
+  goToRedirect() {
+    if (this.props.history) {
+      let url =
+        new URLSearchParams(this.props.history.location.search).get(
+          "redirect"
+        ) || "/"
+
+      try {
+        this.props.history.replace(url)
+      } catch (error) {
+        this.props.history.replace("/")
+      }
+    }
+  }
+
+  @autobind
+  goToLogin() {
+    this.props.history.replace("/login")
+  }
+
+  render() {
+    return (
+      <Fragment>
+        <Column.Item grow>
+          <WaitModal open loader={false} message="Authenticating..." />
+        </Column.Item>
+      </Fragment>
+    )
+  }
+}

website/src/Auth/ProtectedRoute.js

@@ -1,8 +1,7 @@
-import React from 'react'
-import { Route, Redirect } from 'react-router'
-import { PropTypes } from 'prop-types'
-import { api } from 'src/API'
-import autobind from 'autobind-decorator'
+import React from "react"
+import { Route, Redirect } from "react-router"
+import { PropTypes } from "prop-types"
+import { api } from "src/API"
 
 export class ProtectedRoute extends React.Component {
   static propTypes = {
@@ -13,33 +12,32 @@ export class ProtectedRoute extends React.Component {
     admin: PropTypes.bool,
   }
 
-  @autobind
-  updateComponent() {
-    this.forceUpdate()
-  }
-
-  componentDidMount() {
-    api.addListener("login", this.updateComponent)
-    api.addListener("logout", this.updateComponent)
-  }
-
-  componentWillUnmount() {
-    api.removeListener("login", this.updateComponent)
-    api.removeListener("logout", this.updateComponent)
-  }
-
   render(props) {
     const user = api.loggedInUser
 
     if (user.pending) {
-      return null
+      // If login token has not yet been confirmed, park until it is and redirect back here
+      return (
+        <Route
+          render={() => (
+            <Redirect
+              to={`/parking?redirect=${this.props.location.pathname}`}
+            />
+          )}
+        />
+      )
     } else {
+      // If we are not a user or an admin go to the login page
       if (!user._id || (this.props.admin && !user.administrator)) {
         return (
-          <Redirect
-            to={`/login?redirect=${this.props.location.pathname}${
-              this.props.location.search
-            }`}
+          <Route
+            render={() => (
+              <Redirect
+                to={`/login?redirect=${this.props.location.pathname}${
+                  this.props.location.search
+                }`}
+              />
+            )}
           />
         )
       } else {

website/src/Auth/ResetPassword.js

@@ -205,7 +205,7 @@ export class ResetPassword extends Component {
           />
 
           <WaitModal
-            active={!!waitModal}
+            open={!!waitModal}
             message={waitModal ? waitModal.message : ""}
           />
         </Column.Item>

website/src/Auth/index.js

@@ -1,7 +1,8 @@
-export { Login } from './Login'
-export { Logout } from './Logout'
-export { ResetPassword } from './ResetPassword'
-export { ForgotPassword } from './ForgotPassword'
-export { ConfirmEmail } from './ConfirmEmail'
-export { DefaultRoute } from './DefaultRoute'
-export { ProtectedRoute } from './ProtectedRoute'
+export { Login } from "./Login"
+export { Logout } from "./Logout"
+export { Parking } from "./Parking"
+export { ResetPassword } from "./ResetPassword"
+export { ForgotPassword } from "./ForgotPassword"
+export { ConfirmEmail } from "./ConfirmEmail"
+export { DefaultRoute } from "./DefaultRoute"
+export { ProtectedRoute } from "./ProtectedRoute"