Permissions Tooltip guidance for ListUsers and UserDetails screens (#2347)

2022-10-05 16:34:31 -07:00
parent de82a056e6
commit 333ca0a827
4 changed files with 260 additions and 63 deletions
--- a/portal-ui/src/common/SecureComponent/permissions.ts
+++ b/portal-ui/src/common/SecureComponent/permissions.ts
@@ -447,3 +447,35 @@ export const permissionTooltipHelper = (scopes: string[], name: string) => {
    "."
  );
 };
+
+export const listUsersPermissions = [IAM_SCOPES.ADMIN_LIST_USERS];
+export const viewUserPermissions = [IAM_SCOPES.ADMIN_GET_USER];
+export const addUserToGroupPermissions = [IAM_SCOPES.ADMIN_ADD_USER_TO_GROUP];
+export const deleteUserPermissions = [IAM_SCOPES.ADMIN_DELETE_USER];
+export const enableUserPermissions = [IAM_SCOPES.ADMIN_ENABLE_USER];
+export const disableUserPermissions = [IAM_SCOPES.ADMIN_DISABLE_USER];
+export const assignIAMPolicyPermissions = [
+  IAM_SCOPES.ADMIN_ATTACH_USER_OR_GROUP_POLICY,
+  IAM_SCOPES.ADMIN_LIST_USER_POLICIES,
+  IAM_SCOPES.ADMIN_GET_POLICY,
+];
+
+export const assignGroupPermissions = [
+  IAM_SCOPES.ADMIN_ADD_USER_TO_GROUP,
+  IAM_SCOPES.ADMIN_REMOVE_USER_FROM_GROUP,
+  IAM_SCOPES.ADMIN_LIST_GROUPS,
+  IAM_SCOPES.ADMIN_ENABLE_USER,
+];
+
+export const getGroupPermissions = [IAM_SCOPES.ADMIN_GET_GROUP];
+
+export const enableDisableUserPermissions = [
+  IAM_SCOPES.ADMIN_ENABLE_USER,
+  IAM_SCOPES.ADMIN_DISABLE_USER,
+];
+
+export const editServiceAccountPermissions = [
+  IAM_SCOPES.ADMIN_LIST_SERVICEACCOUNTS,
+  IAM_SCOPES.ADMIN_UPDATE_SERVICEACCOUNT,
+  IAM_SCOPES.ADMIN_REMOVE_SERVICEACCOUNT,
+];
--- a/portal-ui/src/screens/Console/Users/ListUsers.tsx
+++ b/portal-ui/src/screens/Console/Users/ListUsers.tsx
@@ -43,10 +43,15 @@ import PageLayout from "../Common/Layout/PageLayout";
 import SearchBox from "../Common/SearchBox";
 import withSuspense from "../Common/Components/withSuspense";
 import {
+  addUserToGroupPermissions,
  CONSOLE_UI_RESOURCE,
+  deleteUserPermissions,
  IAM_PAGES,
  IAM_SCOPES,
+  listUsersPermissions,
+  permissionTooltipHelper,
  S3_ALL_RESOURCES,
+  viewUserPermissions,
 } from "../../../common/SecureComponent/permissions";

 import {
@@ -88,21 +93,19 @@ const ListUsers = ({ classes }: IUsersProps) => {
  const [filter, setFilter] = useState<string>("");
  const [checkedUsers, setCheckedUsers] = useState<string[]>([]);

-  const displayListUsers = hasPermission(CONSOLE_UI_RESOURCE, [
-    IAM_SCOPES.ADMIN_LIST_USERS,
-  ]);
+  const displayListUsers = hasPermission(
+    CONSOLE_UI_RESOURCE,
+    listUsersPermissions
+  );

-  const viewUser = hasPermission(CONSOLE_UI_RESOURCE, [
-    IAM_SCOPES.ADMIN_GET_USER,
-  ]);
+  const viewUser = hasPermission(CONSOLE_UI_RESOURCE, viewUserPermissions);

-  const addUserToGroup = hasPermission(CONSOLE_UI_RESOURCE, [
-    IAM_SCOPES.ADMIN_ADD_USER_TO_GROUP,
-  ]);
+  const addUserToGroup = hasPermission(
+    CONSOLE_UI_RESOURCE,
+    addUserToGroupPermissions
+  );

-  const deleteUser = hasPermission(CONSOLE_UI_RESOURCE, [
-    IAM_SCOPES.ADMIN_DELETE_USER,
-  ]);
+  const deleteUser = hasPermission(CONSOLE_UI_RESOURCE, deleteUserPermissions);

  const closeDeleteModalAndRefresh = (refresh: boolean) => {
    setDeleteOpen(false);
@@ -216,7 +219,18 @@ const ListUsers = ({ classes }: IUsersProps) => {
            matchAll
            errorProps={{ disabled: true }}
          >
-            <TooltipWrapper tooltip={"Delete Selected"}>
+            <TooltipWrapper
+              tooltip={
+                hasPermission("console", [IAM_SCOPES.ADMIN_DELETE_USER])
+                  ? checkedUsers.length === 0
+                    ? "Select Users to delete"
+                    : "Delete Selected"
+                  : permissionTooltipHelper(
+                      [IAM_SCOPES.ADMIN_DELETE_USER],
+                      "delete users"
+                    )
+              }
+            >
              <Button
                id={"delete-selected-users"}
                onClick={() => {
@@ -235,7 +249,18 @@ const ListUsers = ({ classes }: IUsersProps) => {
            resource={CONSOLE_UI_RESOURCE}
            errorProps={{ disabled: true }}
          >
-            <TooltipWrapper tooltip={"Add to Group"}>
+            <TooltipWrapper
+              tooltip={
+                hasPermission("console", [IAM_SCOPES.ADMIN_ADD_USER_TO_GROUP])
+                  ? checkedUsers.length === 0
+                    ? "Select Users to group"
+                    : "Add to Group"
+                  : permissionTooltipHelper(
+                      [IAM_SCOPES.ADMIN_ADD_USER_TO_GROUP],
+                      "add users to groups"
+                    )
+              }
+            >
              <Button
                id={"add-to-group"}
                label={"Add to Group"}
@@ -260,7 +285,30 @@ const ListUsers = ({ classes }: IUsersProps) => {
            matchAll
            errorProps={{ disabled: true }}
          >
-            <TooltipWrapper tooltip={"Create User"}>
+            <TooltipWrapper
+              tooltip={
+                hasPermission(
+                  "console",
+                  [
+                    IAM_SCOPES.ADMIN_CREATE_USER,
+                    IAM_SCOPES.ADMIN_LIST_USER_POLICIES,
+                    IAM_SCOPES.ADMIN_LIST_GROUPS,
+                    IAM_SCOPES.ADMIN_ATTACH_USER_OR_GROUP_POLICY,
+                  ],
+                  true
+                )
+                  ? "Create User"
+                  : permissionTooltipHelper(
+                      [
+                        IAM_SCOPES.ADMIN_CREATE_USER,
+                        IAM_SCOPES.ADMIN_LIST_USER_POLICIES,
+                        IAM_SCOPES.ADMIN_LIST_GROUPS,
+                        IAM_SCOPES.ADMIN_ATTACH_USER_OR_GROUP_POLICY,
+                      ],
+                      "create users"
+                    )
+              }
+            >
              <Button
                id={"create-user"}
                label={"Create User"}
@@ -269,6 +317,18 @@ const ListUsers = ({ classes }: IUsersProps) => {
                  navigate(`${IAM_PAGES.USER_ADD}`);
                }}
                variant={"callAction"}
+                disabled={
+                  !hasPermission(
+                    "console",
+                    [
+                      IAM_SCOPES.ADMIN_CREATE_USER,
+                      IAM_SCOPES.ADMIN_LIST_USER_POLICIES,
+                      IAM_SCOPES.ADMIN_LIST_GROUPS,
+                      IAM_SCOPES.ADMIN_ATTACH_USER_OR_GROUP_POLICY,
+                    ],
+                    true
+                  )
+                }
              />
            </TooltipWrapper>
          </SecureComponent>
@@ -279,35 +339,46 @@ const ListUsers = ({ classes }: IUsersProps) => {
          <Fragment>
            {records.length > 0 && (
              <Fragment>
-                <Grid
-                  item
-                  xs={12}
-                  className={classes.tableBlock}
-                  marginBottom={"15px"}
+                <TooltipWrapper
+                  tooltip={
+                    viewUser
+                      ? ""
+                      : permissionTooltipHelper(
+                          [IAM_SCOPES.ADMIN_GET_USER],
+                          "view user details"
+                        )
+                  }
                >
-                  <SecureComponent
-                    scopes={[IAM_SCOPES.ADMIN_LIST_USERS]}
-                    resource={CONSOLE_UI_RESOURCE}
-                    errorProps={{ disabled: true }}
+                  <Grid
+                    item
+                    xs={12}
+                    className={classes.tableBlock}
+                    marginBottom={"15px"}
                  >
-                    <TableWrapper
-                      itemActions={tableActions}
-                      columns={[
-                        { label: "Access Key", elementKey: "accessKey" },
-                      ]}
-                      onSelect={
-                        addUserToGroup || deleteUser
-                          ? selectionChanged
-                          : undefined
-                      }
-                      selectedItems={checkedUsers}
-                      isLoading={loading}
-                      records={filteredRecords}
-                      entityName="Users"
-                      idField="accessKey"
-                    />
-                  </SecureComponent>
-                </Grid>
+                    <SecureComponent
+                      scopes={[IAM_SCOPES.ADMIN_LIST_USERS]}
+                      resource={CONSOLE_UI_RESOURCE}
+                      errorProps={{ disabled: true }}
+                    >
+                      <TableWrapper
+                        itemActions={tableActions}
+                        columns={[
+                          { label: "Access Key", elementKey: "accessKey" },
+                        ]}
+                        onSelect={
+                          addUserToGroup || deleteUser
+                            ? selectionChanged
+                            : undefined
+                        }
+                        selectedItems={checkedUsers}
+                        isLoading={loading}
+                        records={filteredRecords}
+                        entityName="Users"
+                        idField="accessKey"
+                      />
+                    </SecureComponent>
+                  </Grid>
+                </TooltipWrapper>
                <HelpBox
                  title={"Users"}
                  iconComponent={<UsersIcon />}
--- a/portal-ui/src/screens/Console/Users/UserDetails.tsx
+++ b/portal-ui/src/screens/Console/Users/UserDetails.tsx
@@ -55,9 +55,17 @@ import BackLink from "../../../common/BackLink";
 import { decodeURLString, encodeURLString } from "../../../common/utils";
 import { setModalErrorSnackMessage } from "../../../systemSlice";
 import {
+  assignGroupPermissions,
+  assignIAMPolicyPermissions,
  CONSOLE_UI_RESOURCE,
+  deleteUserPermissions,
+  disableUserPermissions,
+  editServiceAccountPermissions,
+  enableDisableUserPermissions,
+  enableUserPermissions,
+  getGroupPermissions,
  IAM_PAGES,
-  IAM_SCOPES,
+  permissionTooltipHelper,
 } from "../../../common/SecureComponent/permissions";
 import { hasPermission } from "../../../common/SecureComponent";
 import { useAppDispatch } from "../../../store";
@@ -111,6 +119,11 @@ const UserDetails = ({ classes }: IUserDetailsProps) => {
  const [deleteOpen, setDeleteOpen] = useState<boolean>(false);
  const [hasPolicy, setHasPolicy] = useState<boolean>(false);

+  const enableEnabled =
+    hasPermission(CONSOLE_UI_RESOURCE, enableUserPermissions) && !enabled;
+  const disableEnabled =
+    hasPermission(CONSOLE_UI_RESOURCE, disableUserPermissions) && enabled;
+
  const userName = decodeURLString(params.userName || "");

  const changeUserPassword = () => {
@@ -121,9 +134,19 @@ const UserDetails = ({ classes }: IUserDetailsProps) => {
    setDeleteOpen(true);
  };

-  const viewGroup = hasPermission(CONSOLE_UI_RESOURCE, [
-    IAM_SCOPES.ADMIN_GET_GROUP,
-  ]);
+  const userLoggedIn = localStorage.getItem("userLoggedIn") || "";
+  const canAssignPolicy = hasPermission(
+    CONSOLE_UI_RESOURCE,
+    assignIAMPolicyPermissions,
+    true
+  );
+  const canAssignGroup = hasPermission(
+    CONSOLE_UI_RESOURCE,
+    assignGroupPermissions,
+    true
+  );
+
+  const viewGroup = hasPermission(CONSOLE_UI_RESOURCE, getGroupPermissions);

  const getUserInformation = useCallback(() => {
    if (userName === "") {
@@ -270,25 +293,69 @@ const UserDetails = ({ classes }: IUserDetailsProps) => {
                <span className={classes.statusValue}>
                  {enabled ? "Enabled" : "Disabled"}
                </span>
-                <FormSwitchWrapper
-                  indicatorLabels={["Enabled", "Disabled"]}
-                  checked={enabled}
-                  value={"group_enabled"}
-                  id="group-status"
-                  name="group-status"
-                  onChange={() => {
-                    setEnabled(!enabled);
-                    saveRecord(!enabled);
-                  }}
-                  switchOnly
-                />
-
-                <TooltipWrapper tooltip={"Delete User"}>
+                <TooltipWrapper
+                  tooltip={
+                    enableEnabled || disableEnabled
+                      ? ""
+                      : hasPermission(
+                          CONSOLE_UI_RESOURCE,
+                          enableUserPermissions
+                        )
+                      ? permissionTooltipHelper(
+                          disableUserPermissions,
+                          "disable users"
+                        )
+                      : hasPermission(
+                          CONSOLE_UI_RESOURCE,
+                          disableUserPermissions
+                        )
+                      ? permissionTooltipHelper(
+                          enableUserPermissions,
+                          "enable users"
+                        )
+                      : permissionTooltipHelper(
+                          enableDisableUserPermissions,
+                          "enable or disable users"
+                        )
+                  }
+                >
+                  <FormSwitchWrapper
+                    indicatorLabels={["Enabled", "Disabled"]}
+                    checked={enabled}
+                    value={"group_enabled"}
+                    id="group-status"
+                    name="group-status"
+                    onChange={() => {
+                      setEnabled(!enabled);
+                      saveRecord(!enabled);
+                    }}
+                    switchOnly
+                    disabled={!enableEnabled && !disableEnabled}
+                  />
+                </TooltipWrapper>
+                <TooltipWrapper
+                  tooltip={
+                    hasPermission(CONSOLE_UI_RESOURCE, deleteUserPermissions)
+                      ? userLoggedIn === userName
+                        ? "You cannot delete the currently logged in User"
+                        : "Delete User"
+                      : permissionTooltipHelper(
+                          deleteUserPermissions,
+                          "delete user"
+                        )
+                  }
+                >
                  <Button
                    id={"delete-user"}
                    onClick={deleteUser}
                    icon={<TrashIcon />}
                    variant={"secondary"}
+                    disabled={
+                      !hasPermission(
+                        CONSOLE_UI_RESOURCE,
+                        deleteUserPermissions
+                      ) || userLoggedIn === userName
+                    }
                  />
                </TooltipWrapper>

@@ -310,12 +377,22 @@ const UserDetails = ({ classes }: IUserDetailsProps) => {
            {{
              tabConfig: {
                label: "Groups",
+                disabled: !canAssignGroup,
              },
              content: (
                <React.Fragment>
                  <div className={classes.actionsTray}>
                    <PanelTitle>Groups</PanelTitle>
-                    <TooltipWrapper tooltip={"Add to Groups"}>
+                    <TooltipWrapper
+                      tooltip={
+                        canAssignGroup
+                          ? "Assign groups"
+                          : permissionTooltipHelper(
+                              assignGroupPermissions,
+                              "add users to groups"
+                            )
+                      }
+                    >
                      <Button
                        id={"add-groups"}
                        label={"Add to Groups"}
@@ -324,6 +401,7 @@ const UserDetails = ({ classes }: IUserDetailsProps) => {
                        }}
                        icon={<AddIcon />}
                        variant={"callAction"}
+                        disabled={!canAssignGroup}
                      />
                    </TooltipWrapper>
                  </div>
@@ -343,6 +421,10 @@ const UserDetails = ({ classes }: IUserDetailsProps) => {
            {{
              tabConfig: {
                label: "Service Accounts",
+                disabled: !hasPermission(
+                  CONSOLE_UI_RESOURCE,
+                  editServiceAccountPermissions
+                ),
              },
              content: (
                <UserServiceAccountsPanel
@@ -354,13 +436,23 @@ const UserDetails = ({ classes }: IUserDetailsProps) => {
            {{
              tabConfig: {
                label: "Policies",
+                disabled: !canAssignPolicy,
              },
              content: (
                <Fragment>
                  <div className={classes.actionsTray}>
                    <PanelTitle>Policies</PanelTitle>

-                    <TooltipWrapper tooltip={"Assign Policies"}>
+                    <TooltipWrapper
+                      tooltip={
+                        canAssignPolicy
+                          ? "Assign Policies"
+                          : permissionTooltipHelper(
+                              assignIAMPolicyPermissions,
+                              "assign policies"
+                            )
+                      }
+                    >
                      <Button
                        id={"assign-policies"}
                        label={"Assign Policies"}
@@ -369,6 +461,7 @@ const UserDetails = ({ classes }: IUserDetailsProps) => {
                        }}
                        icon={<IAMPoliciesIcon />}
                        variant={"callAction"}
+                        disabled={!canAssignPolicy}
                      />
                    </TooltipWrapper>
                  </div>
--- a/portal-ui/tests/policies/users.json
+++ b/portal-ui/tests/policies/users.json
@@ -13,7 +13,8 @@
        "admin:ListGroups",
        "admin:AttachUserOrGroupPolicy",
        "admin:RemoveUserFromGroup",
-        "admin:AddUserToGroup"
+        "admin:AddUserToGroup",
+        "admin:GetPolicy"
      ],
      "Effect": "Allow",
      "Resource": ["arn:aws:s3:::*"],