mirrors/object-browser
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Added permission tooltips, UI and text improvements for Policies screens (#2368)

Browse Source
This commit is contained in:
jinapurapu
2022-10-07 10:58:08 -07:00
committed by GitHub
parent 59b7406dd7
commit 48b467a683
4 changed files with 178 additions and 82 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
portal-ui/src/common/SecureComponent/permissions.ts
View File

@@ -515,3 +515,13 @@ export const enableDisableGroupPermissions = [
IAM_SCOPES.ADMIN_ENABLE_GROUP,
IAM_SCOPES.ADMIN_DISABLE_GROUP,
];
export const createPolicyPermissions = [IAM_SCOPES.ADMIN_CREATE_POLICY];
export const deletePolicyPermissions = [IAM_SCOPES.ADMIN_DELETE_POLICY];
export const listPolicyPermissions = [IAM_SCOPES.ADMIN_LIST_USER_POLICIES];
export const listGroupPermissions = [
IAM_SCOPES.ADMIN_LIST_GROUPS,
IAM_SCOPES.ADMIN_GET_GROUP,
];

55
portal-ui/src/screens/Console/Policies/ListPolicies.tsx
View File

@@ -39,8 +39,13 @@ import HelpBox from "../../../common/HelpBox";
import PageLayout from "../Common/Layout/PageLayout";
import {
CONSOLE_UI_RESOURCE,
createPolicyPermissions,
deletePolicyPermissions,
IAM_PAGES,
IAM_SCOPES,
listPolicyPermissions,
permissionTooltipHelper,
viewPolicyPermissions,
} from "../../../common/SecureComponent/permissions";
import {
hasPermission,
@@ -85,13 +90,25 @@ const ListPolicies = ({ classes }: IPoliciesProps) => {
IAM_SCOPES.ADMIN_GET_POLICY,
]);
const deletePolicy = hasPermission(CONSOLE_UI_RESOURCE, [
IAM_SCOPES.ADMIN_DELETE_POLICY,
]);
const canDeletePolicy = hasPermission(
CONSOLE_UI_RESOURCE,
deletePolicyPermissions
);
const displayPolicies = hasPermission(CONSOLE_UI_RESOURCE, [
IAM_SCOPES.ADMIN_LIST_USER_POLICIES,
]);
const canDisplayPolicies = hasPermission(
CONSOLE_UI_RESOURCE,
listPolicyPermissions
);
const canCreatePolicy = hasPermission(
CONSOLE_UI_RESOURCE,
createPolicyPermissions
);
const canViewPolicy = hasPermission(
CONSOLE_UI_RESOURCE,
viewPolicyPermissions
);
useEffect(() => {
fetchRecords();
@@ -99,7 +116,7 @@ const ListPolicies = ({ classes }: IPoliciesProps) => {
useEffect(() => {
if (loading) {
if (displayPolicies) {
if (canDisplayPolicies) {
api
.invoke("GET", `/api/v1/policies`)
.then((res: PolicyList) => {
@@ -128,7 +145,7 @@ const ListPolicies = ({ classes }: IPoliciesProps) => {
setLoading(false);
}
}
}, [loading, setLoading, setRecords, dispatch, displayPolicies]);
}, [loading, setLoading, setRecords, dispatch, canDisplayPolicies]);
const fetchRecords = () => {
setLoading(true);
@@ -161,7 +178,7 @@ const ListPolicies = ({ classes }: IPoliciesProps) => {
type: "delete",
onClick: confirmDeletePolicy,
sendOnlyId: true,
disableButtonFunction: () => !deletePolicy,
disableButtonFunction: () => !canDeletePolicy,
},
];
@@ -194,7 +211,16 @@ const ListPolicies = ({ classes }: IPoliciesProps) => {
resource={CONSOLE_UI_RESOURCE}
errorProps={{ disabled: true }}
>
<TooltipWrapper tooltip={"Create Policy"}>
<TooltipWrapper
tooltip={
canCreatePolicy
? ""
: permissionTooltipHelper(
createPolicyPermissions,
"create a Policy"
)
}
>
<Button
id={"create-policy"}
label={"Create Policy"}
@@ -203,6 +229,7 @@ const ListPolicies = ({ classes }: IPoliciesProps) => {
onClick={() => {
navigate(`${IAM_PAGES.POLICY_ADD}`);
}}
disabled={!canCreatePolicy}
/>
</TooltipWrapper>
</SecureComponent>
@@ -220,6 +247,14 @@ const ListPolicies = ({ classes }: IPoliciesProps) => {
records={filteredRecords}
entityName="Policies"
idField="name"
tooltip={
canViewPolicy
? ""
: permissionTooltipHelper(
viewPolicyPermissions,
"view Policy details"
)
}
/>
</SecureComponent>
</Grid>

190
portal-ui/src/screens/Console/Policies/PolicyDetails.tsx
View File

@@ -48,8 +48,16 @@ import VerticalTabs from "../Common/VerticalTabs/VerticalTabs";
import BackLink from "../../../common/BackLink";
import {
CONSOLE_UI_RESOURCE,
createPolicyPermissions,
deletePolicyPermissions,
getGroupPermissions,
IAM_PAGES,
IAM_SCOPES,
listGroupPermissions,
listUsersPermissions,
permissionTooltipHelper,
viewPolicyPermissions,
viewUserPermissions,
} from "../../../common/SecureComponent/permissions";
import {
hasPermission,
@@ -131,29 +139,45 @@ const PolicyDetails = ({ classes }: IPolicyDetailsProps) => {
const displayGroups = hasPermission(
CONSOLE_UI_RESOURCE,
[IAM_SCOPES.ADMIN_LIST_GROUPS, IAM_SCOPES.ADMIN_GET_GROUP],
listGroupPermissions,
true
);
const viewGroup = hasPermission(CONSOLE_UI_RESOURCE, [
IAM_SCOPES.ADMIN_GET_GROUP,
]);
const viewGroup = hasPermission(
CONSOLE_UI_RESOURCE,
getGroupPermissions,
true
);
const displayUsers = hasPermission(CONSOLE_UI_RESOURCE, [
IAM_SCOPES.ADMIN_LIST_GROUPS,
]);
const displayUsers = hasPermission(
CONSOLE_UI_RESOURCE,
listUsersPermissions,
true
);
const viewUser = hasPermission(CONSOLE_UI_RESOURCE, [
IAM_SCOPES.ADMIN_GET_USER,
]);
const viewUser = hasPermission(
CONSOLE_UI_RESOURCE,
viewUserPermissions,
true
);
const displayPolicy = hasPermission(CONSOLE_UI_RESOURCE, [
IAM_SCOPES.ADMIN_GET_POLICY,
]);
const displayPolicy = hasPermission(
CONSOLE_UI_RESOURCE,
viewPolicyPermissions,
true
);
const editPolicy = hasPermission(CONSOLE_UI_RESOURCE, [
IAM_SCOPES.ADMIN_CREATE_POLICY,
]);
const canDeletePolicy = hasPermission(
CONSOLE_UI_RESOURCE,
deletePolicyPermissions,
true
);
const canEditPolicy = hasPermission(
CONSOLE_UI_RESOURCE,
createPolicyPermissions,
true
);
const saveRecord = (event: React.FormEvent) => {
event.preventDefault();
@@ -161,7 +185,7 @@ const PolicyDetails = ({ classes }: IPolicyDetailsProps) => {
return;
}
setAddLoading(true);
if (editPolicy) {
if (canEditPolicy) {
api
.invoke("POST", "/api/v1/policies", {
name: policyName,
@@ -355,13 +379,23 @@ const PolicyDetails = ({ classes }: IPolicyDetailsProps) => {
resource={CONSOLE_UI_RESOURCE}
errorProps={{ disabled: true }}
>
<TooltipWrapper tooltip={"Delete Policy"}>
<TooltipWrapper
tooltip={
canDeletePolicy
? ""
: permissionTooltipHelper(
deletePolicyPermissions,
"delete Policies"
)
}
>
<Button
id={"delete-policy"}
label={"Delete Policy"}
variant="secondary"
icon={<TrashIcon />}
onClick={deletePolicy}
disabled={!canDeletePolicy}
/>
</TooltipWrapper>
</SecureComponent>
@@ -405,33 +439,34 @@ const PolicyDetails = ({ classes }: IPolicyDetailsProps) => {
<Fragment>
<div className={classes.sectionTitle}>Users</div>
<Grid container>
<Grid item xs={12} className={classes.actionsTray}>
<TextField
placeholder="Search Users"
className={classes.searchField}
id="search-resource"
label=""
onChange={(val) => {
setFilterUsers(val.target.value);
}}
InputProps={{
disableUnderline: true,
startAdornment: (
<InputAdornment position="start">
<SearchIcon />
</InputAdornment>
),
}}
variant="standard"
/>
</Grid>
{userList.length > 0 && (
<Grid item xs={12} className={classes.actionsTray}>
<TextField
placeholder="Search Users"
className={classes.searchField}
id="search-resource"
label=""
onChange={(val) => {
setFilterUsers(val.target.value);
}}
InputProps={{
disableUnderline: true,
startAdornment: (
<InputAdornment position="start">
<SearchIcon />
</InputAdornment>
),
}}
variant="standard"
/>
</Grid>
)}
<TableWrapper
itemActions={userTableActions}
columns={[{ label: "Name", elementKey: "name" }]}
isLoading={loadingUsers}
records={filteredUsers}
entityName="Users"
entityName="Users with this Policy associated"
idField="name"
/>
</Grid>
@@ -447,32 +482,34 @@ const PolicyDetails = ({ classes }: IPolicyDetailsProps) => {
<Fragment>
<div className={classes.sectionTitle}>Groups</div>
<Grid container>
<Grid item xs={12} className={classes.actionsTray}>
<TextField
placeholder="Search Groups"
className={classes.searchField}
id="search-resource"
label=""
onChange={(val) => {
setFilterGroups(val.target.value);
}}
InputProps={{
disableUnderline: true,
startAdornment: (
<InputAdornment position="start">
<SearchIcon />
</InputAdornment>
),
}}
variant="standard"
/>
</Grid>
{groupList.length > 0 && (
<Grid item xs={12} className={classes.actionsTray}>
<TextField
placeholder="Search Groups"
className={classes.searchField}
id="search-resource"
label=""
onChange={(val) => {
setFilterGroups(val.target.value);
}}
InputProps={{
disableUnderline: true,
startAdornment: (
<InputAdornment position="start">
<SearchIcon />
</InputAdornment>
),
}}
variant="standard"
/>
</Grid>
)}
<TableWrapper
itemActions={groupTableActions}
columns={[{ label: "Name", elementKey: "name" }]}
isLoading={loadingGroups}
records={filteredGroups}
entityName="Groups"
entityName="Groups with this Policy associated"
idField="name"
/>
</Grid>
@@ -494,7 +531,7 @@ const PolicyDetails = ({ classes }: IPolicyDetailsProps) => {
<Grid container>
<Grid item xs={12}>
<CodeMirrorWrapper
readOnly={!editPolicy}
readOnly={!canEditPolicy}
value={policyDefinition}
onBeforeChange={(editor, data, value) => {
setPolicyDefinition(value);
@@ -520,14 +557,27 @@ const PolicyDetails = ({ classes }: IPolicyDetailsProps) => {
resource={CONSOLE_UI_RESOURCE}
errorProps={{ disabled: true }}
>
<Button
id={"save"}
type="submit"
variant="callAction"
color="primary"
disabled={addLoading || !validSave}
label={"Save"}
/>
<TooltipWrapper
tooltip={
canEditPolicy
? ""
: permissionTooltipHelper(
createPolicyPermissions,
"edit a Policy"
)
}
>
<Button
id={"save"}
type="submit"
variant="callAction"
color="primary"
disabled={
addLoading || !validSave || !canEditPolicy
}
label={"Save"}
/>
</TooltipWrapper>
</SecureComponent>
</Grid>
{addLoading && (

5
portal-ui/tests/policies/users.json
View File

@@ -11,10 +11,11 @@
"admin:DisableUser",
"admin:ListUserPolicies",
"admin:ListGroups",
"admin:GetPolicy",
"admin:AttachUserOrGroupPolicy",
"admin:RemoveUserFromGroup",
"admin:AddUserToGroup",
"admin:GetPolicy"
"admin:RemoveUserFromGroup",
"admin:GetGroup"
],
"Effect": "Allow",
"Resource": ["arn:aws:s3:::*"],