mgr/dashboard: remove empty popover when there are no health warns

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

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/upgrade/upgrade.component.html b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/upgrade/upgrade.component.html
index e45157455bfe943e417069a615747394f81b9c6d..b1867c3bb0c6c4866ce9ba44a31bc904d66f3744 100644 (file)
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/upgrade/upgrade.component.html
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/upgrade/upgrade.component.html
@@ -55,6 +55,7 @@
             </li>
           </ul>
         </ng-template>
+        <ng-template #healthWarningAndError>
         <div class="info-card-content-clickable mt-1"
              [ngStyle]="healthData.health.status | healthColor"
              [ngbPopover]="healthChecks"
@@ -62,7 +63,13 @@
             {{ healthData.health.status | healthLabel | uppercase }}
           <i *ngIf="healthData.health?.status !== 'HEALTH_OK'"
              class="fa fa-exclamation-triangle"></i>
+        </div></ng-template>
+
+      <ng-container *ngIf="!healthData.health?.checks?.length; else healthWarningAndError">
+        <div [ngStyle]="healthData.health.status | healthColor">
+          {{ healthData.health.status | healthLabel | uppercase }}
         </div>
+      </ng-container>
       </div>
     </cd-card>
 

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/upgrade/upgrade.component.spec.ts b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/upgrade/upgrade.component.spec.ts
index 574d3c8bb4c87b878c02770b020fbd069d30abf6..46b1d99204cb55693450e11d2d9d9138860f2efa 100644 (file)
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/upgrade/upgrade.component.spec.ts
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/upgrade/upgrade.component.spec.ts
@@ -179,4 +179,52 @@ describe('UpgradeComponent', () => {
     const loading = fixture.debugElement.nativeElement.querySelector('#upgrade-status-error');
     expect(loading.textContent).toContain('Failed to retrieve');
   });
+
+  it('should show popover when health warning is present', () => {
+    const healthPayload: Record<string, any> = {
+      health: {
+        status: 'HEALTH_WARN',
+        checks: [
+          {
+            severity: 'HEALTH_WARN',
+            summary: { message: '1 pool(s) do not have an application enabled', count: 1 },
+            detail: [
+              { message: "application not enabled on pool 'scbench'" },
+              {
+                message:
+                  "use 'ceph osd pool application enable <pool-name> <app-name>', where <app-name> is 'cephfs', 'rbd', 'rgw', or freeform for custom applications."
+              }
+            ],
+            muted: false,
+            type: 'POOL_APP_NOT_ENABLED'
+          }
+        ],
+        mutes: []
+      }
+    };
+
+    getHealthSpy.and.returnValue(of(healthPayload));
+    component.ngOnInit();
+    fixture.detectChanges();
+
+    const popover = fixture.debugElement.nativeElement.querySelector(
+      '.info-card-content-clickable'
+    );
+    expect(popover).not.toBeNull();
+  });
+
+  it('should not show popover when health warning is not present', () => {
+    const healthPayload: Record<string, any> = {
+      health: {
+        status: 'HEALTH_OK'
+      }
+    };
+    getHealthSpy.and.returnValue(of(healthPayload));
+    component.ngOnInit();
+    fixture.detectChanges();
+    const popover = fixture.debugElement.nativeElement.querySelector(
+      '.info-card-content-clickable'
+    );
+    expect(popover).toBeNull();
+  });
 });