only display admin menu if the user is admin

app/js/App.js

@@ -5,6 +5,7 @@ import ThemeProvider from 'react-bootstrap/ThemeProvider';
 
 import EmbarkJS from 'Embark/EmbarkJS';
 
+import {isAdmin} from './services/Meritocracy';
 import Header from './components/Header';
 import Home from './components/Home';
 import Admin from './components/Admin';
@@ -16,7 +17,8 @@ class App extends React.Component {
 
   state = {
     error: null,
-    loading: true
+    loading: true,
+    isUserAdmin: false
   };
 
   componentDidMount() {
@@ -32,12 +34,15 @@ class App extends React.Component {
       if (EmbarkJS.environment === 'livenet' && netId !== MAINNET) {
         return this.setState({error: 'Please connect to Mainnet'});
       }
-      this.setState({loading: false})
+
+      const isUserAdmin = await isAdmin(web3.eth.defaultAccount);
+
+      this.setState({loading: false, isUserAdmin})
     });
   }
 
   render() {
-    const {error, loading} = this.state;
+    const {error, loading, isUserAdmin} = this.state;
 
     if (error) {
       return (<div>
@@ -54,10 +59,10 @@ class App extends React.Component {
 
     return (<HashRouter>
       <ThemeProvider prefixes={{ btn: 'my-btn' }}>
-        <Header/>
+        <Header isUserAdmin={isUserAdmin}/>
         <Switch>
           <Route exact path="/" component={Home}/>
-          <Route exact path="/admin" component={Admin}/>
+          {isUserAdmin && <Route exact path="/admin" component={Admin}/>}
 
           <Redirect to="/404"/>
         </Switch>

app/js/components/Header.js

@@ -4,15 +4,15 @@ import {Navbar, Nav} from 'react-bootstrap';
 import './header.scss'
 import logo from '../../images/logo.png';
 
-const Header = () => (<Navbar expand="lg" className="header border-bottom mb-3">
+const Header = ({isUserAdmin}) => (<Navbar expand="lg" className="header border-bottom mb-3">
     <Navbar.Brand href="/#/"><img alt="Logo" src={logo} className="mr-3"/>Status Meritocracy</Navbar.Brand>
     <Navbar.Toggle aria-controls="basic-navbar-nav"/>
-    <Navbar.Collapse id="basic-navbar-nav">
+    {isUserAdmin && <Navbar.Collapse id="basic-navbar-nav">
       <Nav className="mr-auto">
-          <Nav.Link href="/#/">Home</Nav.Link>
-          <Nav.Link href="/#/admin">Admin</Nav.Link>
+        <Nav.Link href="/#/">Home</Nav.Link>
+        <Nav.Link href="/#/admin">Admin</Nav.Link>
       </Nav>
-    </Navbar.Collapse>
+    </Navbar.Collapse>}
   </Navbar>
 );
 

app/js/services/Meritocracy.js

@@ -152,3 +152,17 @@ export function saveContributorList(list) {
   });
 }
 
+export function isAdmin(address) {
+  return new Promise(async (resolve, reject) => {
+    try {
+      const result = await Meritocracy.methods.admins(address).call();
+      resolve(result);
+    } catch (e) {
+      const message = 'Could not get status of user';
+      console.error(message);
+      console.error(e);
+      reject(message);
+    }
+  });
+}
+