[feature]: show drive usage percentage in web-UI

[rc5hack]

Is your feature request related to a problem? Please describe.
Currently in web-UI in Administrator -> Monitoring -> Metrics -> Servers -> Drives I could see Capacity / Used / Available values as numerals and a little histogram as visualization, but I can't see usage percentage.

Describe the solution you'd like
In web-UI in Administrator -> Monitoring -> Metrics -> Servers -> Drives show Capacity / Used / Available values as numerals (as it is now) AND "Used %" (as [Capacity - Available * 100%]) AND "Available %" (as [Capacity - Used * 100%]).

E.g.:

• Capacity: 800G
• Used: 576G (72% of 800G)
• Available: 224G (28% of 800G)

[cesnietor]

@rc5hack could you please share how the percentage would be useful for you? what would you do with that percentage? we'd want to understand better the request. Thank you.

[bayasdev]

Hi @sen-io @oscarocastellanos, could you please take a look at this request? Thanks!

[sen-io]

@rc5hack I know the circle shows a rough approximation of the usage % graphically, but is this too abstract? If so, perhaps the circle on the left could show the percentage used also instead of the space amount since the same data is repeated on the right. Echoing what @cesnietor asked, understanding the reason for wanting to see the numbers would be helpful.

[cesnietor]

@sen-io I was thinking maybe showing the percentage value on hover also, cause it's not clear what that value is. We have 3 values on the right, only one on the left and showing two on the graph (the filled and the empty) so maybe we could figure out a better way of displaying this without being too confusing.

[sen-io]

@cesnietor We definitely shouldn't show a number without context. My thought was to show the word "used" with the percentage. Perhaps as grey text under it. Still though, we need more context for where the percentage is useful. Showing the % on hover might be fine also, but I think it's best to fully understand the reason before making changes.

[oscarocastellanos]

Working on something. Will post in a few minutes.

[oscarocastellanos]

@sen-io @cesnietor @bayasdev I think we can move to this view. I removed the redundancy of the labels, as we don't need to repeat the Capacity, just make clear that we have that info inside the circle. I also added labels for full clarity on the other elements.

Thoughts?

[sen-io]

@oscarocastellanos I like the layout. Unsure if the total capacity is the most valuable piece of data to put inside the circle. Probably the easiest to place there though since it doesn't have an accompanying percentage. And it makes sense since the full circle is the total capacity.

[cesnietor]

That was fast, I like it @oscarocastellanos thank you.

[oscarocastellanos]

Waiting for implementation of this. Will update once it's implemented. Thanks for bringing it up @rc5hack

[bayasdev]

@sen-io @cesnietor @bayasdev I think we can move to this view. I removed the redundancy of the labels, as we don't need to repeat the Capacity, just make clear that we have that info inside the circle. I also added labels for full clarity on the other elements.

Thoughts?

Awesome! will work on this ⚡️