Improve the order of changed metrics in metrics reports frontend

Summary

The metrics reports frontend introduced in !10380 (merged) simply produces a list containing the metric name, old, and new values. This isn't useful when the metric count exceeds a dozen.

We've updated it since then to follow the design below (based on the MR widget working group)

image

Problem

Produce a metrics report with more than a dozen metrics (e.g. runtime); try to make sense of what changed.

We list all of the changed metrics in Changes section, but we are missing a critical ingredient: the scale of the change. Currently there is no way to distinguish between a test which changed by 1% and one which changed by 200%.

Example Project

https://gitlab.haskell.org/bgamari/test/merge_requests/4

Proposed solution (WIP)

We should somehow apply severity to the changes - which is the most important I need to focus on first? We might be able to do this with the order as well.

The report should show the metrics in order of relative change. There should be an input element to hide relative changes smaller than a certain threshold.

Relevant logs and/or screenshots

(Paste any relevant logs - please use code blocks (```) to format console output, logs, and code as it's tough to read otherwise.)

Edited by Gina Doyle