From 4252b895e60a9ac97b8ac68d0b7e20833ba074af Mon Sep 17 00:00:00 2001 From: lavanya-bmw <106523828+lavanya-bmw@users.noreply.github.com> Date: Tue, 28 Nov 2023 17:41:44 +0530 Subject: [PATCH] update(user management): Updated app access management flow (#372) --- CHANGELOG.md | 2 + src/assets/locales/de/main.json | 11 ++- src/assets/locales/en/main.json | 11 ++- .../AddAppUserRoles/AddAppUserRoles.scss | 8 -- .../overlays/AddAppUserRoles/index.tsx | 99 +++++++++++++++---- 5 files changed, 96 insertions(+), 35 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index b4650666b..4e13b2bc4 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -9,6 +9,8 @@ - Document Hover Effect - Tech User Details - Fix crash issue +- User management + - Updated app access management flow - Overlays - Change Overlay Button from "Cancel" to "Close" diff --git a/src/assets/locales/de/main.json b/src/assets/locales/de/main.json index d27386032..dc472eb8a 100644 --- a/src/assets/locales/de/main.json +++ b/src/assets/locales/de/main.json @@ -878,9 +878,14 @@ } }, "addUserRight": { - "headline": "Benutzer hinzufügen", - "subheadline": "Auswählen und hinzufügen von Benutzern", - "noRolesFound": "No user roles found" + "headline": "Assign app roles to your user(s)", + "noRolesFound": "No user roles found", + "selectUsersDescription": "[abstract] Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.", + "addRolesDescription": "[abstract] Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.", + "confirmSelectedUsers": "Confirm selected users", + "confirmSelectedRoles": "Confirm selected roles", + "selectRoles": "Select Roles:", + "roleDescriptions": "Role Descriptions" }, "help": { "message": "Fügen Sie hier Inhalte hinzu" diff --git a/src/assets/locales/en/main.json b/src/assets/locales/en/main.json index 2a0128395..a9eda5e0e 100644 --- a/src/assets/locales/en/main.json +++ b/src/assets/locales/en/main.json @@ -878,9 +878,14 @@ } }, "addUserRight": { - "headline": "Add app permissions to your company user", - "subheadline": "Select one or multiple user roles with the checkboxes below as well as the relevant user/s which should receive the role.", - "noRolesFound": "No user roles found" + "headline": "Assign app roles to your user(s)", + "noRolesFound": "No user roles found", + "selectUsersDescription": "[abstract] Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.", + "addRolesDescription": "[abstract] Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.", + "confirmSelectedUsers": "Confirm selected users", + "confirmSelectedRoles": "Confirm selected roles", + "selectRoles": "Select Roles:", + "roleDescriptions": "Role Descriptions" }, "account": { "userAccount": "User account", diff --git a/src/components/overlays/AddAppUserRoles/AddAppUserRoles.scss b/src/components/overlays/AddAppUserRoles/AddAppUserRoles.scss index 2cd415a28..8a6b3d86e 100644 --- a/src/components/overlays/AddAppUserRoles/AddAppUserRoles.scss +++ b/src/components/overlays/AddAppUserRoles/AddAppUserRoles.scss @@ -27,11 +27,3 @@ .add-user-overlay-content { padding: 0px !important; } - -.add-user-overlay-content-roles { - padding: 0px 112px 56px; -} - -.add-user-overlay-content-content { - padding: 0px 32px 32px; -} diff --git a/src/components/overlays/AddAppUserRoles/index.tsx b/src/components/overlays/AddAppUserRoles/index.tsx index 77ce9614a..b3456476e 100644 --- a/src/components/overlays/AddAppUserRoles/index.tsx +++ b/src/components/overlays/AddAppUserRoles/index.tsx @@ -23,6 +23,7 @@ import { DialogContent, DialogHeader, Button, + Stepper, } from '@catena-x/portal-shared-components' import { useTranslation } from 'react-i18next' import { useParams } from 'react-router-dom' @@ -43,6 +44,8 @@ import { SuccessErrorType, } from 'features/admin/appuserApiSlice' import { setRolesToAdd } from 'features/admin/userDeprecated/actions' +import { Box, Typography } from '@mui/material' +import { useState } from 'react' export default function AddAppUserRoles() { const { t } = useTranslation() @@ -51,7 +54,7 @@ export default function AddAppUserRoles() { const roles = useSelector(rolesToAddSelector) const users = useSelector(selectedUserSelector) - + const [activeStep, setActiveStep] = useState(1) const [updateUserRoles] = useUpdateUserRolesMutation() const handleConfirm = async () => { @@ -79,39 +82,93 @@ export default function AddAppUserRoles() { dispatch(setRolesToAdd([])) } + const AddStepsList = [ + { + headline: 'Search & Select Users', + step: 1, + color: '#0F71CB', + }, + { + headline: 'Add Roles', + step: 2, + }, + ] + return ( <> -
- -
- -
- +
+
+ {activeStep === 1 && ( + + + {t('content.addUserRight.selectUsersDescription')} + + + + + + )} + {activeStep === 2 && ( + + + {t('content.addUserRight.addRolesDescription')} + + + + {t('content.addUserRight.selectRoles')} + + + + + {`> ${t( + 'content.addUserRight.roleDescriptions' + )}`} + + + + + )} - - + {activeStep === 1 ? ( + + ) : ( + <> + + + + )} )