[Dashboard] Improve context menu options organization

[markov00]

I believe the current context menu, in particular when clicking into More is pretty confusing (see the screenshot)

There isn't a logic order of elements (or at least I can't find one) and they seems to be mixed up a bit.

I'm wondering if there is a way to sort and better organize these items (even if they are dynamic menu items). Something like adding a group name or just a line separator (as in OS context menu) will be already enough

I can see at least 3 groups: Panel related operations, Data related actions, and Security related where items can be grouped.

[elasticmachine]

Pinging @elastic/kibana-presentation (Team:Presentation)

[ThomThomson]

Great idea @markov00. We're currently aiming to move some of the most common actions out of this context menu into hover actions to make them easier to click.

With the remainder, we should look into fixing this issue by using an action grouping.

[nreese]

@markov00 Thanks for opening this issue and laying out solution options. I really like the idea of having a line indicating groupings.

@ThomThomson This seems like pretty low hanging fruit. What do you think about @markov00's grouping and implementing a visual distinction between groups in the very short term? Lets not fall into the trap of letting small quality of life improvements getting overshadowed by longer term initiatives.

[teresaalvarezsoler]

Thanks @markov00 for starting this discussion. I did some analysis in the past using telemetry and after discussing it with the team we agreed in the following:

• Remove "Replace panel" option due to low usage and easy workaround (remove and add new panel)
• Merge "Add to existing case" and "Add to new case" under "Add to case" (when the modal window is displayed users can make the decision of selecting an existing or new case)
• Move "Delete from dashboard" to the bottom of the menu to follow standard SaaS conventions
• Move "Panel settings" under "Edit visualization" because they are related and they are the most used options
• Rename “Create anomaly detection job” to “Detect anomalies” to simplify it and make it more user friendly
• Group "Maximize panel", "Copy to Dashboard" and "Save to Library" under "Panel actions" (or just "Actions"?)
• I would be hesitant to group the "Data" elements "Inspect", "Explore data in Discover" and "Download as CSV" because of the high usage compare to other elements and users may be annoyed having to do one more click. But it makes sense to do it conceptually so I'm open for discussing it.

The final menu will look like this:

Please @andreadelrio, can you review this? Thanks!

[markov00]

Just to me clear, when I was saying grouping I didn't mean group them in sub-menus, but just reorder the items and put an horizontal line between groups (like in the actual browser context menu) These items are already within the sub-menu More... and deeper sub-menu hierarchies are actually not a great UX IMHO.

< Options
-------------
Maximize panel
Replace Panel
Save to Library
Copy to Dashboard
Delete from Dashboard
-------------
Inspect
Explore in Discover
Download CSV
-------------
Add to Existing Case
Add to New Case

[andreadelrio]

@teresaalvarezsoler After reading through this discussion and checking out some references I've come up with three proposals trying to incorporate everything. I think the Delete from dashboard should be a quick access (i.e. top-level) action. It should ideally appear at the bottom (i.e. footer) as mentioned above. Currently, we have the "Create drilldown" action in that location so we'd need to decide whether we keep it on the top level or send it to the second level. I checked the relative usage (last 90 days) of paying customers in FullStory and found that Delete from dashboard is used more often than Create drilldown which should come as no surprise.

Here are the three proposals:

Option A: Create drilldown is sent to the second level. Option B: Create drilldown is kept on the top-level with a dedicated section. Option C: Create drilldown is kept on the top-level but no longer gets a dedicated section.

[teresaalvarezsoler]

Thank you @andreadelrio . I think Option A makes more sense. Just for the records, when there are Drilldowns created, there will be another option under "Create drilldown" called "Manage drilldowns".

[ThomThomson]

++ to Option A, These look great!