fix(rbac): disable edit when the user is unauthorized to read the catalog-entity (#1049)

Author: debsmita1

plugins/rbac/src/components/RoleOverview/MembersCard.tsx

@@ -1,6 +1,7 @@
 import React from 'react';
 
 import { Table, WarningPanel } from '@backstage/core-components';
+import { catalogEntityReadPermission } from '@backstage/plugin-catalog-common/alpha';
 import { usePermission } from '@backstage/plugin-permission-react';
 
 import { Card, CardContent, makeStyles } from '@material-ui/core';
@@ -43,10 +44,14 @@ const getEditIcon = (isAllowed: boolean, roleName: string) => {
 export const MembersCard = ({ roleName }: MembersCardProps) => {
   const { data, loading, retry, error } = useMembers(roleName);
   const [members, setMembers] = React.useState<MembersData[]>();
-  const permissionResult = usePermission({
+  const policyEntityPermissionResult = usePermission({
     permission: policyEntityUpdatePermission,
     resourceRef: policyEntityUpdatePermission.resourceType,
   });
+  const catalogEntityPermissionResult = usePermission({
+    permission: catalogEntityReadPermission,
+    resourceRef: catalogEntityReadPermission.resourceType,
+  });
 
   const classes = useStyles();
   const actions = [
@@ -57,8 +62,17 @@ export const MembersCard = ({ roleName }: MembersCardProps) => {
       onClick: () => retry(),
     },
     {
-      icon: () => getEditIcon(permissionResult.allowed, roleName),
-      tooltip: !permissionResult.allowed ? 'Unauthorized to edit' : 'Edit',
+      icon: () =>
+        getEditIcon(
+          policyEntityPermissionResult.allowed &&
+            catalogEntityPermissionResult.allowed,
+          roleName,
+        ),
+      tooltip:
+        catalogEntityPermissionResult.allowed &&
+        policyEntityPermissionResult.allowed
+          ? 'Edit'
+          : 'Unauthorized to edit',
       isFreeAction: true,
       onClick: () => {},
     },

plugins/rbac/src/hooks/useRoles.ts

@@ -81,13 +81,26 @@ export const useRoles = (
                 lastModified: '-',
                 actionsPermissionResults: {
                   delete: deletePermissionResult,
-                  edit: editPermissionResult,
+                  edit: {
+                    allowed:
+                      editPermissionResult.allowed &&
+                      catalogEntityReadPermissionResult.allowed,
+                    loading:
+                      editPermissionResult.loading &&
+                      catalogEntityReadPermissionResult.loading,
+                  },
                 },
               },
             ];
           }, [])
         : [],
-    [roles, policies, deletePermissionResult, editPermissionResult],
+    [
+      roles,
+      policies,
+      deletePermissionResult,
+      editPermissionResult,
+      catalogEntityReadPermissionResult,
+    ],
   );
   const loading = rolesLoading && policiesLoading;
   useInterval(