fix (performance overview): Use normalized scores for radar plots.

src/views/model-comparator/ModelComparator.tsx

@@ -666,7 +666,7 @@ export default function ModelComparator({
             <Slider
               ariaLabelInput="Lower bound"
               unstable_ariaLabelInputUpper="Upper bound"
-              labelText={`${extractMetricDisplayName(selectedMetric)} Range`}
+              labelText={`Choose range`}
               value={
                 selectedMetricRange
                   ? selectedMetricRange[0]

src/views/performance-overview/Hide.module.scss

@@ -47,7 +47,7 @@
   margin: 0 0 $spacing-03 $spacing-05;
   padding: $spacing-05;
   display: none;
-  column-gap: $spacing-09;
+  column-gap: $spacing-12;
   box-shadow: 0 0 5px 2px $gray-40;
 }
 
@@ -72,3 +72,13 @@
 .selector {
   max-width: 30%;
 }
+
+.selector label {
+  width: 100%;
+}
+
+.selectorLabel {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}

src/views/performance-overview/Hide.tsx

@@ -80,11 +80,26 @@ export default function HidePanel({
       </Tooltip>
       {show ? (
         <div className={cx(classes.container, show && classes.visible)}>
-          <div className={classes.selector}>
+          <div
+            key={'models-limiter--' + `${ignoredModels === models}`}
+            className={classes.selector}
+          >
             <FilterableMultiSelect
               id={'model--limiter'}
-              titleText="Models"
+              titleText={
+                <div className={classes.selectorLabel}>
+                  <span>Models</span>
+                  <Button
+                    kind="ghost"
+                    size="sm"
+                    onClick={() => setIgnoredModels(models)}
+                  >
+                    select all
+                  </Button>
+                </div>
+              }
               items={models}
+              initialSelectedItems={ignoredModels}
               itemToString={(item) => (item.name ? item.name : item.modelId)}
               onChange={(event) => {
                 setIgnoredModels(event.selectedItems);
@@ -103,11 +118,26 @@ export default function HidePanel({
               })}
             </div>
           </div>
-          <div className={classes.selector}>
+          <div
+            key={'metrics-limiter--' + `${ignoredMetrics === metrics}`}
+            className={classes.selector}
+          >
             <FilterableMultiSelect
               id={'metrics--limiter'}
-              titleText="Metrics"
+              titleText={
+                <div className={classes.selectorLabel}>
+                  <span>Metrics</span>
+                  <Button
+                    kind="ghost"
+                    size="sm"
+                    onClick={() => setIgnoredMetrics(metrics)}
+                  >
+                    select all
+                  </Button>
+                </div>
+              }
               items={metrics}
+              initialSelectedItems={ignoredMetrics}
               itemToString={(item) =>
                 item.displayName ? item.displayName : item.name
               }

src/views/performance-overview/PerformanceOverview.tsx

@@ -825,25 +825,48 @@ export default function PerformanceOverview({
                 <>
                   <RadarChart
                     data={humanMetricsData.map((entry) => {
+                      // Step 1: Find metric under consideration
                       const metric = metrics.find(
                         (m) => m.displayName === entry.metric,
                       );
+
+                      // Step 2: Calculate normalized score
+                      let normalizedScore = entry.score;
+                      if (
+                        metric?.minValue !== undefined &&
+                        metric.maxValue !== undefined
+                      ) {
+                        // Step 2.a: Fetch minimum value
+                        const minValue =
+                          typeof metric.minValue === 'number'
+                            ? metric.minValue
+                            : castToNumber(
+                                metric.minValue?.value,
+                                metric.values,
+                              );
+
+                        // Step 2.b: Fetch maximum value
+                        const maxValue =
+                          typeof metric.maxValue === 'number'
+                            ? metric.maxValue
+                            : castToNumber(
+                                metric.maxValue?.value,
+                                metric.values,
+                              );
+
+                        // Step 2.c: Calculate min-max normalized score
+                        normalizedScore =
+                          Math.round(
+                            ((entry.score - minValue) / (maxValue - minValue)) *
+                              100,
+                          ) / 100;
+                      }
+
+                      // Step 3: Return
                       return {
                         model: entry.model,
                         metric: entry.metric,
-                        score:
-                          metric && metric.maxValue
-                            ? Math.round(
-                                (entry.score /
-                                  (typeof metric.maxValue === 'number'
-                                    ? metric.maxValue
-                                    : castToNumber(
-                                        metric.maxValue?.value,
-                                        metric.values,
-                                      ))) *
-                                  100,
-                              ) / 100
-                            : entry.score,
+                        score: normalizedScore,
                       };
                     })}
                     options={{
@@ -899,10 +922,50 @@ export default function PerformanceOverview({
                     data={algorithmicMetricsData
                       .sort((a, b) => (a.model > b.model ? -1 : 1))
                       .map((entry) => {
+                        // Step 1: Find metric under consideration
+                        const metric = metrics.find(
+                          (m) => m.displayName === entry.metric,
+                        );
+
+                        // Step 2: Calculate normalized score
+                        let normalizedScore = entry.score;
+
+                        if (
+                          metric?.minValue !== undefined &&
+                          metric.maxValue !== undefined
+                        ) {
+                          // Step 2.a: Fetch minimum value
+                          const minValue =
+                            typeof metric.minValue === 'number'
+                              ? metric.minValue
+                              : castToNumber(
+                                  metric.minValue?.value,
+                                  metric.values,
+                                );
+
+                          // Step 2.b: Fetch maximum value
+                          const maxValue =
+                            typeof metric.maxValue === 'number'
+                              ? metric.maxValue
+                              : castToNumber(
+                                  metric.maxValue?.value,
+                                  metric.values,
+                                );
+
+                          // Step 2.c: Calculate min-max normalized score
+                          normalizedScore =
+                            Math.round(
+                              ((entry.score - minValue) /
+                                (maxValue - minValue)) *
+                                100,
+                            ) / 100;
+                        }
+
+                        // Step 3: Return
                         return {
                           group: entry.model,
                           key: entry.metric,
-                          value: entry.score,
+                          value: normalizedScore,
                         };
                       })}
                     options={{