This is an automated email from the ASF dual-hosted git repository. dhavaljrajpara pushed a commit to branch RANGER-5468 in repository https://gitbox.apache.org/repos/asf/ranger.git
commit 888c4f803b23bb528814ab655557752713a27e23 Author: Dhaval Rajpara <[email protected]> AuthorDate: Fri Jul 17 08:27:46 2026 +0530 RANGER-5468 : Policy UI to list permissions in sorted order --- .../src/components/CommonComponents.jsx | 4 +-- .../react-webapp/src/components/Editable.jsx | 2 +- .../main/webapp/react-webapp/src/utils/XAUtils.js | 33 ++++++++++++++++++++++ .../Admin/AdminLogs/PolicyViewDetails.jsx | 13 ++++++--- .../views/PolicyListing/PolicyPermissionItem.jsx | 11 ++++---- .../views/PolicyListing/TagBasePermissionItem.jsx | 5 ++-- .../src/views/Reports/SearchPolicyTable.jsx | 31 ++++++++++++++------ .../views/ServiceManager/ServiceAuditFilter.jsx | 10 +++---- .../views/ServiceManager/ServiceViewDetails.jsx | 11 ++++++-- 9 files changed, 89 insertions(+), 31 deletions(-) diff --git a/security-admin/src/main/webapp/react-webapp/src/components/CommonComponents.jsx b/security-admin/src/main/webapp/react-webapp/src/components/CommonComponents.jsx index e70345d6a..64aed3515 100644 --- a/security-admin/src/main/webapp/react-webapp/src/components/CommonComponents.jsx +++ b/security-admin/src/main/webapp/react-webapp/src/components/CommonComponents.jsx @@ -95,12 +95,12 @@ export class MoreLess extends Component { return ( <> <div className={this.state.show ? "show-less" : "show-more"}> - {this?.state?.data?.map((key) => { + {this?.state?.data?.map((key, index) => { return ( <Badge bg="info" title={key} - key={key} + key={index} className="m-1 text-truncate more-less-width" > {key} diff --git a/security-admin/src/main/webapp/react-webapp/src/components/Editable.jsx b/security-admin/src/main/webapp/react-webapp/src/components/Editable.jsx index f69d0240c..f05c790d5 100644 --- a/security-admin/src/main/webapp/react-webapp/src/components/Editable.jsx +++ b/security-admin/src/main/webapp/react-webapp/src/components/Editable.jsx @@ -620,7 +620,7 @@ const Editable = (props) => { selectVal && selectVal?.length > 0 ? ( <> <span className="editable-edit-text"> - {selectVal.map((op, index) => ( + {sortBy(selectVal, "label").map((op, index) => ( <h6 className="d-inline me-1" key={index}> <Badge bg="info">{op.label}</Badge> </h6> diff --git a/security-admin/src/main/webapp/react-webapp/src/utils/XAUtils.js b/security-admin/src/main/webapp/react-webapp/src/utils/XAUtils.js index ceb4c3aef..a39a24f45 100644 --- a/security-admin/src/main/webapp/react-webapp/src/utils/XAUtils.js +++ b/security-admin/src/main/webapp/react-webapp/src/utils/XAUtils.js @@ -1604,3 +1604,36 @@ export const safeJsonParse = (value, fallback) => { return fallback; } }; + +//CommonFunction to get display label for policy permission item +export const getPolicyPermissionItemDisplayLbl = ( + serviceDef, + policyType, + accessType +) => { + let accessTypeDefVal = []; + const accesTypeKeys = map(accessType, (item) => { + return isObject(item) ? item.type : item; + }); + if (RangerPolicyType.RANGER_MASKING_POLICY_TYPE.value == policyType) { + accessTypeDefVal = serviceDef.dataMaskDef.accessTypes; + } else if ( + RangerPolicyType.RANGER_ROW_FILTER_POLICY_TYPE.value == policyType + ) { + accessTypeDefVal = serviceDef.rowFilterDef.accessTypes; + } else { + accessTypeDefVal = serviceDef.accessTypes; + } + if (serviceDef.name == "tag") { + return map(sortBy(accesTypeKeys), (val) => ({ label: val })); + } else { + if (accessType.length == accessTypeDefVal.length) { + return sortBy(accessTypeDefVal, "label"); + } else { + const accessTypeDisplayLblObj = filter(accessTypeDefVal, (item) => + includes(accesTypeKeys, { type: item.name }) + ); + return sortBy(accessTypeDisplayLblObj, "label"); + } + } +}; diff --git a/security-admin/src/main/webapp/react-webapp/src/views/AuditEvent/Admin/AdminLogs/PolicyViewDetails.jsx b/security-admin/src/main/webapp/react-webapp/src/views/AuditEvent/Admin/AdminLogs/PolicyViewDetails.jsx index 2f011b6d4..e683303a1 100644 --- a/security-admin/src/main/webapp/react-webapp/src/views/AuditEvent/Admin/AdminLogs/PolicyViewDetails.jsx +++ b/security-admin/src/main/webapp/react-webapp/src/views/AuditEvent/Admin/AdminLogs/PolicyViewDetails.jsx @@ -27,7 +27,8 @@ import { cloneDeep, find, isEmpty, map, sortBy } from "lodash"; import { getResourcesDefVal, serverError, - getPolicyConditionDisplayLbl + getPolicyConditionDisplayLbl, + getPolicyPermissionItemDisplayLbl } from "Utils/XAUtils"; import { ModalLoader } from "Components/CommonComponents"; import { getServiceDef } from "Utils/appState"; @@ -478,14 +479,18 @@ export function PolicyViewDetails(props) { {!isEmpty(items.accesses) ? ( <td className="text-center d-flex flex-wrap policyview-permission-wrap"> {" "} - {items.accesses.map((obj, index) => ( + {getPolicyPermissionItemDisplayLbl( + filterServiceDef, + policyType, + items.accesses + ).map((obj, index) => ( <h6 className="d-inline me-1" key={index}> <Badge bg="info" className="d-inline me-1" - key={obj.type} + key={obj.label} > - {obj.type} + {obj.label} </Badge> </h6> ))} diff --git a/security-admin/src/main/webapp/react-webapp/src/views/PolicyListing/PolicyPermissionItem.jsx b/security-admin/src/main/webapp/react-webapp/src/views/PolicyListing/PolicyPermissionItem.jsx index 6240525b8..60a48dff1 100644 --- a/security-admin/src/main/webapp/react-webapp/src/views/PolicyListing/PolicyPermissionItem.jsx +++ b/security-admin/src/main/webapp/react-webapp/src/views/PolicyListing/PolicyPermissionItem.jsx @@ -31,7 +31,8 @@ import { map, filter, some, - isEqual + isEqual, + sortBy } from "lodash"; import { toast } from "react-toastify"; import Editable from "Components/Editable"; @@ -253,10 +254,10 @@ export default function PolicyPermissionItem(props) { } } } - return srcOp.map(({ label, name: value }) => ({ - label, - value - })); + return sortBy( + srcOp.map(({ label, name: value }) => ({ label, value })), + serviceCompDetails?.name == "tag" ? "value" : "label" + ); }; const getMaskingAccessTypeOptions = (index) => { diff --git a/security-admin/src/main/webapp/react-webapp/src/views/PolicyListing/TagBasePermissionItem.jsx b/security-admin/src/main/webapp/react-webapp/src/views/PolicyListing/TagBasePermissionItem.jsx index 7d164dedc..80fa4a8ae 100644 --- a/security-admin/src/main/webapp/react-webapp/src/views/PolicyListing/TagBasePermissionItem.jsx +++ b/security-admin/src/main/webapp/react-webapp/src/views/PolicyListing/TagBasePermissionItem.jsx @@ -33,7 +33,8 @@ import { difference, map, every, - cloneDeep + cloneDeep, + sortBy } from "lodash"; import { RangerPolicyType } from "Utils/XAEnums"; import { getServiceDef } from "Utils/appState"; @@ -269,7 +270,7 @@ export default function TagBasePermissionItem(props) { }; const tagAccessTypeDisplayVal = (val) => { - return val.map((m, index) => { + return sortBy(val, "serviceName").map((m, index) => { return ( <h6 className="d-inline me-1 mb-1" key={index}> <Badge bg="info">{m.serviceName.toUpperCase()}</Badge> 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 index c8f581eb4..39d96f2ae 100644 --- 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 @@ -38,6 +38,7 @@ import { isKMSAuditor, getPolicyConditionDisplayLbl } from "Utils/XAUtils"; +import { getPolicyPermissionItemDisplayLbl } from "../../utils/XAUtils"; function SearchPolicyTable(props) { const [searchPoliciesData, setSearchPolicies] = useState([]); @@ -305,7 +306,11 @@ function PolicyConditionData(props) { if (!isEmpty(policyItem)) { tableRow = policyItem?.map((items, index) => { - access = items.accesses?.map((obj) => obj.type); + access = getPolicyPermissionItemDisplayLbl( + props.serviceDef, + 0, + items.accesses + )?.map((obj) => obj.label); return ( <tr key={index}> <td> @@ -388,7 +393,11 @@ function PolicyConditionData(props) { let access = []; if (!isEmpty(policyItem)) { tableRow = policyItem?.map((items, index) => { - access = items.accesses?.map((obj) => obj.type); + access = getPolicyPermissionItemDisplayLbl( + props.serviceDef, + 1, + items.accesses + )?.map((obj) => obj.label); return ( <tr key={index}> <td> @@ -473,7 +482,11 @@ function PolicyConditionData(props) { let access = []; if (!isEmpty(policyItem)) { tableRow = policyItem?.map((items, index) => { - access = items.accesses?.map((obj) => obj.type); + access = getPolicyPermissionItemDisplayLbl( + props.serviceDef, + 2, + items.accesses + )?.map((obj) => obj.label); return ( <tr key={index}> <td> @@ -569,7 +582,7 @@ function PolicyConditionData(props) { {!isEmpty(props?.serviceDef?.policyConditions) && ( <th className="text-center text-nowrap">Rule Conditions</th> )} - <th>Accesses</th> + <th>Permissions</th> {props?.serviceDef?.name != "tag" && <th>Delegate Admin</th>} </tr> </thead> @@ -596,7 +609,7 @@ function PolicyConditionData(props) { Rule Conditions </th> )} - <th>Accesses</th> + <th>Permissions</th> {props?.serviceDef?.name != "tag" && ( <th>Delegate Admin</th> )} @@ -624,7 +637,7 @@ function PolicyConditionData(props) { Rule Conditions </th> )} - <th>Accesses</th> + <th>Permissions</th> {props?.serviceDef?.name != "tag" && ( <th>Delegate Admin</th> )} @@ -652,7 +665,7 @@ function PolicyConditionData(props) { Rule Conditions </th> )} - <th>Accesses</th> + <th>Permissions</th> {props?.serviceDef?.name != "tag" && ( <th>Delegate Admin</th> )} @@ -685,7 +698,7 @@ function PolicyConditionData(props) { {!isEmpty(props?.serviceDef?.policyConditions) && ( <th className="text-center text-nowrap">Rule Conditions</th> )} - <th>Accesses</th> + <th>Permissions</th> <th>Masking Condition</th> </tr> </thead> @@ -714,7 +727,7 @@ function PolicyConditionData(props) { {!isEmpty(props?.serviceDef?.policyConditions) && ( <th className="text-center text-nowrap">Rule Conditions</th> )} - <th>Accesses</th> + <th>Permissions</th> <th>Row Level Filter</th> </tr> </thead> diff --git a/security-admin/src/main/webapp/react-webapp/src/views/ServiceManager/ServiceAuditFilter.jsx b/security-admin/src/main/webapp/react-webapp/src/views/ServiceManager/ServiceAuditFilter.jsx index 23c2e8a13..9ce5dfc37 100644 --- a/security-admin/src/main/webapp/react-webapp/src/views/ServiceManager/ServiceAuditFilter.jsx +++ b/security-admin/src/main/webapp/react-webapp/src/views/ServiceManager/ServiceAuditFilter.jsx @@ -26,7 +26,7 @@ import AsyncSelect from "react-select/async"; import Editable from "Components/Editable"; import CreatableField from "Components/CreatableField"; import ModalResourceComp from "Views/Resources/ModalResourceComp"; -import { uniq, map, join, isEmpty, isArray } from "lodash"; +import { uniq, map, join, isEmpty, isArray, sortBy } from "lodash"; import TagBasePermissionItem from "Views/PolicyListing/TagBasePermissionItem"; import { dragStart, dragEnter, drop, dragOver } from "Utils/XAUtils"; import { selectInputCustomStyles } from "Components/CommonComponents"; @@ -155,10 +155,10 @@ export default function ServiceAuditFilter(props) { const getAccessTypeOptions = () => { let srcOp = []; srcOp = serviceDefDetails?.accessTypes; - return srcOp?.map(({ label, name: value }) => ({ - label, - value - })); + return sortBy( + srcOp?.map(({ label, name: value }) => ({ label, value })), + serviceDefDetails.name == "tag" ? "value" : "label" + ); }; const permList = [ diff --git a/security-admin/src/main/webapp/react-webapp/src/views/ServiceManager/ServiceViewDetails.jsx b/security-admin/src/main/webapp/react-webapp/src/views/ServiceManager/ServiceViewDetails.jsx index 8cb742c29..9f3afbe91 100644 --- a/security-admin/src/main/webapp/react-webapp/src/views/ServiceManager/ServiceViewDetails.jsx +++ b/security-admin/src/main/webapp/react-webapp/src/views/ServiceManager/ServiceViewDetails.jsx @@ -33,6 +33,7 @@ import { } from "lodash"; import { ModalLoader } from "Components/CommonComponents"; import { additionalServiceConfigs } from "Utils/XAEnums"; +import { getPolicyPermissionItemDisplayLbl } from "Utils/XAUtils"; export const ServiceViewDetails = (props) => { const { serviceData: service, serviceDefData } = props; @@ -261,13 +262,17 @@ export const ServiceViewDetails = (props) => { </td> <td className="text-center"> {a.accessTypes !== undefined && a.accessTypes.length > 0 - ? a.accessTypes.map((accessType) => ( + ? getPolicyPermissionItemDisplayLbl( + serviceDefData, + 0, + a.accessTypes + ).map((accessType) => ( <Badge bg="info" className="m-1 text-truncate" - key={accessType} + key={accessType.label} > - {accessType} + {accessType.label} </Badge> )) : "--"}
