[RAM] Disable rule status dropdown on readonly user (#128971)

* [RAM] Disable rule status dropdown on readonly user

* Add test for readonly dropdown
This commit is contained in:
Zacqary Adam Xeper 2022-03-31 12:19:59 -05:00 committed by GitHub
parent 79069d8ade
commit 70fa26514a
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 49 additions and 20 deletions

View file

@ -22,6 +22,7 @@ describe('RuleStatusDropdown', () => {
enableRule,
snoozeRule,
unsnoozeRule,
isEditable: true,
previousSnoozeInterval: null,
item: {
id: '1',
@ -115,4 +116,19 @@ describe('RuleStatusDropdown', () => {
'Disabled'
);
});
test('renders read-only status control when isEditable is false', () => {
const wrapper = mountWithIntl(
<RuleStatusDropdown
{...{
...props,
item: { ...props.item, snoozeEndTime: SNOOZE_END_TIME },
}}
isEditable={false}
/>
);
expect(wrapper.find('[data-test-subj="statusDropdownReadonly"]').first().props().children).toBe(
'Enabled'
);
});
});

View file

@ -43,6 +43,7 @@ export interface ComponentOpts {
disableRule: () => Promise<void>;
snoozeRule: (snoozeEndTime: string | -1, interval: string | null) => Promise<void>;
unsnoozeRule: () => Promise<void>;
isEditable: boolean;
previousSnoozeInterval: string | null;
}
@ -60,6 +61,7 @@ export const RuleStatusDropdown: React.FunctionComponent<ComponentOpts> = ({
enableRule,
snoozeRule,
unsnoozeRule,
isEditable,
previousSnoozeInterval,
}: ComponentOpts) => {
const [isEnabled, setIsEnabled] = useState<boolean>(item.enabled);
@ -124,11 +126,17 @@ export const RuleStatusDropdown: React.FunctionComponent<ComponentOpts> = ({
</EuiToolTip>
) : null;
const badge = (
const nonEditableBadge = (
<EuiBadge color={badgeColor} data-test-subj="statusDropdownReadonly">
{badgeMessage}
</EuiBadge>
);
const editableBadge = (
<EuiBadge
color={badgeColor}
iconSide="right"
iconType={!isUpdating ? 'arrowDown' : undefined}
iconType={!isUpdating && isEditable ? 'arrowDown' : undefined}
onClick={onClickBadge}
iconOnClick={onClickBadge}
onClickAriaLabel={OPEN_MENU_ARIA_LABEL}
@ -150,24 +158,28 @@ export const RuleStatusDropdown: React.FunctionComponent<ComponentOpts> = ({
gutterSize="s"
>
<EuiFlexItem grow={false}>
<EuiPopover
button={badge}
isOpen={isPopoverOpen}
closePopover={onClosePopover}
panelPaddingSize="s"
data-test-subj="statusDropdown"
title={badgeMessage}
>
<RuleStatusMenu
onClosePopover={onClosePopover}
onChangeEnabledStatus={onChangeEnabledStatus}
onChangeSnooze={onChangeSnooze}
isEnabled={isEnabled}
isSnoozed={isSnoozed}
snoozeEndTime={item.snoozeEndTime}
previousSnoozeInterval={previousSnoozeInterval}
/>
</EuiPopover>
{isEditable ? (
<EuiPopover
button={editableBadge}
isOpen={isPopoverOpen && isEditable}
closePopover={onClosePopover}
panelPaddingSize="s"
data-test-subj="statusDropdown"
title={badgeMessage}
>
<RuleStatusMenu
onClosePopover={onClosePopover}
onChangeEnabledStatus={onChangeEnabledStatus}
onChangeSnooze={onChangeSnooze}
isEnabled={isEnabled}
isSnoozed={isSnoozed}
snoozeEndTime={item.snoozeEndTime}
previousSnoozeInterval={previousSnoozeInterval}
/>
</EuiPopover>
) : (
nonEditableBadge
)}
</EuiFlexItem>
<EuiFlexItem data-test-subj="remainingSnoozeTime" grow={false}>
{remainingSnoozeTime}

View file

@ -360,6 +360,7 @@ export const RulesList: React.FunctionComponent = () => {
unsnoozeRule={async () => await unsnoozeRule({ http, id: item.id })}
item={item}
onRuleChanged={() => loadRulesData()}
isEditable={item.isEditable && isRuleTypeEditableInContext(item.ruleTypeId)}
previousSnoozeInterval={previousSnoozeInterval}
/>
);