Temporal switch policy button, to be able to test out functionality

dashboard/src/main/home/navbar/Navbar.tsx

@@ -5,19 +5,24 @@ import api from "shared/api";
 import { Context } from "shared/Context";
 
 import Feedback from "./Feedback";
+import { withAuth, WithAuthProps } from "shared/auth/AuthorizationHoc";
+import { Select, MenuItem } from "@material-ui/core";
+import { AuthContext } from "shared/auth/AuthContext";
 
-type PropsType = {
+type PropsType = WithAuthProps & {
   logOut: () => void;
   currentView: string;
 };
 
 type StateType = {
   showDropdown: boolean;
+  currentPolicy: string;
 };
 
-export default class Navbar extends Component<PropsType, StateType> {
+class Navbar extends Component<PropsType, StateType> {
   state = {
     showDropdown: false,
+    currentPolicy: "admin",
   };
 
   renderSettingsDropdown = () => {
@@ -49,6 +54,22 @@ export default class Navbar extends Component<PropsType, StateType> {
   render() {
     return (
       <StyledNavbar>
+        <AuthContext.Consumer>
+          {(value) => (
+            <PolicySelector
+              value={this.state.currentPolicy}
+              onChange={(e) => {
+                value.setPolicy(e.target.value as any);
+                this.setState({ currentPolicy: e.target.value as string });
+              }}
+            >
+              <MenuItem value={"admin"}>Admin</MenuItem>
+              <MenuItem value={"dev"}>Dev</MenuItem>
+              <MenuItem value={"viewer"}>Viewer</MenuItem>
+            </PolicySelector>
+          )}
+        </AuthContext.Consumer>
+
         {this.renderFeedbackButton()}
         <NavButton
           selected={this.state.showDropdown}
@@ -67,10 +88,19 @@ export default class Navbar extends Component<PropsType, StateType> {
 
 Navbar.contextType = Context;
 
+export default withAuth(Navbar);
+
 const I = styled.i`
   margin-right: 7px;
 `;
 
+const PolicySelector = styled(Select)`
+  height: 30px;
+  width: 100px;
+  margin-right: 15px;
+  color: white !important;
+`;
+
 const CloseOverlay = styled.div`
   position: fixed;
   width: 100vw;

dashboard/src/shared/auth/AuthContext.tsx

@@ -1,14 +1,17 @@
 import React, { useContext, useEffect, useState } from "react";
 import { Context } from "shared/Context";
 import {
-  ADMIN_POLICY_MOCK,
+  VIEWER_POLICY_MOCK,
   POLICY_HIERARCHY_TREE,
   populatePolicy,
+  DEV_POLICY_MOCK,
+  ADMIN_POLICY_MOCK,
 } from "./authorization-helpers";
 import { PolicyDocType } from "./types";
 
 type AuthContext = {
   currentPolicy: PolicyDocType;
+  setPolicy: (pol: "admin" | "dev" | "viewer") => void;
 };
 
 export const AuthContext = React.createContext<AuthContext>({} as AuthContext);
@@ -17,24 +20,64 @@ const AuthProvider: React.FC = ({ children }) => {
   const { user } = useContext(Context);
   const [currentPolicy, setCurrentPolicy] = useState(null);
 
+  // useEffect(() => {
+  //   if (!user) {
+  //     setCurrentPolicy(null);
+  //   } else {
+  //     // TODO: GET POLICY FROM ENDPOINT
+  //     setCurrentPolicy(
+  //       populatePolicy(
+  //         VIEWER_POLICY_MOCK,
+  //         POLICY_HIERARCHY_TREE,
+  //         VIEWER_POLICY_MOCK.scope,
+  //         VIEWER_POLICY_MOCK.verbs
+  //       )
+  //     );
+  //   }
+  // }, [user]);
+
   useEffect(() => {
-    if (!user) {
-      setCurrentPolicy(null);
-    } else {
-      // TODO: GET POLICY FROM ENDPOINT
-      setCurrentPolicy(
-        populatePolicy(
-          ADMIN_POLICY_MOCK,
-          POLICY_HIERARCHY_TREE,
-          ADMIN_POLICY_MOCK.scope,
-          ADMIN_POLICY_MOCK.verbs
-        )
-      );
+    setPolicy("admin");
+  }, []);
+
+  // This is just for test case, should be deleted before merged with master
+  const setPolicy = (pol: "admin" | "dev" | "viewer") => {
+    switch (pol) {
+      case "viewer":
+        setCurrentPolicy(
+          populatePolicy(
+            VIEWER_POLICY_MOCK,
+            POLICY_HIERARCHY_TREE,
+            VIEWER_POLICY_MOCK.scope,
+            VIEWER_POLICY_MOCK.verbs
+          )
+        );
+        break;
+      case "dev":
+        setCurrentPolicy(
+          populatePolicy(
+            DEV_POLICY_MOCK,
+            POLICY_HIERARCHY_TREE,
+            DEV_POLICY_MOCK.scope,
+            DEV_POLICY_MOCK.verbs
+          )
+        );
+        break;
+      default:
+        setCurrentPolicy(
+          populatePolicy(
+            ADMIN_POLICY_MOCK,
+            POLICY_HIERARCHY_TREE,
+            ADMIN_POLICY_MOCK.scope,
+            ADMIN_POLICY_MOCK.verbs
+          )
+        );
+        break;
     }
-  }, [user]);
+  };
 
   return (
-    <AuthContext.Provider value={{ currentPolicy }}>
+    <AuthContext.Provider value={{ currentPolicy, setPolicy }}>
       {children}
     </AuthContext.Provider>
   );