[Feature Anywhere] Add view events flyout

[ohltyler]

Signed-off-by: Tyler Ohlsen [email protected]

Description

This PR adds the 'View events' flyout which will open via an event click on a chart with VisLayers enabled, or in the vis options menu via View events button. It shows the base vis with the event annotations, and below it a breakdown of each set of events produced by each plugin resource. It is categorized by plugin resource type as well.

Technical details, more information, and example mocks can be found in the related issue #3155

Implementation details

Components

ViewEventsFlyout - the base component where all embeddables are created from the source vis embeddable. Persists the event visualizations by type via a map mapping resource type -> list of embeddables

DateRangeItem - contains the selected date range and refresh button. Hooks into the reload() function defined in ViewEventsFlyout to reload all of the embeddables when clicked.

BaseVisItem - the re-created base vis embeddable containing all of the events

EventsPanel - the base component to show all of the event annotation charts. Contains a set of PluginEventsPanels

PluginEventsPanel - contains a set of EventVisItems for a particular plugin resource type

EventVisItem - contains an event vis embeddable, including the resource name, url, and event count

TimelinePanel - contains the empty embeddable. Used to re-create the timeline and is a static component on the bottom of the flyout

All of the embeddables are using the EmbeddablePanel component, which takes care of individual component lifecycles for us, including the rendering, refreshing, and destroying. This is fetched from the embeddable service function's getEmbeddablePanel().

Issues Resolved

Closes #3155

Check List

• All tests pass
  • yarn test:jest
  • yarn test:jest_integration
  • yarn test:ftr
• New functionality includes testing.
• New functionality has been documented.
• Update CHANGELOG.md
• Commits are signed per the DCO using --signoff

[ohltyler]

Currently this PR has many dependent ones that will need to be merged first. This includes:

• Create switch to render line charts using vega-lite #3106
• Add a new augment-vis saved object type #3109
• Add logic to collect VisLayers in line chart render flow #3131
• Dynamically update vega spec to show VisLayers #3145
• [Feature Anywhere] Support fine-grained error states from VisLayers #3267
• [Feature Anywhere] Support clicking & custom tooltip functionality from vega charts #3317
• Update VisLayer data models #3374

These all involve finalizing the rest of the chart render workflow, and the VisLayer design.

When these have been merged, we can finish the following items for this flyout:

• final parsing of the VisLayers to show the partitioned data correctly, including error states
• custom chart functionality, including being able to (1) not show axes & labels, (2) not show any data, and (3) removing click functionality. (1) and (2) will mostly depend on Create switch to render line charts using vega-lite #3106, and (3) will mostly depend on [Feature Anywhere] Support clicking & custom tooltip functionality from vega charts #3317

[ohltyler]

Cleaned up and created a new branch - now tracking in #3415