mgr/dashboard: fix weird data in osd details

The devices section in the OSD Details and Host Details shows more than
one daemon and device path in the column when you view the details of a
single osd details/host details. This is because more than one osd
is created on a device with same `deviceid`. I am not sure if this will
happen in the real environment but its mostly reproducible in
environments with QEMU emulated devices.

Fixes: https://tracker.ceph.com/issues/57803
Signed-off-by: Nizamudeen A <nia@redhat.com>
(cherry picked from commit 2e2ecde82f58f26e1f83e329b254ef97fa989506)

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/osd/osd-details/osd-details.component.html b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/osd/osd-details/osd-details.component.html
index 56eee8c8b9c432dba8c8b46c73f8fd417db8448b..f250279f878356636794fe56f41be202c56881cc 100644 (file)
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/osd/osd-details/osd-details.component.html
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/osd/osd-details/osd-details.component.html
@@ -8,7 +8,9 @@
       <a ngbNavLink
          i18n>Devices</a>
       <ng-template ngbNavContent>
-        <cd-device-list [osdId]="osd?.id"></cd-device-list>
+        <cd-device-list [osdId]="osd?.id"
+                        [hostname]="selection?.host.name"
+                        [osdList]="true"></cd-device-list>
       </ng-template>
     </li>
     <li ngbNavItem="attributes">

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/shared/device-list/device-list.component.html b/src/pybind/mgr/dashboard/frontend/src/app/ceph/shared/device-list/device-list.component.html
index 56fbb965a659f5461a88eaced3eade226db60b39..bee1495931c99287f61f4723a8d613c90235f247 100644 (file)
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/shared/device-list/device-list.component.html
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/shared/device-list/device-list.component.html
@@ -8,9 +8,36 @@
 
 <ng-template #deviceLocation
              let-value="value">
-  <span *ngFor="let location of value">{{location.dev}}</span>
+  <ng-container *ngFor="let location of value">
+    <cd-label *ngIf="location.host === hostname"
+              [value]="location.dev"></cd-label>
+  </ng-container>
 </ng-template>
 
+<ng-template #daemonName
+             let-value="value">
+  <ng-container [ngTemplateOutlet]="osdId !== null ? osdIdDaemon : readableDaemons"
+                [ngTemplateOutletContext]="{daemons: value}">
+  </ng-container>
+</ng-template>
+
+<ng-template #osdIdDaemon
+             let-daemons="daemons">
+  <ng-container *ngFor="let daemon of daemons">
+    <cd-label *ngIf="daemon.includes(osdId)"
+              [value]="daemon"></cd-label>
+  </ng-container>
+</ng-template>
+
+<ng-template #readableDaemons
+             let-daemons="daemons">
+  <ng-container *ngFor="let daemon of daemons">
+    <cd-label class="mr-1"
+              [value]="daemon"></cd-label>
+  </ng-container>
+</ng-template>
+
+
 <ng-template #lifeExpectancy
              let-value="value">
   <span *ngIf="!value.life_expectancy_enabled"

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/shared/device-list/device-list.component.ts b/src/pybind/mgr/dashboard/frontend/src/app/ceph/shared/device-list/device-list.component.ts
index 5503d1319eb597f728155583743b595930177d25..509b869d7153c162c3ec1695acb7c02e88823b36 100644 (file)
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/shared/device-list/device-list.component.ts
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/shared/device-list/device-list.component.ts
@@ -18,8 +18,13 @@ export class DeviceListComponent implements OnChanges, OnInit {
   @Input()
   osdId: number = null;
 
+  @Input()
+  osdList = false;
+
   @ViewChild('deviceLocation', { static: true })
   locationTemplate: TemplateRef<any>;
+  @ViewChild('daemonName', { static: true })
+  daemonNameTemplate: TemplateRef<any>;
   @ViewChild('lifeExpectancy', { static: true })
   lifeExpectancyTemplate: TemplateRef<any>;
   @ViewChild('lifeExpectancyTimestamp', { static: true })
@@ -69,16 +74,16 @@ export class DeviceListComponent implements OnChanges, OnInit {
         isHidden: true
       },
       { prop: 'location', name: $localize`Device Name`, cellTemplate: this.locationTemplate },
-      { prop: 'readableDaemons', name: $localize`Daemons` }
+      { prop: 'daemons', name: $localize`Daemons`, cellTemplate: this.daemonNameTemplate }
     ];
   }
 
   ngOnChanges() {
     const updateDevicesFn = (devices: CdDevice[]) => (this.devices = devices);
-    if (this.hostname) {
-      this.hostService.getDevices(this.hostname).subscribe(updateDevicesFn);
-    } else if (this.osdId !== null) {
+    if (this.osdList && this.osdId !== null) {
       this.osdService.getDevices(this.osdId).subscribe(updateDevicesFn);
+    } else if (this.hostname) {
+      this.hostService.getDevices(this.hostname).subscribe(updateDevicesFn);
     }
   }
 }