No tooltip or warning shown for roles with limited UI availability

[eve-scality]

Analysis Report

Root Cause

The role selection modal in AccountRoleSelectButtonAndModal.tsx renders a table of IAM roles where the Role Name column's Cell renderer (line 30-48) only checks if a role is in SCALITY_INTERNAL_ROLES to show a generic "This is a Scality predefined Role" tooltip. For all other roles — including storage-consumer-role and any custom IAM roles — the else branch simply returns the bare role name with no tooltip, warning, or indicator about limited UI availability.

The root issue has two parts:

1. Missing storage-consumer-role constant: The SCALITY_INTERNAL_ROLES array in hooks.ts (line 142-147) only includes storage-manager-role, storage-account-owner-role, data-consumer-role, and data-accessor-role. There is no constant defined for storage-consumer-role and it is not recognized anywhere in the codebase.
2. No differentiation logic for limited-access roles: The Cell renderer has a binary check — either a role is in SCALITY_INTERNAL_ROLES (gets a generic tooltip) or it's not (gets nothing). There is no logic to detect roles with limited UI access and display appropriate warnings.

The same issue also exists in SelectAccountIAMRole.tsx (line 305-308) where roles are rendered as plain Select.Option items with no warnings about limited UI availability.

Affected Component

• Repo: scality/zenko-ui
• Path: src/react/account/AccountRoleSelectButtonAndModal.tsx
• Version: 4.2.15

Evidence

src/react/account/AccountRoleSelectButtonAndModal.tsx
├── L30: Cell({ value: roleName }: { value: string }) { ...  — The Cell renderer for the Role Name column only shows a tooltip for SCALITY_INTERNAL_ROLES. The else branch (line 46) returns the bare role name with no tooltip or warning for storage-consumer-role or custom roles, so users get no indication that some UI sections may be unavailable.
└── L119: const storageManagerRoles = parsedRoles.filter( ...  — When storage-manager-role exists, only that role is shown. But when it doesn't exist, ALL roles including storage-consumer-role and custom roles are shown in the modal without any differentiation or warning.
src/react/utils/hooks.ts
└── L138: export const STORAGE_MANAGER_ROLE = 'storage-manager-role'; ...  — The SCALITY_INTERNAL_ROLES array does not include 'storage-consumer-role'. There is no constant for it, and no separate list of roles with known limited UI capabilities.
src/react/ui-elements/SelectAccountIAMRole.tsx
└── L305: return ( ...  — The SelectAccountIAMRole component also renders role options without any tooltip or warning about limited UI availability for storage-consumer-role or custom roles.

Impact

Low severity. Users who select storage-consumer-role or custom IAM roles in the role selection modal receive no indication that some UI sections (particularly Data Browser) may be unavailable. This causes confusion when users assume a role and find parts of the UI inaccessible. The blast radius is limited to users who interact with non-standard roles, but the UX confusion can lead to support tickets.

Confidence

high

Recommendation

1. Add STORAGE_CONSUMER_ROLE constant in src/react/utils/hooks.ts:

   export const STORAGE_CONSUMER_ROLE = 'storage-consumer-role';

   Add it to SCALITY_INTERNAL_ROLES so it gets the predefined role tooltip as well.

2. Add warning logic in the Cell renderer in AccountRoleSelectButtonAndModal.tsx (line 30-48):

   • For storage-consumer-role: Show a specific warning tooltip: "Data Browser unavailable for this role"
   • For custom roles (roles not in SCALITY_INTERNAL_ROLES): Show a generic warning tooltip: "Some UI sections may not be available depending on this role's permissions"

   Example implementation:

   Cell({ value: roleName }: { value: string }) {
     const isInternalRole = SCALITY_INTERNAL_ROLES.includes(roleName);
     const isStorageConsumer = roleName === STORAGE_CONSUMER_ROLE;
     
     let tooltipMessage = '';
     if (isStorageConsumer) {
       tooltipMessage = 'Data Browser unavailable for this role';
     } else if (isInternalRole) {
       tooltipMessage = 'This is a Scality predefined Role';
     } else {
       tooltipMessage = 'Some UI sections may not be available depending on this role\'s permissions';
     }
     
     return (
       <Stack gap="r8">
         {roleName}
         <Tooltip overlay={tooltipMessage} overlayStyle={{ width: '14rem' }}>
           <Icon
             name={isStorageConsumer || !isInternalRole ? 'Exclamation-circle' : 'Info'}
             color={isStorageConsumer || !isInternalRole ? 'statusWarning' : 'buttonSecondary'}
           />
         </Tooltip>
       </Stack>
     );
   }

3. Optionally update SelectAccountIAMRole.tsx (line 305-308) with similar warning logic for the Select dropdown options if this component is also used in contexts where users select roles to assume.