From 9bd5075caaf03c329f6bdc24ca61738cb1a9cf62 Mon Sep 17 00:00:00 2001
From: Stan Silvert <ssilvert@redhat.com>
Date: Wed, 14 Aug 2024 03:49:48 -0400
Subject: [PATCH] Hide User Reg tab if you don't have permissions (#32021)

Fixes #31920

Signed-off-by: Stan Silvert <ssilvert@redhat.com>
(cherry picked from commit 35fbcf5af8eae283fcb83f1152ebaecf3e8fecef)
---
 .../src/realm-settings/DefaultGroupsTab.tsx   | 116 ++++++++++--------
 .../src/realm-settings/RealmSettingsTabs.tsx  |  18 +--
 2 files changed, 74 insertions(+), 60 deletions(-)

diff --git a/js/apps/admin-ui/src/realm-settings/DefaultGroupsTab.tsx b/js/apps/admin-ui/src/realm-settings/DefaultGroupsTab.tsx
index 71071f02f86..c1f9b0da11d 100644
--- a/js/apps/admin-ui/src/realm-settings/DefaultGroupsTab.tsx
+++ b/js/apps/admin-ui/src/realm-settings/DefaultGroupsTab.tsx
@@ -31,6 +31,7 @@ import { useRealm } from "../context/realm-context/RealmContext";
 import { toUserFederation } from "../user-federation/routes/UserFederation";
 import { useFetch } from "../utils/useFetch";
 import useToggle from "../utils/useToggle";
+import { useAccess } from "../context/access/Access";
 
 export const DefaultsGroupsTab = () => {
   const { adminClient } = useAdminClient();
@@ -50,6 +51,9 @@ export const DefaultsGroupsTab = () => {
   const { addAlert, addError } = useAlerts();
   const { enabled } = useHelp();
 
+  const { hasAccess } = useAccess();
+  const canAddOrRemoveGroups = hasAccess("view-users", "manage-realm");
+
   useFetch(
     () => adminClient.realms.getDefaultGroups({ realm }),
     (groups) => {
@@ -160,59 +164,65 @@ export const DefaultsGroupsTab = () => {
         ariaLabelKey="defaultGroups"
         searchPlaceholderKey="searchForGroups"
         toolbarItem={
-          <>
-            <ToolbarItem>
-              <Button
-                data-testid="openCreateGroupModal"
-                variant="primary"
-                onClick={toggleGroupPicker}
-              >
-                {t("addGroups")}
-              </Button>
-            </ToolbarItem>
-            <ToolbarItem>
-              <Dropdown
-                onOpenChange={toggleKebab}
-                toggle={(ref) => (
-                  <MenuToggle
-                    ref={ref}
-                    isExpanded={isKebabOpen}
-                    variant="plain"
-                    onClick={toggleKebab}
-                    isDisabled={selectedRows!.length === 0}
-                  >
-                    <EllipsisVIcon />
-                  </MenuToggle>
-                )}
-                isOpen={isKebabOpen}
-                shouldFocusToggleOnSelect
-              >
-                <DropdownList>
-                  <DropdownItem
-                    key="action"
-                    component="button"
-                    onClick={() => {
-                      toggleRemoveDialog();
-                      toggleKebab();
-                    }}
-                  >
-                    {t("remove")}
-                  </DropdownItem>
-                </DropdownList>
-              </Dropdown>
-            </ToolbarItem>
-          </>
+          canAddOrRemoveGroups && (
+            <>
+              <ToolbarItem>
+                <Button
+                  data-testid="openCreateGroupModal"
+                  variant="primary"
+                  onClick={toggleGroupPicker}
+                >
+                  {t("addGroups")}
+                </Button>
+              </ToolbarItem>
+              <ToolbarItem>
+                <Dropdown
+                  onOpenChange={toggleKebab}
+                  toggle={(ref) => (
+                    <MenuToggle
+                      ref={ref}
+                      isExpanded={isKebabOpen}
+                      variant="plain"
+                      onClick={toggleKebab}
+                      isDisabled={selectedRows!.length === 0}
+                    >
+                      <EllipsisVIcon />
+                    </MenuToggle>
+                  )}
+                  isOpen={isKebabOpen}
+                  shouldFocusToggleOnSelect
+                >
+                  <DropdownList>
+                    <DropdownItem
+                      key="action"
+                      component="button"
+                      onClick={() => {
+                        toggleRemoveDialog();
+                        toggleKebab();
+                      }}
+                    >
+                      {t("remove")}
+                    </DropdownItem>
+                  </DropdownList>
+                </Dropdown>
+              </ToolbarItem>
+            </>
+          )
+        }
+        actions={
+          canAddOrRemoveGroups
+            ? [
+                {
+                  title: t("remove"),
+                  onRowClick: (group) => {
+                    setSelectedRows([group]);
+                    toggleRemoveDialog();
+                    return Promise.resolve(false);
+                  },
+                } as Action<GroupRepresentation>,
+              ]
+            : []
         }
-        actions={[
-          {
-            title: t("remove"),
-            onRowClick: (group) => {
-              setSelectedRows([group]);
-              toggleRemoveDialog();
-              return Promise.resolve(false);
-            },
-          } as Action<GroupRepresentation>,
-        ]}
         columns={[
           {
             name: "name",
@@ -239,7 +249,7 @@ export const DefaultsGroupsTab = () => {
                 Add groups...
               </Trans>
             }
-            primaryActionText={t("addGroups")}
+            primaryActionText={canAddOrRemoveGroups ? t("addGroups") : ""}
             onPrimaryAction={toggleGroupPicker}
           />
         }
diff --git a/js/apps/admin-ui/src/realm-settings/RealmSettingsTabs.tsx b/js/apps/admin-ui/src/realm-settings/RealmSettingsTabs.tsx
index 5e630de9563..db0bfa98e07 100644
--- a/js/apps/admin-ui/src/realm-settings/RealmSettingsTabs.tsx
+++ b/js/apps/admin-ui/src/realm-settings/RealmSettingsTabs.tsx
@@ -296,6 +296,8 @@ export const RealmSettingsTabs = () => {
   const { hasAccess, hasSomeAccess } = useAccess();
   const canViewOrManageEvents =
     hasAccess("view-realm") && hasSomeAccess("view-events", "manage-events");
+  const canViewUserRegistration =
+    hasAccess("view-realm") && hasSomeAccess("view-clients", "manage-clients");
 
   const useClientPoliciesTab = (tab: ClientPoliciesTab) =>
     useRoutableTab(
@@ -458,13 +460,15 @@ export const RealmSettingsTabs = () => {
           >
             <UserProfileTab setTableData={setTableData as any} />
           </Tab>
-          <Tab
-            title={<TabTitleText>{t("userRegistration")}</TabTitleText>}
-            data-testid="rs-userRegistration-tab"
-            {...userRegistrationTab}
-          >
-            <UserRegistration />
-          </Tab>
+          {canViewUserRegistration && (
+            <Tab
+              title={<TabTitleText>{t("userRegistration")}</TabTitleText>}
+              data-testid="rs-userRegistration-tab"
+              {...userRegistrationTab}
+            >
+              <UserRegistration />
+            </Tab>
+          )}
         </RoutableTabs>
       </PageSection>
     </>