feathr-ai · blrchen · Aug 3, 2022 · Jul 29, 2022 · Aug 2, 2022 · Aug 2, 2022
diff --git a/deploy/start.sh b/deploy/start.sh
@@ -16,6 +16,12 @@ else
     echo "  \"azureTenantId\": \"${REACT_APP_AZURE_TENANT_ID}\"," >> $envfile
 fi
 
+if [[ -z "${REACT_APP_ENABLE_RBAC}" ]]; then
+    echo "Environment variable REACT_APP_ENABLE_RBAC is not defined, skipping"
+else
+    echo "  \"enableRBAC\": \"${REACT_APP_ENABLE_RBAC}\"," >> $envfile
+fi
+
 echo "}" >> $envfile
 
 echo "Successfully generated ${envfile} with following content"
@@ -27,7 +33,7 @@ nginx
 # Start API app
 LISTENING_PORT="8000"
 
-if [ "x$ENABLE_RBAC" == "x" ]; then
+if [ "x$REACT_APP_ENABLE_RBAC" == "x" ]; then
     echo "RBAC flag not configured, only launch registry app"
     if [ "x$PURVIEW_NAME" == "x" ]; then
         echo "Purview flag is not configured, run SQL registry"

diff --git a/docs/dev_guide/build-and-push-feathr-registry-docker-image.md b/docs/dev_guide/build-and-push-feathr-registry-docker-image.md
@@ -42,7 +42,7 @@ docker run --env PURVIEW_NAME=<REPLACE_ME> --env AZURE_CLIENT_ID=<REPLACE_ME> --
 
 ### Test SQL registry + RBAC
 ```bash
-docker run --env ENABLE_RBAC=true --env REACT_APP_AZURE_CLIENT_ID=<REPLACE_ME> --env REACT_APP_AZURE_TENANT_ID=<REPLACE_ME> --env CONNECTION_STR=<REPLACE_ME> --env API_BASE=api/v1 -it --rm -p 3000:80 feathrfeaturestore/feathr-registry
+docker run --env REACT_APP_ENABLE_RBAC=true --env REACT_APP_AZURE_CLIENT_ID=<REPLACE_ME> --env REACT_APP_AZURE_TENANT_ID=<REPLACE_ME> --env CONNECTION_STR=<REPLACE_ME> --env API_BASE=api/v1 -it --rm -p 3000:80 feathrfeaturestore/feathr-registry
 ```
 
 After docker image launched, open web browser and navigate to <https://localhost:3000>，verify both UI and backend api can work correctly.

diff --git a/docs/how-to-guides/azure_resource_provision.json b/docs/how-to-guides/azure_resource_provision.json
@@ -398,7 +398,7 @@
                 "value": "[concat('Server=tcp:',reference(variables('sqlServerName')).fullyQualifiedDomainName,',1433;Initial Catalog=',variables('sqlDatabaseName'),';Persist Security Info=False;User ID=',reference(variables('sqlserverName')).administratorLogin,';Password=',parameters('sqlAdminPassword'),';MultipleActiveResultSets=False;Encrypt=True;TrustServerCertificate=False;Connection Timeout=30;')]"
               },
               {
-                "name": "ENABLE_RBAC",
+                "name": "REACT_APP_ENABLE_RBAC",
                 "value": "[if(equals(parameters('enableRBAC'),'Yes'),json('true'),json('null'))]"
               },
               {
@@ -538,4 +538,4 @@
       }
     ],
     "outputs": {}
-  }
+  }
@@ -1,3 +1,4 @@
 REACT_APP_AZURE_CLIENT_ID=db8dc4b0-202e-450c-b38d-7396ad9631a5
 REACT_APP_AZURE_TENANT_ID=common
 REACT_APP_API_ENDPOINT=https://feathr-sql-registry.azurewebsites.net
+REACT_APP_ENABLE_RBAC=false
@@ -4,13 +4,19 @@ import {
   DatabaseOutlined,
   EyeOutlined,
   RocketOutlined,
+  ControlOutlined,
 } from "@ant-design/icons";
 import { Link } from "react-router-dom";
 
 const { Title } = Typography;
 const { Sider } = Layout;
 
 const SideMenu = () => {
+  const enableRBAC = window.environment?.enableRBAC;
+  const showManagement = enableRBAC
+    ? enableRBAC
+    : process.env.REACT_APP_ENABLE_RBAC;
+
   return (
     <Sider theme="dark">
       <Title
@@ -58,6 +64,16 @@ const SideMenu = () => {
         >
           <Link to="/monitoring">Monitoring</Link>
         </Menu.Item>
+        {showManagement === "true" && (
+          <Menu.Item
+            key="/management"
+            icon={
+              <ControlOutlined style={{ fontSize: "20px", color: "#6495ed" }} />
+            }
+          >
+            <Link to="/management">Management</Link>
+          </Menu.Item>
+        )}
       </Menu>
     </Sider>
   );

@@ -132,31 +132,21 @@ const UserRoles: React.FC = () => {
 
   return (
     <div>
-      <PageHeader
-        title={`Role Managements`}
-        style={{
-          backgroundColor: "white",
-          paddingLeft: "50px",
-          paddingRight: "50px",
-        }}
-      >
-        <Row>
-          <div style={{ flex: 1 }}>
-            <>
-              <p>
-                This page is protected by Feathr Access Control. Only Global
-                Admin can retrieve management details and grant or delete user
-                roles.
-              </p>
-            </>
-          </div>
-        </Row>
-      </PageHeader>
+      <Row>
+        <div style={{ flex: 1 }}>
+          <>
+            <p style={{ width: "80%" }}>
+              This page is protected by Feathr Access Control. Only Global Admin
+              can retrieve management details and grant or delete user roles.
+            </p>
+          </>
+        </div>
+      </Row>
       <Space style={{ marginBottom: 16 }}>
         <Button
           type="primary"
           onClick={onClickRoleAssign}
-          style={{ position: "absolute", right: "12px", top: "56px" }}
+          style={{ position: "absolute", right: "12px", top: "70px" }}
         >
           + Create Role Assignment
         </Button>

@@ -8,7 +8,7 @@ const Management: React.FC = () => {
   return (
     <div className="page">
       <Card style={{ minWidth: "1000px" }}>
-        <Title level={3}>Management</Title>
+        <Title level={3}>Role Management</Title>
         <UserRoles />
       </Card>
     </div>

@@ -8,6 +8,7 @@ declare global {
       REACT_APP_AZURE_CLIENT_ID: string;
       REACT_APP_AZURE_TENANT_ID: string;
       REACT_APP_API_ENDPOINT: string;
+      REACR_APP_ENABLE_RBAC: boolean;
     }
   }
 
@@ -18,6 +19,7 @@ declare global {
   interface EnvironmentConfig {
     azureClientId: string;
     azureTenantId: string;
+    enableRBAC: boolean;
   }
 }