[UX] Core web vitals should have empty state

[shahzad31]

Kibana version:

When no data is selected core web vitals displays this state , it should have empty state, possibly in grayed out bars.

[elasticmachine]

Pinging @elastic/uptime (Team:uptime)

[elasticmachine]

Pinging @elastic/apm-ui (Team:apm)

[paulb-elastic]

Agreed, this is misleading.
When there is no data, I'd duggest it shouldn't show 0ms for any of the metrics either, for example:

As well as some kind of inactive/greyed out web vital bars (so as not to suggest that 100% of users have had a poor experience).

cc @formgeist

[formgeist]

I'd assume "N/A" is better than 0 ms or any of the other values.

Secondly, yes we should have an empty state "No data available" on the stacked bar visualization. Perhaps a light grey background with the text on top which keeps the component in view but without the confusing data.

Lastly, I wanted to point out that there's a loading indicator on the values, but not on the stacked bar visualization. Perhaps a small spinner like the graph spinner would be a good addition as well for those loading states. It's similar to what we use on the sparklines in the other panels.