This is an automated email from the ASF dual-hosted git repository. dhavalshah9131 pushed a commit to branch master in repository https://gitbox.apache.org/repos/asf/ranger.git
commit 6b3bd1c85ccb5ed2c13e398e118c65484f92be58 Author: Brijesh Bhalala <brijeshbhalala2...@gmail.com> AuthorDate: Fri Sep 15 11:09:43 2023 +0530 RANGER-4381 : Difference in user lookup API request in permissions module page between React UI and BackBone UI --- .../main/webapp/react-webapp/src/styles/style.css | 3 +- .../src/views/PermissionsModule/EditPermission.jsx | 61 +++++++++++------ .../views/PolicyListing/AddUpdatePolicyForm.jsx | 2 +- .../src/views/SecurityZone/SecurityZoneForm.jsx | 74 +++++++++++--------- .../src/views/ServiceManager/ServiceForm.jsx | 79 +++++++++++----------- .../groups_details/GroupListing.jsx | 3 +- .../users_details/UserListing.jsx | 3 +- 7 files changed, 127 insertions(+), 98 deletions(-) diff --git a/security-admin/src/main/webapp/react-webapp/src/styles/style.css b/security-admin/src/main/webapp/react-webapp/src/styles/style.css index aaa54a380..6e8678a57 100644 --- a/security-admin/src/main/webapp/react-webapp/src/styles/style.css +++ b/security-admin/src/main/webapp/react-webapp/src/styles/style.css @@ -2529,7 +2529,8 @@ li.list-group-item:hover { background-color: #e9ecef; } .manage-service .dropdown-toggle:focus, -.manage-export .dropdown-toggle:focus { +.manage-export .dropdown-toggle:focus, +.manage-visibility .dropdown-toggle:focus { color: #0b7fad; background-color: #fff; border-color: #0062cc; diff --git a/security-admin/src/main/webapp/react-webapp/src/views/PermissionsModule/EditPermission.jsx b/security-admin/src/main/webapp/react-webapp/src/views/PermissionsModule/EditPermission.jsx index a3e55dfbd..5e51faf27 100755 --- a/security-admin/src/main/webapp/react-webapp/src/views/PermissionsModule/EditPermission.jsx +++ b/security-admin/src/main/webapp/react-webapp/src/views/PermissionsModule/EditPermission.jsx @@ -32,7 +32,7 @@ import { Loader } from "Components/CommonComponents"; import { fetchApi } from "Utils/fetchAPI"; import AsyncSelect from "react-select/async"; import { toast } from "react-toastify"; -import { cloneDeep, find, findIndex, reverse } from "lodash"; +import { cloneDeep, find, findIndex, isEmpty, map, reverse } from "lodash"; import { AccessResult } from "Utils/XAEnums"; import { CustomInfinteScroll, @@ -88,7 +88,7 @@ function reducer(state, action) { throw new Error(); } } -const EditPermission = (props) => { +const EditPermission = () => { let { permissionId } = useParams(); const navigate = useNavigate(); const toastId = useRef(null); @@ -211,18 +211,27 @@ const EditPermission = (props) => { }; const fetchGroups = async (inputValue) => { - let params = {}; + let params = { isVisible: 1 }; + let groupsOp = []; + if (inputValue) { params["name"] = inputValue || ""; } - const groupResp = await fetchApi({ - url: "xusers/groups", - params: params + + try { + const groupResp = await fetchApi({ + url: "xusers/groups", + params: params + }); + groupsOp = groupResp.data?.vXGroups; + } catch (error) { + console.error(`Error occurred while fetching Groups ! ${error}`); + serverError(error); + } + + return map(groupsOp, function (group) { + return { label: group.name, value: group.id }; }); - return groupResp.data.vXGroups.map(({ name, id }) => ({ - label: name, - value: id - })); }; const filterGrpOp = ({ data }) => { @@ -255,19 +264,27 @@ const EditPermission = (props) => { }; const fetchUsers = async (inputValue) => { - let params = {}; + let params = { isVisible: 1 }; + let usersOp = []; + if (inputValue) { params["name"] = inputValue || ""; } - const userResp = await fetchApi({ - url: "xusers/users", - params: params - }); - return userResp.data.vXUsers.map(({ name, id }) => ({ - label: name, - value: id - })); + try { + const userResp = await fetchApi({ + url: "xusers/users", + params: params + }); + usersOp = userResp.data?.vXUsers; + } catch (error) { + console.error(`Error occurred while fetching Users ! ${error}`); + serverError(error); + } + + return map(usersOp, function (user) { + return { label: user.name, value: user.id }; + }); }; const filterUsrOp = ({ data }) => { @@ -375,7 +392,7 @@ const EditPermission = (props) => { <Field className="form-control" name="selectGroups" - render={({ input, meta }) => ( + render={({ input }) => ( <div> {" "} <AsyncSelect @@ -469,7 +486,7 @@ const EditPermission = (props) => { </td> </tr> <tr> - {!_.isEmpty(selectedGrp) ? ( + {!isEmpty(selectedGrp) ? ( <td> {grploading ? ( <div className="permission-infinite-scroll text-center"> @@ -495,7 +512,7 @@ const EditPermission = (props) => { </td> )} - {!_.isEmpty(selectedUsr) ? ( + {!isEmpty(selectedUsr) ? ( <td> {usrloading ? ( <div className="permission-infinite-scroll text-center"> diff --git a/security-admin/src/main/webapp/react-webapp/src/views/PolicyListing/AddUpdatePolicyForm.jsx b/security-admin/src/main/webapp/react-webapp/src/views/PolicyListing/AddUpdatePolicyForm.jsx index 688831ea5..60cc1f268 100644 --- a/security-admin/src/main/webapp/react-webapp/src/views/PolicyListing/AddUpdatePolicyForm.jsx +++ b/security-admin/src/main/webapp/react-webapp/src/views/PolicyListing/AddUpdatePolicyForm.jsx @@ -198,7 +198,7 @@ export default function AddUpdatePolicyForm(props) { }; const fetchRolesData = async (inputValue) => { - let params = { roleNamePartial: inputValue || "", isVisible: 1 }; + let params = { roleNamePartial: inputValue || "" }; let op = []; const roleResp = await fetchApi({ diff --git a/security-admin/src/main/webapp/react-webapp/src/views/SecurityZone/SecurityZoneForm.jsx b/security-admin/src/main/webapp/react-webapp/src/views/SecurityZone/SecurityZoneForm.jsx index c506ee0f8..97e6d3b62 100644 --- a/security-admin/src/main/webapp/react-webapp/src/views/SecurityZone/SecurityZoneForm.jsx +++ b/security-admin/src/main/webapp/react-webapp/src/views/SecurityZone/SecurityZoneForm.jsx @@ -30,9 +30,9 @@ import { isEmpty, pickBy, find, - has, maxBy, - sortBy + sortBy, + map } from "lodash"; import { Table } from "react-bootstrap"; import { FieldArray } from "react-final-form-arrays"; @@ -60,7 +60,7 @@ const PromtDialog = (props) => { return null; }; -const SecurityZoneForm = (props) => { +const SecurityZoneForm = () => { const navigate = useNavigate(); const params = useParams(); const toastId = useRef(null); @@ -179,7 +179,7 @@ const SecurityZoneForm = (props) => { let resourceServices = []; - for (var key of Object.keys(servicesByType)) { + for (let key of Object.keys(servicesByType)) { resourceServices.push({ label: <span className="font-weight-bold text-body h6">{key}</span>, options: servicesByType[key].map((name) => { @@ -289,14 +289,14 @@ const SecurityZoneForm = (props) => { zoneData.description = values.description || ""; zoneData.adminUsers = []; if (values.adminUsers) { - for (var key of Object.keys(values.adminUsers)) { + for (let key of Object.keys(values.adminUsers)) { zoneData.adminUsers.push(values.adminUsers[key].value); } } zoneData.adminUserGroups = []; if (values.adminUserGroups) { - for (var key of Object.keys(values.adminUserGroups)) { + for (let key of Object.keys(values.adminUserGroups)) { zoneData.adminUserGroups.push(values.adminUserGroups[key].label || ""); } } @@ -304,14 +304,14 @@ const SecurityZoneForm = (props) => { zoneData.auditUsers = []; if (values.auditUsers) { - for (var key of Object.keys(values.auditUsers)) { + for (let key of Object.keys(values.auditUsers)) { zoneData.auditUsers.push(values.auditUsers[key].label || ""); } } zoneData.auditUserGroups = []; if (values.auditUserGroups) { - for (var key of Object.keys(values.auditUserGroups)) { + for (let key of Object.keys(values.auditUserGroups)) { zoneData.auditUserGroups.push(values.auditUserGroups[key].label || ""); } } @@ -319,14 +319,14 @@ const SecurityZoneForm = (props) => { zoneData.tagServices = []; if (values.tagServices) { - for (var key of Object.keys(values.tagServices)) { + for (let key of Object.keys(values.tagServices)) { zoneData.tagServices.push(values.tagServices[key].label || ""); } } zoneData.services = {}; - for (key of Object.keys(values.tableList)) { + for (let key of Object.keys(values.tableList)) { let serviceName = values.tableList[key].serviceName; let resourcesName = values.tableList[key].resources; zoneData.services[serviceName] = {}; @@ -373,7 +373,7 @@ const SecurityZoneForm = (props) => { setBlockUI(false); toast.dismiss(toastId.current); toast.current = toast.success( - `Success! Service zone ${apiSuccess} successfully` + `Success! Security zone ${apiSuccess} successfully` ); navigate(`/zones/zone/${zoneResp.data.id}`); } catch (error) { @@ -484,41 +484,51 @@ const SecurityZoneForm = (props) => { }; const fetchUsers = async (inputValue) => { - let params = {}, - op = []; + let params = { isVisible: 1 }; + let usersOp = []; + if (inputValue) { params["name"] = inputValue || ""; } - const userResp = await fetchApi({ - url: "xusers/users", - params: params - }); - if (userResp.data && userResp.data.vXUsers) { - op = userResp.data.vXUsers.map((obj) => { - return { - label: obj.name, - value: obj.name - }; + try { + const userResp = await fetchApi({ + url: "xusers/lookup/users", + params: params }); + usersOp = userResp.data?.vXStrings; + } catch (error) { + console.error(`Error occurred while fetching Users ! ${error}`); + serverError(error); } - return op; + return map(usersOp, function (user) { + return { value: user.value, label: user.value }; + }); }; const fetchGroups = async (inputValue) => { - let params = {}; + let params = { isVisible: 1 }; + let groupsOp = []; + if (inputValue) { params["name"] = inputValue || ""; } - const groupResp = await fetchApi({ - url: "xusers/groups", - params: params + + try { + const groupResp = await fetchApi({ + url: "xusers/lookup/groups", + params: params + }); + groupsOp = groupResp.data?.vXStrings; + } catch (error) { + console.error(`Error occurred while fetching Groups ! ${error}`); + serverError(error); + } + + return map(groupsOp, function (group) { + return { label: group.value, value: group.value }; }); - return groupResp.data.vXGroups.map(({ name }) => ({ - label: name, - value: name - })); }; const fetchTagServices = async (inputValue) => { diff --git a/security-admin/src/main/webapp/react-webapp/src/views/ServiceManager/ServiceForm.jsx b/security-admin/src/main/webapp/react-webapp/src/views/ServiceManager/ServiceForm.jsx index efddf8080..2df0c4d63 100644 --- a/security-admin/src/main/webapp/react-webapp/src/views/ServiceManager/ServiceForm.jsx +++ b/security-admin/src/main/webapp/react-webapp/src/views/ServiceManager/ServiceForm.jsx @@ -79,9 +79,6 @@ class ServiceForm extends Component { service: {}, tagService: [], editInitialValues: {}, - usersDataRef: null, - groupsDataRef: null, - rolesDataRef: null, showDelete: false, loader: true, blockUI: false, @@ -702,7 +699,7 @@ class ServiceForm extends Component { </Field> ); break; - case "enum": + case "enum": { const paramEnum = serviceDef.enums.find( (e) => e.name == configParam.subType ); @@ -760,6 +757,7 @@ class ServiceForm extends Component { </Field> ); break; + } case "bool": formField.push( <Field @@ -931,52 +929,58 @@ class ServiceForm extends Component { fetchUsers = async (inputValue) => { let params = { name: inputValue || "", isVisible: 1 }; let op = []; - const userResp = await fetchApi({ - url: "xusers/lookup/users", - params: params - }); - op = userResp?.data?.vXStrings; - return op?.map((obj) => ({ - label: obj.value, - value: obj.value - })); + try { + const userResp = await fetchApi({ + url: "xusers/lookup/users", + params: params + }); + op = userResp.data?.vXStrings; + } catch (error) { + console.error(`Error occurred while fetching Users ! ${error}`); + } + + return map(op, function (obj) { + return { value: obj.value, label: obj.value }; + }); }; fetchGroups = async (inputValue) => { let params = { name: inputValue || "", isVisible: 1 }; let op = []; - const userResp = await fetchApi({ - url: "xusers/lookup/groups", - params: params - }); - op = userResp?.data?.vXStrings; - if (!inputValue) { - this.state.groupsDataRef = op; + + try { + const groupResp = await fetchApi({ + url: "xusers/lookup/groups", + params: params + }); + op = groupResp.data?.vXStrings; + } catch (error) { + console.error(`Error occurred while fetching Groups ! ${error}`); } - return op?.map((obj) => ({ - label: obj.value, - value: obj.value - })); + return map(op, function (obj) { + return { label: obj.value, value: obj.value }; + }); }; fetchRoles = async (inputValue) => { - let params = { roleNamePartial: inputValue || "", isVisible: 1 }; + let params = { roleNamePartial: inputValue || "" }; let op = []; - const roleResp = await fetchApi({ - url: "roles/roles", - params: params - }); - op = roleResp.data.roles; - if (!inputValue) { - this.state.rolesDataRef = op; + + try { + const roleResp = await fetchApi({ + url: "roles/roles", + params: params + }); + op = roleResp.data?.roles; + } catch (error) { + console.error(`Error occurred while fetching Roles ! ${error}`); } - return op.map((obj) => ({ - label: obj.name, - value: obj.name - })); + return map(op, function (obj) { + return { label: obj.name, value: obj.name }; + }); }; ServiceDefnBreadcrumb = () => { let serviceDetails = {}; @@ -1034,13 +1038,12 @@ class ServiceForm extends Component { } render={({ handleSubmit, - form, submitting, values, invalid, errors, form: { - mutators: { push: addItem, pop: removeItem } + mutators: { push: addItem } } }) => ( <form diff --git a/security-admin/src/main/webapp/react-webapp/src/views/UserGroupRoleListing/groups_details/GroupListing.jsx b/security-admin/src/main/webapp/react-webapp/src/views/UserGroupRoleListing/groups_details/GroupListing.jsx index 2ba0ca068..332a3940d 100644 --- a/security-admin/src/main/webapp/react-webapp/src/views/UserGroupRoleListing/groups_details/GroupListing.jsx +++ b/security-admin/src/main/webapp/react-webapp/src/views/UserGroupRoleListing/groups_details/GroupListing.jsx @@ -578,8 +578,7 @@ function Groups() { <DropdownButton title="Set Visibility" size="sm" - style={{ display: "inline-block" }} - className="ml-2" + className="ml-2 d-inline-block manage-visibility" onSelect={handleSetVisibility} data-id="hideShowVisibility" data-cy="hideShowVisibility" diff --git a/security-admin/src/main/webapp/react-webapp/src/views/UserGroupRoleListing/users_details/UserListing.jsx b/security-admin/src/main/webapp/react-webapp/src/views/UserGroupRoleListing/users_details/UserListing.jsx index 1890168e5..dee4b196d 100644 --- a/security-admin/src/main/webapp/react-webapp/src/views/UserGroupRoleListing/users_details/UserListing.jsx +++ b/security-admin/src/main/webapp/react-webapp/src/views/UserGroupRoleListing/users_details/UserListing.jsx @@ -644,8 +644,7 @@ function Users() { <DropdownButton title="Set Visibility" size="sm" - style={{ display: "inline-block" }} - className="ml-1 btn-sm" + className="ml-1 d-inline-block manage-visibility" onSelect={handleSetVisibility} data-id="hideShowVisibility" data-cy="hideShowVisibility"