mgr/dashboard: Add more decimals in latency graph

Fixes: https://tracker.ceph.com/issues/61930

Signed-off-by: Pedro Gonzalez Gomez <[email protected]>

Author: Pegonzal

src/pybind/mgr/dashboard/frontend/src/app/ceph/dashboard-v3/dashboard-area-chart/dashboard-area-chart.component.ts

@@ -30,6 +30,8 @@ export class DashboardAreaChartComponent implements OnChanges, AfterViewInit {
   label: string;
   @Input()
   label2?: string;
+  @Input()
+  decimals?: number = 1;
 
   currentDataUnits: string;
   currentData: number;
@@ -210,7 +212,8 @@ export class DashboardAreaChartComponent implements OnChanges, AfterViewInit {
         dataWithUnits = this.numberFormatter.formatSecondsFromTo(
           data,
           this.dataUnits,
-          this.chartDataUnits
+          this.chartDataUnits,
+          this.decimals
         );
       } else {
         dataWithUnits = this.numberFormatter.formatUnitlessFromTo(
@@ -230,7 +233,7 @@ export class DashboardAreaChartComponent implements OnChanges, AfterViewInit {
     } else if (this.dataUnits === 'B/s') {
       dataWithUnits = this.dimlessBinaryPerSecond.transform(data);
     } else if (this.dataUnits === 'ms') {
-      dataWithUnits = this.formatter.format_number(data, 1000, ['ms', 's']);
+      dataWithUnits = this.formatter.format_number(data, 1000, ['ms', 's'], this.decimals);
     } else {
       dataWithUnits = this.dimlessPipe.transform(data);
     }

src/pybind/mgr/dashboard/frontend/src/app/ceph/dashboard-v3/dashboard/dashboard-v3.component.html

@@ -223,6 +223,7 @@
         </cd-dashboard-area-chart>
         <cd-dashboard-area-chart chartTitle="Latency"
                                  dataUnits="ms"
+                                 decimals="3"
                                  label="Read"
                                  label2="Write"
                                  [data]="queriesResults.READLATENCY"

src/pybind/mgr/dashboard/frontend/src/app/shared/services/number-formatter.service.ts

@@ -27,24 +27,42 @@ export class NumberFormatterService {
     units: string,
     targetedUnits: string,
     factor: number,
-    labels: string[]
+    labels: string[],
+    decimals: number = 1
   ): any {
-    return this.formatter.formatNumberFromTo(value, units, targetedUnits, factor, labels);
+    return this.formatter.formatNumberFromTo(value, units, targetedUnits, factor, labels, decimals);
   }
 
-  formatBytesFromTo(value: any, units: string, targetedUnits: string): any {
-    return this.formatFromTo(value, units, targetedUnits, 1024, this.bytesLabels);
+  formatBytesFromTo(value: any, units: string, targetedUnits: string, decimals: number = 1): any {
+    return this.formatFromTo(value, units, targetedUnits, 1024, this.bytesLabels, decimals);
   }
 
-  formatBytesPerSecondFromTo(value: any, units: string, targetedUnits: string): any {
-    return this.formatFromTo(value, units, targetedUnits, 1024, this.bytesPerSecondLabels);
+  formatBytesPerSecondFromTo(
+    value: any,
+    units: string,
+    targetedUnits: string,
+    decimals: number = 1
+  ): any {
+    return this.formatFromTo(
+      value,
+      units,
+      targetedUnits,
+      1024,
+      this.bytesPerSecondLabels,
+      decimals
+    );
   }
 
-  formatSecondsFromTo(value: any, units: string, targetedUnits: string): any {
-    return this.formatFromTo(value, units, targetedUnits, 1000, this.secondsLabels);
+  formatSecondsFromTo(value: any, units: string, targetedUnits: string, decimals: number = 1): any {
+    return this.formatFromTo(value, units, targetedUnits, 1000, this.secondsLabels, decimals);
   }
 
-  formatUnitlessFromTo(value: any, units: string, targetedUnits: string): any {
-    return this.formatFromTo(value, units, targetedUnits, 1000, this.unitlessLabels);
+  formatUnitlessFromTo(
+    value: any,
+    units: string,
+    targetedUnits: string,
+    decimals: number = 1
+  ): any {
+    return this.formatFromTo(value, units, targetedUnits, 1000, this.unitlessLabels, decimals);
   }
 }