From 6707e294801b020a5f1c8d5a19ab53885c7720f8 Mon Sep 17 00:00:00 2001
From: Ricardo Marques <rimarques@suse.com>
Date: Fri, 6 Dec 2019 18:40:46 +0000
Subject: [PATCH] mgr/dashboard: Display OSD device class in OSD list

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

Signed-off-by: Ricardo Marques <rimarques@suse.com>
---
 .../osd/osd-list/osd-list.component.ts        | 28 +++++++++++++++++--
 .../datatable/table/table.component.html      |  3 +-
 2 files changed, 27 insertions(+), 4 deletions(-)

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/osd/osd-list/osd-list.component.ts b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/osd/osd-list/osd-list.component.ts
index 3f9e473ed345..95bf1279c01d 100644
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/osd/osd-list/osd-list.component.ts
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/osd/osd-list/osd-list.component.ts
@@ -204,10 +204,11 @@ export class OsdListComponent implements OnInit {
     ];
     this.columns = [
       { prop: 'host.name', name: this.i18n('Host') },
-      { prop: 'id', name: this.i18n('ID'), cellTransformation: CellTemplate.bold },
+      { prop: 'id', name: this.i18n('ID'), flexGrow: 1, cellTransformation: CellTemplate.bold },
       {
         prop: 'collectedStates',
         name: this.i18n('Status'),
+        flexGrow: 1,
         cellTransformation: CellTemplate.badge,
         customTemplateConfig: {
           map: {
@@ -219,8 +220,29 @@ export class OsdListComponent implements OnInit {
           }
         }
       },
-      { prop: 'stats.numpg', name: this.i18n('PGs') },
-      { prop: 'stats.stat_bytes', name: this.i18n('Size'), pipe: this.dimlessBinaryPipe },
+      {
+        prop: 'tree.device_class',
+        name: this.i18n('Device class'),
+        flexGrow: 1,
+        cellTransformation: CellTemplate.badge,
+        customTemplateConfig: {
+          map: {
+            hdd: { class: 'badge-hdd' },
+            ssd: { class: 'badge-ssd' }
+          }
+        }
+      },
+      {
+        prop: 'stats.numpg',
+        name: this.i18n('PGs'),
+        flexGrow: 1
+      },
+      {
+        prop: 'stats.stat_bytes',
+        name: this.i18n('Size'),
+        flexGrow: 1,
+        pipe: this.dimlessBinaryPipe
+      },
       { prop: 'stats.usage', name: this.i18n('Usage'), cellTemplate: this.osdUsageTpl },
       {
         prop: 'stats_history.out_bytes',
diff --git a/src/pybind/mgr/dashboard/frontend/src/app/shared/datatable/table/table.component.html b/src/pybind/mgr/dashboard/frontend/src/app/shared/datatable/table/table.component.html
index 3a95e7ddfe0c..ff67df3ab6ab 100644
--- a/src/pybind/mgr/dashboard/frontend/src/app/shared/datatable/table/table.component.html
+++ b/src/pybind/mgr/dashboard/frontend/src/app/shared/datatable/table/table.component.html
@@ -200,7 +200,8 @@
              let-value="value">
   <span *ngFor="let item of (value | array); last as last">
     <span class="badge"
-          [ngClass]="(column?.customTemplateConfig?.map && column?.customTemplateConfig?.map[item]?.class) ? column.customTemplateConfig.map[item].class : (column?.customTemplateConfig?.class ? column.customTemplateConfig.class : 'badge-primary')">
+          [ngClass]="(column?.customTemplateConfig?.map && column?.customTemplateConfig?.map[item]?.class) ? column.customTemplateConfig.map[item].class : (column?.customTemplateConfig?.class ? column.customTemplateConfig.class : 'badge-primary')"
+          *ngIf="(column?.customTemplateConfig?.map && column?.customTemplateConfig?.map[item]?.value) ? column.customTemplateConfig.map[item].value : column?.customTemplateConfig?.prefix ? column.customTemplateConfig.prefix + item : item">
       {{ (column?.customTemplateConfig?.map && column?.customTemplateConfig?.map[item]?.value) ? column.customTemplateConfig.map[item].value : column?.customTemplateConfig?.prefix ? column.customTemplateConfig.prefix + item : item }}
     </span>
     <span *ngIf="!last">&nbsp;</span>
-- 
2.47.3