RANGER-4367: User with access on Key manager tab not able to view the…

… "Encryption" tab on the React UI Signed-off-by: Mehul Parikh <mehul@apache.org>
apache · Aug 28, 2023 · c1dcb78 · c1dcb78
1 parent 50a56de
commit c1dcb78
Show file tree

Hide file tree

Showing 4 changed files with 92 additions and 71 deletions.
diff --git a/security-admin/src/main/webapp/react-webapp/src/views/Encryption/KeyManager.jsx b/security-admin/src/main/webapp/react-webapp/src/views/Encryption/KeyManager.jsx
@@ -505,36 +505,40 @@ const KeyManager = (props) => {
         Header: "Action",
         accessor: "action",
         Cell: (rawValue) => {
-          return (
-            <div className="text-center">
-              <Button
-                className="btn btn-outline-dark btn-sm m-r-5"
-                size="sm"
-                title="Edit"
-                onClick={() => {
-                  editModal(rawValue.row.original.name);
-                }}
-                data-name="rolloverKey"
-                data-id={rawValue.row.original.name}
-                data-cy={rawValue.row.original.name}
-              >
-                <i className="fa-fw fa fa-edit"></i>
-              </Button>
-              <Button
-                variant="danger"
-                size="sm"
-                title="Delete"
-                onClick={() => {
-                  deleteModal(rawValue.row.original.name);
-                }}
-                data-name="deleteKey"
-                data-id={rawValue.row.original.name}
-                data-cy={rawValue.row.original.name}
-              >
-                <i className="fa-fw fa fa-trash"></i>
-              </Button>
-            </div>
-          );
+          if (isKeyAdmin()) {
+            return (
+              <div className="text-center">
+                <Button
+                  className="btn btn-outline-dark btn-sm m-r-5"
+                  size="sm"
+                  title="Edit"
+                  onClick={() => {
+                    editModal(rawValue.row.original.name);
+                  }}
+                  data-name="rolloverKey"
+                  data-id={rawValue.row.original.name}
+                  data-cy={rawValue.row.original.name}
+                >
+                  <i className="fa-fw fa fa-edit"></i>
+                </Button>
+                <Button
+                  variant="danger"
+                  size="sm"
+                  title="Delete"
+                  onClick={() => {
+                    deleteModal(rawValue.row.original.name);
+                  }}
+                  data-name="deleteKey"
+                  data-id={rawValue.row.original.name}
+                  data-cy={rawValue.row.original.name}
+                >
+                  <i className="fa-fw fa fa-trash"></i>
+                </Button>
+              </div>
+            );
+          } else {
+            return <div className="text-center">--</div>;
+          }
         },
         width: 80
       }
@@ -600,7 +604,7 @@ const KeyManager = (props) => {
               defaultSelected={defaultSearchFilterParams}
             />
           </Col>
-          {isKeyAdmin && (
+          {isKeyAdmin() && (
             <Col sm={2} className="text-right">
               <Button
                 className={onchangeval !== null ? "" : "button-disabled"}

diff --git a/security-admin/src/main/webapp/react-webapp/src/views/Reports/SearchPolicyTable.jsx b/security-admin/src/main/webapp/react-webapp/src/views/Reports/SearchPolicyTable.jsx
@@ -34,6 +34,7 @@ import { MoreLess } from "Components/CommonComponents";
 import XATableLayout from "Components/XATableLayout";
 import { fetchApi } from "Utils/fetchAPI";
 import { Loader } from "../../components/CommonComponents";
+import { isAuditor, isKMSAuditor } from "../../utils/XAUtils";
 
 function SearchPolicyTable(props) {
   const [searchPoliciesData, setSearchPolicies] = useState([]);
@@ -95,16 +96,26 @@ function SearchPolicyTable(props) {
         Header: "Policy ID",
         accessor: "id",
         Cell: (rawValue) => {
-          return (
-            <Link
-              title="Edit"
-              to={`/service/${getServiceId(
-                rawValue.row.original.service
-              )}/policies/${rawValue.value}/edit`}
-            >
-              {rawValue.value}
-            </Link>
-          );
+          if (isAuditor() || isKMSAuditor()) {
+            return (
+              <div className="position-relative text-center">
+                {rawValue.value}
+              </div>
+            );
+          } else {
+            return (
+              <div className="position-relative text-center">
+                <Link
+                  title="Edit"
+                  to={`/service/${getServiceId(
+                    rawValue.row.original.service
+                  )}/policies/${rawValue.value}/edit`}
+                >
+                  {rawValue.value}
+                </Link>
+              </div>
+            );
+          }
         },
         width: 65
       },

diff --git a/security-admin/src/main/webapp/react-webapp/src/views/Reports/UserAccessLayout.jsx b/security-admin/src/main/webapp/react-webapp/src/views/Reports/UserAccessLayout.jsx
@@ -49,12 +49,18 @@ import { toast } from "react-toastify";
 import { fetchApi } from "Utils/fetchAPI";
 import { useQuery } from "../../components/CommonComponents";
 import SearchPolicyTable from "./SearchPolicyTable";
-import { getBaseUrl, isKeyAdmin, isKMSAuditor } from "../../utils/XAUtils";
+import {
+  getBaseUrl,
+  isAuditor,
+  isKeyAdmin,
+  isKMSAuditor
+} from "../../utils/XAUtils";
 import CustomBreadcrumb from "../CustomBreadcrumb";
 import moment from "moment-timezone";
 
 function UserAccessLayout(props) {
   const isKMSRole = isKeyAdmin() || isKMSAuditor();
+  const isAuditRole = isAuditor() || isKMSAuditor();
   const [show, setShow] = useState(true);
   const [contentLoader, setContentLoader] = useState(true);
   const [serviceDefs, setServiceDefs] = useState([]);
@@ -151,21 +157,19 @@ function UserAccessLayout(props) {
   };
 
   const fetchZones = async () => {
-    let zonesResp;
+    let zonesResp = [];
     try {
-      zonesResp = await fetchApi({
+      const response = await fetchApi({
         url: "zones/zones"
       });
+      zonesResp = response?.data?.securityZones || [];
     } catch (error) {
       console.error(`Error occurred while fetching Zones! ${error}`);
     }
 
-    let zonesList = map(
-      sortBy(zonesResp.data.securityZones, ["name"]),
-      function (zone) {
-        return { value: zone.name, label: zone.name };
-      }
-    );
+    let zonesList = map(sortBy(zonesResp, ["name"]), function (zone) {
+      return { value: zone.name, label: zone.name };
+    });
 
     setZones(zonesResp?.data?.securityZones || []);
     setZoneNameOpts(zonesList);
@@ -774,10 +778,14 @@ function UserAccessLayout(props) {
                 <Dropdown.Item onClick={() => exportPolicy("csv")}>
                   CSV file
                 </Dropdown.Item>
-                <Dropdown.Divider />
-                <Dropdown.Item onClick={() => exportPolicy("exportJson")}>
-                  JSON file
-                </Dropdown.Item>
+                {!isAuditRole && (
+                  <React.Fragment>
+                    <Dropdown.Divider />
+                    <Dropdown.Item onClick={() => exportPolicy("exportJson")}>
+                      JSON file
+                    </Dropdown.Item>
+                  </React.Fragment>
+                )}
               </Dropdown.Menu>
             </Dropdown>
           </Col>

diff --git a/security-admin/src/main/webapp/react-webapp/src/views/SideBar/SideBar.jsx b/security-admin/src/main/webapp/react-webapp/src/views/SideBar/SideBar.jsx
@@ -345,7 +345,7 @@ export const SideBar = () => {
 
           {hasAccessToTab("Security Zone") && (
             <React.Fragment>
-              {!isKeyAdmin() && (
+              {!isKMSRole && (
                 <li>
                   <NavLink
                     className={activeClass("Security Zone")}
@@ -366,22 +366,20 @@ export const SideBar = () => {
 
           {hasAccessToTab("Key Manager") && (
             <React.Fragment>
-              {(isKeyAdmin() || isKMSAuditor()) && (
-                <li>
-                  <NavLink
-                    className={activeClass("Key Manager")}
-                    to="/kms/keys/new/manage/service"
-                    onClick={() => {
-                      setActive(null);
-                      setDrawer(false);
-                      setAccountDrawer(false);
-                    }}
-                  >
-                    <i className="fa fa-fw fa-key"></i>
-                    <span>Key Manager</span>
-                  </NavLink>
-                </li>
-              )}
+              <li>
+                <NavLink
+                  className={activeClass("Key Manager")}
+                  to="/kms/keys/new/manage/service"
+                  onClick={() => {
+                    setActive(null);
+                    setDrawer(false);
+                    setAccountDrawer(false);
+                  }}
+                >
+                  <i className="fa fa-fw fa-key"></i>
+                  <span>Key Manager</span>
+                </NavLink>
+              </li>
             </React.Fragment>
           )}