[Metrics UI] Enhanced host details - Metadata

[sorantis]

Add Metadata tab to Enhanced Host Details

Properties

Host metadata

• host.architecture
• host.hostname
• host.id
• host.ip
• host.mac
• host.name
• host.os.build
• host.os.family
• host.os.kernel
• host.os.name
• host.os.platform
• host.os.version

Cloud metadata

• cloud.account.id
• cloud.account.name
• cloud.availability_zone
• cloud.instance.id
• cloud.instance.name
• cloud.machine.type
• cloud.provider
• cloud.region

Elastic Agent metadata

• agent.id
• agent.version
• agent.policy

Don't show empty values.

The filter icon adds a filter to inventory search field.
Mouse-hove on the filter icon shows the tooltip: Apply filter

[elasticmachine]

Pinging @elastic/logs-metrics-ui (Team:logs-metrics-ui)

[hbharding]

From discussions with the observability designers, we'd like to develop this as a shared component so that other Observability apps can import it into their UIs. This is part of an effort to improve consistency between our UIs. The implementation in our other UIs can be handled in a separate ticket(s) after the component is created.

The information shown below this tab is very similar to what we show in the Logs UI flyout when a user chooses to "view details" for a particular log line. Similarly, APM shows a list of key/values when looking at the metadata for a transaction. We should be able to reuse this new component in places like these.

Logs UI (currently)

APM Transaction metadata (currently)

Metrics UI (proposed)

The proposed changes are as follows:

1. Uses the compressed form of EuiTable to increase information density. We'll need some custom CSS on the table so that the columns are 33% and 66% wide respectively.
2. The list of values can optionally be grouped by category headings. For example, "Host", "Cloud", etc.
3. The values can optionally have a "apply filter" icon button. The filter icon uses $euiColorMediumShadeand $euiColorDarkestShade on hover. The icon's tooltip should say "Apply filter".
4. Fields with multiple values should only show the first value, but can be toggled to "show more" / "show less". Separating values by a new line (rather than a wrapped, comma separated list as the Logs UI does today) will improve legibility. See GIF for details: