[UX] Receive and review events on time series visualizations

[xeniatup]

Is your feature request related to a problem? Please describe.
This is a part of augmenting dashboard visualizations with plugin data.

UX Meta issue: opensearch-project/ux#66

Describe the solution you'd like

To provide an easy way for users to gain more insights with their existing visualizations, as well as help improve visibility and adoption of additional plugins, we propose to allow plugin resources (e.g., anomaly detectors, alerting monitors) to be associated with visualizations. Additionally, we propose to support overlaying the additional results (alerts triggered, anomalies occured) on top of the time series visualization charts to allow for their consumption within the context of the dashboards.

User Stories:

Alerting

• As a user who has set up an alerting monitor on a visualization, I want to be informed when alerts are triggered, so I can feel confident in the system/service I’m supporting.
• As a user who is looking at an alert view on a given visualization time range, I want to be able to get a summary of what are the alerts are about, so I can decide if I want to dive deeper into what caused them in a detailed view

Anomaly Detection

• As a user who set up anomaly detection on a time series visualization, I want to be informed when an anomaly occurred, so I can investigate it using the context of a dashboard.
• As a user who is looking at an anomaly view on a given visualization time range, I want to be able to get a summary of what anomalies fired, so I can decide if I want to dive deeper into what caused the anomalies in a detailed view

Review alerts

review-alerts.mp4

Review anomalies

review-anomalies.mp4

Screen 1a. User selects a visualization that has alerting monitors/anomaly detectors associated with it. Events, generated by the additional plugins are overlayed on the visualization and aligned with its timeline. On mouse over user gets a summary of the events.

Screen 2a: User selects an events marker which opens a flyout OuiFlyout with more detailed breakdown of the alerts for the visualization time range. To further investigate the alerts user selects a specific monitor.

Screen 2b: User selects an events marker which opens a flyout OuiFlyout with more detailed breakdown of the anomalies for the visualization time range. To further investigate the anomalies user selects a specific detector.

Screen 3. Alternatively the flyout can be accessed from the visualization by selecting "View events" from the context menu OuiContextMenu:

Error, warning, empty states:

Screen 1b: Some of the plugin resources failed to load (e.g. timeout, API fails) on the dashboard

• Each visualization on the dashboard generates error message
• The toasts messages are stacked on the dashboard

Screen 1c: Selecting "See full error" opens a modal dialog with the full description of the errors.

Screen 1d: User doesn't have permissions to read monitors/detectors associated with the visualizations by another user in the same tenant. Multiple toast messages (for multiple visualizations) are aggregated by plugin.

Screen 2c: Events flyout empty state. No alerting monitor or anomaly detectors are associated with a visualization.

Screen 2d: Plugin resources not loaded. Errors accessing the monitors/detectors/alerts due to no read access.

[ahopp]

Thanks for opening @xeniatup - taking a look!

[xeniatup]

Done:
opensearch-project/anomaly-detection-dashboards-plugin#400
#2880
opensearch-project/alerting-dashboards-plugin#457