Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Visual indication for disabled or muted alerts #80310

Closed
arisonl opened this issue Oct 13, 2020 · 16 comments · Fixed by #104190
Closed

Visual indication for disabled or muted alerts #80310

arisonl opened this issue Oct 13, 2020 · 16 comments · Fixed by #104190
Assignees
Labels
Feature:Alerting/RulesManagement Issues related to the Rules Management UX Feature:Alerting Team:ResponseOps Label for the ResponseOps team (formerly the Cases and Alerting teams) UX

Comments

@arisonl
Copy link
Contributor

arisonl commented Oct 13, 2020

Currently there is no immediate visual feedback that an alert is disabled or muted, other than selecting it and clicking manage or clicking on it to view its details page. Inferring it from statuses is not currently (7.10) possible either.

Screenshot 2020-10-13 at 14 08 30

@arisonl arisonl added Feature:Alerting Team:ResponseOps Label for the ResponseOps team (formerly the Cases and Alerting teams) labels Oct 13, 2020
@elasticmachine
Copy link
Contributor

Pinging @elastic/kibana-alerting-services (Team:Alerting Services)

@mikecote mikecote added the UX label Oct 20, 2020
@mikecote
Copy link
Contributor

cc @mdefazio

@mikecote mikecote changed the title Visual indication for disabled alerts Visual indication for disabled or muted alerts Nov 2, 2020
@mikecote
Copy link
Contributor

mikecote commented Nov 2, 2020

The same applies to muted: #81412. Updating title / description.

@mikecote
Copy link
Contributor

mikecote commented Feb 4, 2021

Moving from 7.x - Candidates to 8.x - Candidates (Backlog) after the latest 7.x planning session.

@YulNaumenko YulNaumenko self-assigned this Jun 29, 2021
@mdefazio
Copy link
Contributor

mdefazio commented Jul 1, 2021

Here is an updated mockup with the follow changes:

  • Create rule button is moved to page header per the new page layout guidelines
  • Add a switch to the front of each row to quickly allow users to see and update whether the rule is enabled/disabled
  • Add a column for last updated and default to this for sorting
  • Truncate tags column
  • Add a 'Schedule' column with indicators for 'Runs every', 'Actions', and 'Muted'. If muted, show icon. Option to mute rule appears on hover
  • Show 2 row actions on hover (Edit & Delete). Overflow menu remains regardless of hover (Follows EUI table example)
  • Overflow menu options are: Mute/Unmute, Enable/Disable, Edit rule, Delete rule (should have confirmation modal to delete)

I did also update the coloring for the statuses as I felt 'Pending' was odd to make our typical 'Healthy' color. This is likely still debatable and probably should be moved into a separate issue if there's concern here.

Questions regarding the last updated / sort order:

  1. Does last updated only refer to the execution status? Or does this get updated if I mute or disable or edit a rule?
  2. Is the sort order only updated on page reload / refresh button? (I think this is right if so)
  3. Will we eventually have a versioning system similar to Security's?

Mockup:
image

I know some of these are likely out of scope for this issue, so happy to make a broader one. LMK.

@mdefazio
Copy link
Contributor

mdefazio commented Jul 6, 2021

@YulNaumenko , @mikecote
Some additional rationale for the above UX:

  • I think having the switch on the row provides an additional visual indicator that a rule is active or disabled. We definitely still need the text, but I think the switch helps scan down the column and have those disabled standout more.
    • I get that for some rule types, the need to disable/enable is less frequent, however, we are working through an updated rule management view in the RAC project and for Security particularly, that ability is very needed. So I think including these switches provides the extra visual cue as well as the benefit for security. We'll want these views to be consistent soon, so I was looking ahead. So perhaps that's too far ahead than this PR needs, but wanted to make sure this group was aware.
  • The mute button UX is perhaps a bit more confiscated. The mute button should show on hover of the row, so it is still accessible from this main list view, but the goal was to only indicate those rules that are muted so we don't over clutter the UI. Perhaps this needs another round of design, but that was the original goal

@mikecote
Copy link
Contributor

mikecote commented Jul 7, 2021

Thanks, @mdefazio. I don't have a concern with the switch, so if it's preferred, I'm ok with that. I do think the text may need to be updated? Should "Active" be called "Enabled"? I can see it clash with the "Active" rule status.

@YulNaumenko
Copy link
Contributor

Thanks, @mdefazio. I don't have a concern with the switch, so if it's preferred, I'm ok with that. I do think the text may need to be updated? Should "Active" be called "Enabled"? I can see it clash with the "Active" rule status.

I agree that Enabled will correspond better to our Rule props definition, but we need to consolidate the logic with the RAC rules management page:
Screen Shot 2021-07-07 at 1 55 12 PM
Maybe we can have the similar in our list, but with title Enabled? (cc @elastic/kibana-alerting-services )

@mdefazio
Copy link
Contributor

mdefazio commented Jul 7, 2021

@mikecote Yes, let's make that Enabled or Disabled. We will update our wireframes on the RAC side

@YulNaumenko
Copy link
Contributor

@mdefazio , this is the latest update from our discussion with @arisonl and @mikecote :

  1. Title the column as Enabled and leave only switch button without text like RAC wireframes have. Make it sortable.
  2. Change "Last updated" column to the "Last run" - opened a separate issue for this, because it requires a discussion on the API which should be used for populating this.
  3. Move actions number icon with text and Mute/Unmute button to a single column with the title Actions - it will be more intuitive to the users that Mute button related to the actions only.

Screen Shot 2021-07-07 at 5 39 35 PM

@arisonl
Copy link
Contributor Author

arisonl commented Jul 8, 2021

Thanks @YulNaumenko looks great. For the record, the rationale around your third bullet point: Omitting a label does not really make this view less busy. In contrast an integer number without a label is the least interpretable thing you come across in this screen (statuses, times etc. are more recognisable as such even without a label than a number that could be anything). In addition the first thing that comes to my mind with the eye icon (without a label) is that you hide/unhide something on the UI. As a result, a relatively busy view with a couple of cryptic parts like those can cause an effect like "you need to know what's going on here" which is perhaps worse than just being busy. The opportunity here was that both of the unlabelled entities correspond to the actions concept, so merging them in one column and labeling them once imo is a sweetspot in this tradeoff.

@arisonl
Copy link
Contributor Author

arisonl commented Jul 8, 2021

Btw, this design also addresses this UX issue #80313 We can probably close them both once done.

@mdefazio
Copy link
Contributor

mdefazio commented Jul 8, 2021

I agree with your points about the readability of the icon(s). I think we need a better icon or need to find a different solution to show muted.

One option is to have a single state option that is either Enable, Disabled, or Muted. I tend to like the switch and the affordance there, but I think its a possible option.

Another option is to have the word 'Muted' after the actions column and keep the ability to change that in the overflow menu (in favor of simplifying the row UI).

@mdefazio
Copy link
Contributor

mdefazio commented Jul 8, 2021

Here's an updated mockup showing the latter option. I've also just removed the icons from the Schedule and Actions columns—if we have these in their own column, we do not need the icon to help signify their meaning.

One change that might need to be discussed further is whether we need the word 'Every' in the schedule column. We had this previously in the heading and we removed it. I'm fine if we go back to 'Runs every' for the column heading if we liked that better.

image

@YulNaumenko
Copy link
Contributor

Here's an updated mockup showing the latter option. I've also just removed the icons from the Schedule and Actions columns—if we have these in their own column, we do not need the icon to help signify their meaning.

One change that might need to be discussed further is whether we need the word 'Every' in the schedule column. We had this previously in the heading and we removed it. I'm fine if we go back to 'Runs every' for the column heading if we liked that better.

I like the latest mockup and think it will simplify a lot of things. I'm +1 on keeping Mute as a part of Actions column. With State column it will be confusing and disable a sort option on the Enabled rules.

@arisonl
Copy link
Contributor Author

arisonl commented Jul 9, 2021

I noticed that RAC uses the term triggered here: #103270 Is this the same as our active? We should make sure we use a consistent language across. In fact we were discussing with @YulNaumenko independently that the term triggered may be more descriptive than our active (we use this term in other places e.g. "Notify when the alert become active"). Any thoughts?

@kobelb kobelb added the needs-team Issues missing a team label label Jan 31, 2022
@botelastic botelastic bot removed the needs-team Issues missing a team label label Jan 31, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Feature:Alerting/RulesManagement Issues related to the Rules Management UX Feature:Alerting Team:ResponseOps Label for the ResponseOps team (formerly the Cases and Alerting teams) UX
Projects
None yet
7 participants