disable buttons which are not accessable when non-admin user is authenticated

interface/src/sections/AccessPoint.js

@@ -8,6 +8,7 @@ import AuthenticatedRoute from '../authentication/AuthenticatedRoute';
 import MenuAppBar from '../components/MenuAppBar';
 import APSettings from '../containers/APSettings';
 import APStatus from '../containers/APStatus';
+import { withAuthenticationContext } from '../authentication/Context.js';
 
 class AccessPoint extends Component {
 
@@ -16,20 +17,21 @@ class AccessPoint extends Component {
   };
 
   render() {
+    const { authenticationContext } = this.props;
     return (
       <MenuAppBar sectionTitle="Access Point">
         <Tabs value={this.props.match.url} onChange={this.handleTabChange} indicatorColor="primary" textColor="primary" variant="fullWidth">
           <Tab value="/ap/status" label="Access Point Status" />
-          <Tab value="/ap/settings" label="Access Point Settings" />
+          <Tab value="/ap/settings" label="Access Point Settings" disabled={!authenticationContext.isAdmin()} />
         </Tabs>
         <Switch>
           <AuthenticatedRoute exact={true} path="/ap/status" component={APStatus} />
           <AuthenticatedRoute exact={true} path="/ap/settings" component={APSettings} />
           <Redirect to="/ap/status" />
-        </Switch>        
+        </Switch>
       </MenuAppBar>
     )
   }
 }
 
-export default AccessPoint;
+export default withAuthenticationContext(AccessPoint);

interface/src/sections/NetworkTime.js

@@ -8,6 +8,7 @@ import AuthenticatedRoute from '../authentication/AuthenticatedRoute';
 import MenuAppBar from '../components/MenuAppBar';
 import NTPSettings from '../containers/NTPSettings';
 import NTPStatus from '../containers/NTPStatus';
+import { withAuthenticationContext } from '../authentication/Context.js';
 
 class NetworkTime extends Component {
 
@@ -16,11 +17,12 @@ class NetworkTime extends Component {
   };
 
   render() {
+    const { authenticationContext } = this.props;
     return (
       <MenuAppBar sectionTitle="Network Time">
         <Tabs value={this.props.match.url} onChange={this.handleTabChange} indicatorColor="primary" textColor="primary" variant="fullWidth">
           <Tab value="/ntp/status" label="NTP Status" />
-          <Tab value="/ntp/settings" label="NTP Settings" />
+          <Tab value="/ntp/settings" label="NTP Settings" disabled={!authenticationContext.isAdmin()} />
         </Tabs>
         <Switch>
           <AuthenticatedRoute exact={true} path="/ntp/status" component={NTPStatus} />
@@ -32,4 +34,4 @@ class NetworkTime extends Component {
   }
 }
 
-export default NetworkTime
+export default withAuthenticationContext(NetworkTime)

interface/src/sections/System.js

@@ -8,6 +8,7 @@ import AuthenticatedRoute from '../authentication/AuthenticatedRoute';
 import MenuAppBar from '../components/MenuAppBar';
 import OTASettings from '../containers/OTASettings';
 import SystemStatus from '../containers/SystemStatus';
+import { withAuthenticationContext } from '../authentication/Context.js';
 
 class System extends Component {
 
@@ -16,11 +17,12 @@ class System extends Component {
   };
 
   render() {
+    const { authenticationContext } = this.props;
     return (
       <MenuAppBar sectionTitle="System">
         <Tabs value={this.props.match.url} onChange={this.handleTabChange} indicatorColor="primary" textColor="primary" variant="fullWidth">
           <Tab value="/system/status" label="System Status" />
-          <Tab value="/system/ota" label="OTA Settings" />
+          <Tab value="/system/ota" label="OTA Settings" disabled={!authenticationContext.isAdmin()} />
         </Tabs>
         <Switch>
           <AuthenticatedRoute exact={true} path="/system/status" component={SystemStatus} />
@@ -32,4 +34,4 @@ class System extends Component {
   }
 }
 
-export default System
+export default withAuthenticationContext(System);

interface/src/sections/WiFiConnection.js

@@ -9,6 +9,7 @@ import MenuAppBar from '../components/MenuAppBar';
 import WiFiNetworkScanner from '../containers/WiFiNetworkScanner';
 import WiFiSettings from '../containers/WiFiSettings';
 import WiFiStatus from '../containers/WiFiStatus';
+import { withAuthenticationContext } from '../authentication/Context.js';
 
 class WiFiConnection extends Component {
 
@@ -35,6 +36,7 @@ class WiFiConnection extends Component {
   };
 
   render() {
+    const { authenticationContext } = this.props;
     const ConfiguredWiFiNetworkScanner = (props) => {
       return (
         <WiFiNetworkScanner
@@ -55,8 +57,8 @@ class WiFiConnection extends Component {
       <MenuAppBar sectionTitle="WiFi Connection">
         <Tabs value={this.props.match.url} onChange={this.handleTabChange} indicatorColor="primary" textColor="primary" variant="fullWidth">
           <Tab value="/wifi/status" label="WiFi Status" />
-          <Tab value="/wifi/scan" label="Scan Networks" />
-          <Tab value="/wifi/settings" label="WiFi Settings" />
+          <Tab value="/wifi/scan" label="Scan Networks" disabled={!authenticationContext.isAdmin()} />
+          <Tab value="/wifi/settings" label="WiFi Settings" disabled={!authenticationContext.isAdmin()} />
         </Tabs>
         <Switch>
           <AuthenticatedRoute exact={true} path="/wifi/status" component={WiFiStatus} />
@@ -69,4 +71,4 @@ class WiFiConnection extends Component {
   }
 }
 
-export default WiFiConnection;
+export default withAuthenticationContext(WiFiConnection);