[Actionable Observability] use shareable tags component in o11y rules page (#130791)

* use shareable tags component in o11y rules page

* rename to getRuleTagBadge

* add getRuleTagBadge to triggersActionsUiStartMock
This commit is contained in:
mgiota 2022-04-28 16:29:23 +02:00 committed by GitHub
parent 48ed43dd97
commit 3d3449c3e5
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 19 additions and 0 deletions

View file

@ -36,6 +36,7 @@ const triggersActionsUiStartMock = {
createStart() {
return {
getAddAlertFlyout: jest.fn(),
getRuleTagBadge: jest.fn(),
ruleTypeRegistry: {
has: jest.fn(),
register: jest.fn(),

View file

@ -96,6 +96,7 @@ export function RulesPage() {
const [currentRuleToEdit, setCurrentRuleToEdit] = useState<RuleTableItem | null>(null);
const [rulesToDelete, setRulesToDelete] = useState<string[]>([]);
const [createRuleFlyoutVisibility, setCreateRuleFlyoutVisibility] = useState(false);
const [tagPopoverOpenIndex, setTagPopoverOpenIndex] = useState<number>(-1);
const isRuleTypeEditableInContext = (ruleTypeId: string) =>
ruleTypeRegistry.has(ruleTypeId) ? !ruleTypeRegistry.get(ruleTypeId).requiresAppContext : false;
@ -171,6 +172,23 @@ export function RulesPage() {
'data-test-subj': 'rulesTableCell-name',
render: (name: string, rule: RuleTableItem) => <Name name={name} rule={rule} />,
},
{
field: 'tags',
name: '',
sortable: false,
width: '50px',
'data-test-subj': 'rulesTableCell-tagsPopover',
render: (tags: string[], item: RuleTableItem) => {
return tags.length > 0
? triggersActionsUi.getRuleTagBadge({
isOpen: tagPopoverOpenIndex === item.index,
tags,
onClick: () => setTagPopoverOpenIndex(item.index),
onClose: () => setTagPopoverOpenIndex(-1),
})
: null;
},
},
{
field: 'executionStatus.lastExecutionDate',
name: LAST_RUN_COLUMN_TITLE,