Miscellaneous fixes to coarse-grained authorization (#2766)

src/realm-roles/RealmRolesSection.tsx

@@ -4,10 +4,14 @@ import { ViewHeader } from "../components/view-header/ViewHeader";
 import { useAdminClient } from "../context/auth/AdminClient";
 import { RolesList } from "./RolesList";
 import helpUrls from "../help-urls";
+import { useAccess } from "../context/access/Access";
 
 export default function RealmRolesSection() {
   const adminClient = useAdminClient();
 
+  const { hasAccess } = useAccess();
+  const isManager = hasAccess("manage-realm");
+
   const loader = (first?: number, max?: number, search?: string) => {
     const params: { [name: string]: string | number } = {
       first: first!,
@@ -31,7 +35,7 @@ export default function RealmRolesSection() {
         helpUrl={helpUrls.realmRolesUrl}
       />
       <PageSection variant="light" padding={{ default: "noPadding" }}>
-        <RolesList loader={loader} />
+        <RolesList loader={loader} isReadOnly={!isManager} />
       </PageSection>
     </>
   );

src/realm-roles/RolesList.tsx

@@ -25,7 +25,7 @@ type RolesListProps = {
   paginated?: boolean;
   parentRoleId?: string;
   messageBundle?: string;
-  isReadOnly?: boolean;
+  isReadOnly: boolean;
   loader?: (
     first?: number,
     max?: number,
@@ -52,7 +52,7 @@ export const RolesList = ({
   paginated = true,
   parentRoleId,
   messageBundle = "roles",
-  isReadOnly = false,
+  isReadOnly,
 }: RolesListProps) => {
   const { t } = useTranslation(messageBundle);
   const history = useHistory();

src/user/UsersSection.tsx

@@ -50,6 +50,7 @@ import {
   routableTab,
   RoutableTabs,
 } from "../components/routable-tabs/RoutableTabs";
+import { useAccess } from "../context/access/Access";
 
 import "./user-section.css";
 
@@ -72,6 +73,9 @@ export default function UsersSection() {
   const [key, setKey] = useState(0);
   const refresh = () => setKey(key + 1);
 
+  const { hasAccess } = useAccess();
+  const isManager = hasAccess("manage-users");
+
   useFetch(
     async () => {
       const testParams = {
@@ -376,7 +380,7 @@ export default function UsersSection() {
                   />
                 )
               }
-              toolbarItem={toolbar}
+              toolbarItem={isManager ? toolbar : undefined}
               actionResolver={(rowData: IRowData) => {
                 const user: UserRepresentation = rowData.data;
                 if (!user.access?.manage) return [];