Authentication guard now takes in a access level prop.

sports-matcher/client/src/components/AuthenticationGuard.js

@@ -1,6 +1,7 @@
 import React from "react";
 import globals from "../globals";
 import { apiClient } from "../utils/httpClients";
+import propTypes from "prop-types";
 
 export default class AuthenticationGuard extends React.Component {
     constructor(props) {
@@ -14,8 +15,10 @@ export default class AuthenticationGuard extends React.Component {
             if (userDataResponse.status === 200) {
                 this.context.update({ user: userDataResponse.data });
             } else if (userDataResponse.status == 401) {
-                this.context.navigate("/signup");
+                this.context.navigate("/signup", { replace: true });
             }
+        } else if (this.context.user.accessLevel < this.props.accessLevel) {
+            this.context.navigate("/", { replace: true });
         }
     }
 
@@ -23,3 +26,11 @@ export default class AuthenticationGuard extends React.Component {
         return null;
     }
 }
+
+AuthenticationGuard.defaultProps = {
+    accessLevel: 0
+};
+
+AuthenticationGuard.propTypes = {
+    accessLevel: propTypes.number,
+};

sports-matcher/client/src/pages/NewAdmin.js

@@ -2,6 +2,7 @@ import React from "react";
 import { Button, Table } from "react-bootstrap";
 import "../styles/Admin.css";
 import globals from "../globals";
+import AuthenticationGuard from "../components/AuthenticationGuard";
 
 export default class Admin extends React.Component {
     constructor(props) {
@@ -175,6 +176,8 @@ export default class Admin extends React.Component {
 
     render() {
         return (
+            <div className="page-root">
+                <AuthenticationGuard accessLevel={3} />
                 <React.Fragment>
 
                     <div className='center'>
@@ -206,6 +209,7 @@ export default class Admin extends React.Component {
                     </Table>
 
                 </React.Fragment>
+            </div>
         );
     }
 }