New UI: Health indicators

[lawik]

I just noticed that the health indicators are limited to the three:

• CPU temp
• Memory used
• Load 1|5|15

And those are not all we want. We have more info by default and the values the customer wants to expose should be surfaced front and center (in my opinion : ):

Disk is one other default reported metric that matters.

And then any custom ones sent in should also be included. Among the default ones we can make some special design choices and then custom ones need to be a bit generic.

I would say CPU usage percent is more important than temp.

In my previous implementation of this I used the CPU % as the big number and then put CPU degrees as the smaller (but colored) one. Think that works well.

Reference: https://github.com/lawik/nerves_hub_web/blob/ui2-device-details-old/lib/nerves_hub_web/live/devices/show-new.html.heex#L250

And I made a gray variant, but could just as well be the purple variant, for all custom ones.

Once we have health metrics we can switch the coloring to have that type of meaning as @joshk has suggested.

Current implementation:

nerves_hub_web/lib/nerves_hub_web/components/device_page/details.ex

Line 122 in 85c8984

<div class="w-20 flex flex-col h-16 py-2 px-3 rounded border-b border-emerald-500 bg-health-good">

[lawik]

This view:

[lawik]

PR showing what I am going for is on the way.

[joshk]

I do have some concerns about showing all metrics in there.

I'm trying to balance form and function, as well as consistency (of design and layout)

I believe the details page should be the place to call out the most important metrics. Not all metrics are important, because if everything is important, nothing is important.

[lawik]

I could see not showing all metrics. But by default it is quite few metrics and the graphs do not surface metrics efficiently. And any metric the customer adds should probably be considered important-ish?

In line with the discussion on health: #1794

I think it would make sense to show all that are used as health criteria potentially?

But I agree, not too many. But hard-coded is incredibly limiting for demonstrations and people wanting to try something interesting.

[elinol]

Would it be weird to have an expand button which shows the rest of the metrics when clicked?

[lawik]

I think they can look alright. Having a way to expand that isn't going into the Health charts view could be good. Or putting these indicator numbers at the top of the chart view as a "full health overview". That could work. And only use the prioritized ones on the Details page. Priority being a bit arbitrary and chosen by use for now and dictated by Health feature later?

[lawik]

Made a PR for the uncontroversial fix.
#1803

And one for the more controversial one :)
#1804