From: Pere Diaz Bou <pdiazbou@redhat.com>
Date: Mon, 30 May 2022 14:10:11 +0000 (+0200)
Subject: mgr/dashboard: move replaying images to Syncing tab
X-Git-Url: http://git.apps.os.sepia.ceph.com/?a=commitdiff_plain;h=f035d823fbac6387bc8e51a13e12dfed138b50fc;p=ceph.git

mgr/dashboard: move replaying images to Syncing tab

Resolves: rhbz#1891012

Images with 'Replaying' state will be displayed in Syncing tab. syncTmpl
removed as it was unnecessary if sate is provided from the backend.

Replaying images in contrast of Syncing images don't have a progress
percentage, nevertheless, we have an approximation of how much time left
there is until the image is fully synced. Therefore, we can use seconds_until_synced to represent the progress.

Signed-off-by: Pere Diaz Bou <pdiazbou@redhat.com>
(cherry picked from commit d225328363abc22f1f30f1a740e4d83faa0dfb8c)
---

diff --git a/src/pybind/mgr/dashboard/controllers/rbd_mirroring.py b/src/pybind/mgr/dashboard/controllers/rbd_mirroring.py
index f5bda8c8926f2..5a434fbd570b1 100644
--- a/src/pybind/mgr/dashboard/controllers/rbd_mirroring.py
+++ b/src/pybind/mgr/dashboard/controllers/rbd_mirroring.py
@@ -228,15 +228,17 @@ def _get_pool_datum(pool_name):
             'state': 'Error'
         },
         rbd.MIRROR_IMAGE_STATUS_STATE_SYNCING: {
-            'health': 'syncing'
+            'health': 'syncing',
+            'state_color': 'success',
+            'state': 'Syncing'
         },
         rbd.MIRROR_IMAGE_STATUS_STATE_STARTING_REPLAY: {
-            'health': 'ok',
+            'health': 'syncing',
             'state_color': 'success',
             'state': 'Starting'
         },
         rbd.MIRROR_IMAGE_STATUS_STATE_REPLAYING: {
-            'health': 'ok',
+            'health': 'syncing',
             'state_color': 'success',
             'state': 'Replaying'
         },
@@ -296,26 +298,36 @@ def _get_content_data():  # pylint: disable=R0914
         for mirror_image in mirror_images:
             image = {
                 'pool_name': pool_name,
-                'name': mirror_image['name']
+                'name': mirror_image['name'],
+                'state_color': mirror_image['state_color'],
+                'state': mirror_image['state']
             }
 
             if mirror_image['health'] == 'ok':
                 image.update({
-                    'state_color': mirror_image['state_color'],
-                    'state': mirror_image['state'],
                     'description': mirror_image['description']
                 })
                 image_ready.append(image)
             elif mirror_image['health'] == 'syncing':
-                p = re.compile("bootstrapping, IMAGE_COPY/COPY_OBJECT (.*)%")
-                image.update({
-                    'progress': (p.findall(mirror_image['description']) or [0])[0]
-                })
+                if mirror_image['state'] == 'Replaying':
+                    p = re.compile("replaying, ({.*})")
+                    replaying_data = p.findall(mirror_image['description'])
+                    assert len(replaying_data) == 1
+                    replaying_data = json.loads(replaying_data[0])
+                    seconds_until_synced = 0
+                    if 'seconds_until_synced' in replaying_data:
+                        seconds_until_synced = replaying_data['seconds_until_synced']
+                    image.update({
+                        'seconds_until_synced': seconds_until_synced
+                    })
+                else:
+                    p = re.compile("bootstrapping, IMAGE_COPY/COPY_OBJECT (.*)%")
+                    image.update({
+                        'progress': (p.findall(mirror_image['description']) or [0])[0]
+                    })
                 image_syncing.append(image)
             else:
                 image.update({
-                    'state_color': mirror_image['state_color'],
-                    'state': mirror_image['state'],
                     'description': mirror_image['description']
                 })
                 image_error.append(image)
diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/mirroring/image-list/image-list.component.html b/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/mirroring/image-list/image-list.component.html
index 25f1442f88759..a052f43c9a59a 100644
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/mirroring/image-list/image-list.component.html
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/mirroring/image-list/image-list.component.html
@@ -4,7 +4,7 @@
     cdStatefulTab="image-list">
   <li ngbNavItem="issues">
     <a ngbNavLink
-       i18n>Issues</a>
+       i18n>Issues ({{ image_error.data.length }})</a>
     <ng-template ngbNavContent>
       <cd-table [data]="image_error.data"
                 columnMode="flex"
@@ -17,7 +17,7 @@
   </li>
   <li ngbNavItem="syncing">
     <a ngbNavLink
-       i18n>Syncing</a>
+       i18n>Syncing ({{ image_syncing.data.length }})</a>
     <ng-template ngbNavContent>
       <cd-table [data]="image_syncing.data"
                 columnMode="flex"
@@ -30,7 +30,7 @@
   </li>
   <li ngbNavItem="ready">
     <a ngbNavLink
-       i18n>Ready</a>
+       i18n>Ready ({{ image_ready.data.length }})</a>
     <ng-template ngbNavContent>
       <cd-table [data]="image_ready.data"
                 columnMode="flex"
@@ -51,14 +51,19 @@
   <span [ngClass]="row.state_color | mirrorHealthColor">{{ value }}</span>
 </ng-template>
 
-<ng-template #syncTmpl>
-  <span class="badge badge-info"
-        i18n>Syncing</span>
-</ng-template>
-
 <ng-template #progressTmpl
+             let-row="row"
              let-value="value">
-  <ngb-progressbar type="info"
+  <div *ngIf="row.state === 'Replaying'">
+    <span *ngIf="row.seconds_until_synced == 0">
+      synced
+    </span>
+    <span *ngIf="row.seconds_until_synced > 0">
+      {{row.seconds_until_synced | duration }} until synced
+    </span>
+  </div>
+  <ngb-progressbar *ngIf="row.state === 'Syncing'"
+                    type="info"
                    [value]="value"
                    [showValue]="true"></ngb-progressbar>
 </ng-template>
diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/mirroring/image-list/image-list.component.ts b/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/mirroring/image-list/image-list.component.ts
index 015031ebeebf3..c7f6e91883e9b 100644
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/mirroring/image-list/image-list.component.ts
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/mirroring/image-list/image-list.component.ts
@@ -62,7 +62,7 @@ export class ImageListComponent implements OnInit, OnDestroy {
       {
         prop: 'state',
         name: $localize`State`,
-        cellTemplate: this.syncTmpl,
+        cellTemplate: this.stateTmpl,
         flexGrow: 1
       }
     ];