From 6c1aa9a1e6261b1f86b8e2d3061d31bc31466e67 Mon Sep 17 00:00:00 2001
From: Pere Diaz Bou <pere-altea@hotmail.com>
Date: Fri, 19 May 2023 11:54:38 +0200
Subject: [PATCH] mgr/dashboard: merge running and size columns in services
 page

Fixes: https://tracker.ceph.com/issues/61295
Signed-off-by: Pere Diaz Bou <pere-altea@hotmail.com>
(cherry picked from commit 3eeca5c5c42c85d1925828a2e9ac3d87c83a401b)
---
 .../ceph/cluster/services/services.component.html | 12 ++++++++++++
 .../ceph/cluster/services/services.component.ts   | 15 +++++++--------
 2 files changed, 19 insertions(+), 8 deletions(-)

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/services/services.component.html b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/services/services.component.html
index fbcc8583cf1d2..d84449e237eeb 100644
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/services/services.component.html
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/services/services.component.html
@@ -25,3 +25,15 @@
   </cd-table>
 </ng-container>
 <router-outlet name="modal"></router-outlet>
+
+
+<ng-template #runningTpl
+             let-value="value">
+  <span ngbTooltip="Service instances running out of the total number of services requested.">
+    {{ value.running }} / {{ value.size }}
+  </span>
+  <i *ngIf="value.running == 0 || value.size == 0"
+     class="icon-warning-color"
+     [ngClass]="[icons.warning]">
+  </i>
+</ng-template>
diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/services/services.component.ts b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/services/services.component.ts
index 55638de24de81..1234a684e6c9d 100644
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/services/services.component.ts
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/services/services.component.ts
@@ -1,4 +1,4 @@
-import { Component, Input, OnChanges, OnInit, ViewChild } from '@angular/core';
+import { Component, Input, OnChanges, OnInit, TemplateRef, ViewChild } from '@angular/core';
 import { Router } from '@angular/router';
 
 import { NgbModalRef } from '@ng-bootstrap/ng-bootstrap';
@@ -39,6 +39,8 @@ const BASE_URL = 'services';
 export class ServicesComponent extends ListWithDetails implements OnChanges, OnInit {
   @ViewChild(TableComponent, { static: true })
   table: TableComponent;
+  @ViewChild('runningTpl', { static: true })
+  public runningTpl: TemplateRef<any>;
 
   @Input() hostname: string;
 
@@ -68,6 +70,7 @@ export class ServicesComponent extends ListWithDetails implements OnChanges, OnI
   services: Array<CephServiceSpec> = [];
   isLoadingServices = false;
   selection: CdTableSelection = new CdTableSelection();
+  icons = Icons;
 
   constructor(
     private actionLabels: ActionLabelsI18n,
@@ -155,13 +158,9 @@ export class ServicesComponent extends ListWithDetails implements OnChanges, OnI
       },
       {
         name: $localize`Running`,
-        prop: 'status.running',
-        flexGrow: 1
-      },
-      {
-        name: $localize`Size`,
-        prop: 'status.size',
-        flexGrow: 1
+        prop: 'status',
+        flexGrow: 1,
+        cellTemplate: this.runningTpl
       },
       {
         name: $localize`Last Refreshed`,
-- 
2.39.5