From 80960387fbb6d49c3681f4c9e249c441a891462a Mon Sep 17 00:00:00 2001
From: Pere Diaz Bou <pere-altea@hotmail.com>
Date: Mon, 3 Apr 2023 17:22:35 +0200
Subject: [PATCH] mgr/dashboard: fix displaying mirror image progress

Signed-off-by: Pere Diaz Bou <pere-altea@hotmail.com>
---
 .../mirroring/image-list/image-list.component.html    | 11 +++++++----
 .../mirroring/image-list/image-list.component.ts      |  2 +-
 2 files changed, 8 insertions(+), 5 deletions(-)

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 ef72663cde90d..1a92315101170 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
@@ -56,8 +56,11 @@
              let-value="value">
   <div *ngIf="row.state === 'Replaying'">
   </div>
-  <ngb-progressbar *ngIf="row.state === 'Syncing'"
-                   type="info"
-                   [value]="value"
-                   [showValue]="true"></ngb-progressbar>
+  <div class="w-100 h-100 d-flex justify-content-center align-items-center">
+    <ngb-progressbar *ngIf="row.state === 'Replaying'"
+                     type="info"
+                     class="w-100"
+                     [value]="value"
+                     [showValue]="true"></ngb-progressbar>
+  </div>
 </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 4966cc0af5dcc..babd46542e533 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
@@ -60,7 +60,7 @@ export class ImageListComponent implements OnInit, OnDestroy {
         flexGrow: 1
       },
       {
-        prop: 'progress',
+        prop: 'syncing_percent',
         name: $localize`Progress`,
         cellTemplate: this.progressTmpl,
         flexGrow: 2
-- 
2.39.5