console: disable selecting roles without permissions for bulk actions (close #4178) (#4195)

CHANGELOG.md

@@ -102,4 +102,5 @@
 - console: add design system base components (#3866)
 - docs: add docs for redeliver_event API
 - option to reload remote schemas in 'reload_metadata' API (fix #3792, #4117)
+- console: disable selecting roles without permissions for bulk actions (close #4178) (#4195)
 - console: show remote schema / event trigger intro sections always (#4044)

console/src/components/Common/Permissions/TableRow.js

@@ -52,7 +52,8 @@ const TableRow = ({
             className={styles.cursorPointer}
             checked={bulkSection.checked}
             data-role={bulkSection.role}
-            title="Select for bulk actions"
+            disabled={bulkSection.disableCheckbox}
+            title={bulkSection.title}
             type="checkbox"
           />
           {/*{deleteIcon}*/}

console/src/components/Services/Data/TablePermissions/Permissions.js

@@ -286,6 +286,8 @@ class Permissions extends Component {
       };
 
       const getPermissionsTableBody = () => {
+        const rolePermissions = getTablePermissionsByRoles(tableSchema);
+
         const getBulkCheckbox = (role, isNewRole) => {
           const dispatchBulkSelect = e => {
             const isChecked = e.target.checked;
@@ -293,8 +295,12 @@ class Permissions extends Component {
             dispatch(permSetBulkSelect(isChecked, selectedRole));
           };
 
+          const disableCheckbox = !Object.keys(rolePermissions).includes(role);
+
           return {
             showCheckbox: !(role === 'admin' || isNewRole),
+            disableCheckbox,
+            title: disableCheckbox ? 'No permissions exist' : 'Select for bulk actions',
             bulkSelect: permissionsState.bulkSelect,
             onChange: dispatchBulkSelect,
             role,
@@ -335,8 +341,6 @@ class Permissions extends Component {
           const getRoleQueryPermission = queryType => {
             let _permission;
 
-            const rolePermissions = getTablePermissionsByRoles(tableSchema);
-
             if (role === 'admin') {
               _permission = permissionsSymbols.fullAccess;
             } else if (!Object.keys(rolePermissions).includes(role)) {