Mirrors/unleash.unleash
1
0
Fork 0
mirror of https://github.com/Unleash/unleash.git synced 2025-01-31 00:16:47 +01:00
Code Issues Projects Releases Wiki Activity

fix: role permissions UI improvements (#5388)

Browse Source 
https://linear.app/unleash/issue/2-1657/role-permissions-improvements

This PR includes 3 improvements:
 - Sort permissions alphabetically
 - Ensure we don't display duplicate permissions
 - Improve alignment of columns by using a proper grid


![image](https://github.com/Unleash/unleash/assets/14320932/7cb4a70e-8e39-4077-95a0-66f29b3c2e55)
This commit is contained in:
Nuno Góis 2023-11-23 09:43:15 +00:00 committed by GitHub
parent ce01687e3b
commit 7d2fd172a5
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 34 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
frontend/src/component/admin/roles/RoleForm/PermissionAccordion/PermissionAccordion.tsx
View File

@ -139,15 +139,15 @@ export const PermissionAccordion: VFC<IEnvironmentPermissionAccordionProps> = ({
{isAllChecked ? 'Unselect ' : 'Select '}
all {context} permissions
</Button>
<Box>
<Box
display='grid'
gridTemplateColumns={{
sm: '1fr 1fr',
xs: '1fr',
}}
>
{permissions?.map((permission: IPermission) => (
<FormControlLabel
sx={{
minWidth: {
sm: '300px',
xs: 'auto',
},
}}
data-testid={getRoleKey(permission)}
key={getRoleKey(permission)}
control={

31
frontend/src/utils/permissions.ts
View File

@ -75,8 +75,8 @@ export const toggleAllPermissions = (
export const getCategorizedRootPermissions = (permissions: IPermission[]) => {
const rootPermissions = permissions.filter(({ name }) => name !== 'ADMIN');
return rootPermissions
.reduce((categories: IPermissionCategory[], permission) => {
const categories = rootPermissions.reduce(
(categories: IPermissionCategory[], permission) => {
const categoryLabel =
ROOT_PERMISSION_CATEGORIES.find((category) =>
category.permissions.includes(permission.name),
@ -97,7 +97,21 @@ export const getCategorizedRootPermissions = (permissions: IPermission[]) => {
}
return categories;
}, [])
},
[],
);
return categories
.map((category) => ({
...category,
permissions: [
...new Set(
category.permissions.sort((a, b) =>
a.displayName.localeCompare(b.displayName),
),
),
],
}))
.sort(sortCategories);
};
@ -146,7 +160,16 @@ export const getCategorizedProjectPermissions = (
),
);
return categories;
return categories.map((category) => ({
...category,
permissions: [
...new Set(
category.permissions.sort((a, b) =>
a.displayName.localeCompare(b.displayName),
),
),
],
}));
};
export const flattenProjectPermissions = (