mgr/dashboard: show miscellaneous data used

Fixes: https://tracker.ceph.com/issues/75320
Signed-off-by: Aashish Sharma <aasharma@redhat.com>

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/overview/storage-card/overview-storage-card.component.spec.ts b/src/pybind/mgr/dashboard/frontend/src/app/ceph/overview/storage-card/overview-storage-card.component.spec.ts
index 38c0fdbe4a2db888fa78bd8fe94c13ea731a73f6..b436e33cc1bf17cf5494f7e0478001e1083eb1f0 100644 (file)
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/overview/storage-card/overview-storage-card.component.spec.ts
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/overview/storage-card/overview-storage-card.component.spec.ts
@@ -125,7 +125,7 @@ describe('OverviewStorageCardComponent (Jest)', () => {
 
   it('should load and filter data on init', () => {
     expect(mockPrometheusService.getPrometheusQueryData).toHaveBeenCalled();
-    expect(component.allData.length).toBe(2); // Object filtered (0 value)
+    expect(component.allData.length).toBe(3); // Object filtered (0 value)
   });
 
   // --------------------------------------------------

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/overview/storage-card/overview-storage-card.component.ts b/src/pybind/mgr/dashboard/frontend/src/app/ceph/overview/storage-card/overview-storage-card.component.ts
index ec8599f93c6c74f0b8382e1a796a0d8ad24695c7..574e416bf93e68752ec92f2ce82058ce512aed89 100644 (file)
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/overview/storage-card/overview-storage-card.component.ts
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/overview/storage-card/overview-storage-card.component.ts
@@ -40,7 +40,8 @@ const StorageType = {
   ALL: $localize`All`,
   BLOCK: $localize`Block`,
   FILE: $localize`File system`,
-  OBJECT: $localize`Object`
+  OBJECT: $localize`Object`,
+  SYSTEM_METADATA: $localize`System metadata`
 };
 
 type ChartData = {
@@ -83,8 +84,6 @@ const PROMQL_COUNT_FILESYSTEMS = 'count(ceph_fs_metadata)';
 
 const PROMQL_COUNT_FILESYSTEM_POOLS = 'count(ceph_pool_metadata{application="Filesystem"})';
 
-const chartGroupLabels = [StorageType.BLOCK, StorageType.FILE, StorageType.OBJECT];
-
 const TopPoolsQueryMap = {
   Block: PROMQL_TOP_POOLS_BLOCK,
   'File system': PROMQL_TOP_POOLS_FILESYSTEM,
@@ -120,6 +119,7 @@ export class OverviewStorageCardComponent implements OnInit, OnDestroy {
   private readonly cdr = inject(ChangeDetectorRef);
   private destroy$ = new Subject<void>();
   trendData: { timestamp: Date; values: { Used: number } }[];
+  totalUsed: number;
 
   @Input()
   set total(value: number) {
@@ -131,6 +131,7 @@ export class OverviewStorageCardComponent implements OnInit, OnDestroy {
   }
   @Input()
   set used(value: number) {
+    this.totalUsed = value;
     const [usedValue, usedUnit] = this.formatterService.formatToBinary(value, true);
     if (Number.isNaN(usedValue)) return;
     this.usedRaw = usedValue;
@@ -217,14 +218,48 @@ export class OverviewStorageCardComponent implements OnInit, OnDestroy {
 
   private _getAllData(data: PromqlGuageMetric) {
     const result = data?.result ?? [];
-    const chartData = result
-      .map((r: PromethuesGaugeMetricResult) => {
-        const group = r?.metric?.application;
-        const value = this.formatterService.convertToUnit(r?.value?.[1], 'B', this.usedRawUnit, 1);
-        return { group: group === 'Filesystem' ? StorageType.FILE : group, value };
-      })
-      // Removing 0 values and legends other than Block, File system, and Object.
-      .filter((r) => chartGroupLabels.includes(r?.group) && r?.value > 0);
+
+    const chartData: ChartData[] = [];
+    const storageTypeValues = Object.values(StorageType);
+
+    let assignedBytes = 0;
+    let nonAssignedBytes = 0;
+
+    result.forEach((r: PromethuesGaugeMetricResult) => {
+      let group = r?.metric?.application;
+      const rawBytes = Number(r?.value?.[1]);
+
+      if (group === 'Filesystem') {
+        group = StorageType.FILE;
+      }
+
+      if (storageTypeValues.includes(group) && group !== StorageType.SYSTEM_METADATA) {
+        assignedBytes += rawBytes;
+
+        const value = this.formatterService.convertToUnit(
+          rawBytes.toString(),
+          'B',
+          this.usedRawUnit,
+          1
+        );
+
+        chartData.push({
+          group,
+          value
+        });
+      } else {
+        nonAssignedBytes += rawBytes;
+      }
+    });
+
+    const miscBytes = this.totalUsed - assignedBytes + nonAssignedBytes;
+    if (miscBytes > 0) {
+      chartData.push({
+        group: StorageType.SYSTEM_METADATA,
+        value: this.formatterService.convertToUnit(miscBytes.toString(), 'B', this.totalRawUnit, 3)
+      });
+    }
+
     return chartData;
   }
 
@@ -241,7 +276,9 @@ export class OverviewStorageCardComponent implements OnInit, OnDestroy {
   }
 
   private _setDropdownItemsAndStorageType() {
-    const newData = this.allData?.map((data) => ({ content: data.group }));
+    const newData = this.allData
+      ?.filter((data) => data.group !== StorageType.SYSTEM_METADATA)
+      .map((data) => ({ content: data.group }));
     if (newData.length) {
       this.dropdownItems = [{ content: StorageType.ALL }, ...newData];
     } else {

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/shared/enum/dashboard-promqls.enum.ts b/src/pybind/mgr/dashboard/frontend/src/app/shared/enum/dashboard-promqls.enum.ts
index dc9542ddeb7ca4b96d78cd58b7c0c4264e487198..195bcd2aaba9e0f7bdc802240382ea6c5dc54758 100644 (file)
--- a/src/pybind/mgr/dashboard/frontend/src/app/shared/enum/dashboard-promqls.enum.ts
+++ b/src/pybind/mgr/dashboard/frontend/src/app/shared/enum/dashboard-promqls.enum.ts
@@ -92,5 +92,9 @@ export const AllStoragetypesQueries = {
         group_left(application)
           ceph_pool_metadata{{applicationFilter}}
     ) OR vector(0)
-  `
+  `,
+
+  READLATENCY: 'avg_over_time(ceph_osd_apply_latency_ms[1m])',
+
+  WRITELATENCY: 'avg_over_time(ceph_osd_commit_latency_ms[1m])'
 };