mgr/dashboard: increase Grafana iframe height to avoid scroll bar

Add Grafana component style four with height 1160px
Fixes : https://tracker.ceph.com/issues/44966
Signed-off-by: Ngwa Sedrick Meh <nsedrick101@gmail.com>

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/hosts/host-details/host-details.component.html b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/hosts/host-details/host-details.component.html
index fa4ce2f26e8fb69066c3842eb780a3bda4b224f7..79dd6daf668382e68ab5e924c3621fd0fe80eef6 100644 (file)
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/hosts/host-details/host-details.component.html
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/hosts/host-details/host-details.component.html
@@ -34,7 +34,7 @@
       <ng-template ngbNavContent>
         <cd-grafana [grafanaPath]="'host-details?var-ceph_hosts=' + selectedHostname"
                     uid="rtOg0AiWz"
-                    grafanaStyle="three">
+                    grafanaStyle="four">
         </cd-grafana>
       </ng-template>
     </li>

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 bca3f7407156d7f60c1a7bbfc44a2480ca83948d..78fb16762cb3abd92d043b6ea1ed29f87adb05ad 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
@@ -80,7 +80,7 @@
       <ng-template ngbNavContent>
         <cd-grafana [grafanaPath]="'osd-device-details?var-osd=osd.' + osd['id']"
                     uid="CrAHE0iZz"
-                    grafanaStyle="GrafanaStyles.two">
+                    grafanaStyle="three">
         </cd-grafana>
       </ng-template>
     </li>

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/osd/osd-list/osd-list.component.html b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/osd/osd-list/osd-list.component.html
index 81e1890e7a30be6a66c9f64865ef491d7875fccf..c8111e02612e0193e49c44c98a84dababd5c5df9 100644 (file)
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/osd/osd-list/osd-list.component.html
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/osd/osd-list/osd-list.component.html
@@ -45,7 +45,7 @@
     <ng-template ngbNavContent>
       <cd-grafana [grafanaPath]="'osd-overview?'"
                   uid="lo02I1Aiz"
-                  grafanaStyle="three">
+                  grafanaStyle="four">
       </cd-grafana>
     </ng-template>
   </li>

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/pool/pool-details/pool-details.component.html b/src/pybind/mgr/dashboard/frontend/src/app/ceph/pool/pool-details/pool-details.component.html
index 7492ddde6079cfbca2fb1385b4f8fd1a87115457..c2c6513888e799d01115232087456ae8f54bbd6f 100644 (file)
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/pool/pool-details/pool-details.component.html
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/pool/pool-details/pool-details.component.html
@@ -21,7 +21,7 @@
       <ng-template ngbNavContent>
         <cd-grafana [grafanaPath]="'ceph-pool-detail?var-pool_name='+ selection['pool_name']"
                     uid="-xyV8KCiz"
-                    grafanaStyle="one">
+                    grafanaStyle="three">
         </cd-grafana>
       </ng-template>
     </li>

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/shared/components/grafana/grafana.component.scss b/src/pybind/mgr/dashboard/frontend/src/app/shared/components/grafana/grafana.component.scss
index bdb90ff7b7237921012e21d8cd69a2ec4b36dd94..7b43a460ff42da3c79c45933bf07bb8a0f445a31 100644 (file)
--- a/src/pybind/mgr/dashboard/frontend/src/app/shared/components/grafana/grafana.component.scss
+++ b/src/pybind/mgr/dashboard/frontend/src/app/shared/components/grafana/grafana.component.scss
@@ -16,6 +16,10 @@
   height: 900px;
 }
 
+.grafana_four {
+  height: 1160px;
+}
+
 .timepicker {
   label {
     font-weight: 700;

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/shared/components/grafana/grafana.component.ts b/src/pybind/mgr/dashboard/frontend/src/app/shared/components/grafana/grafana.component.ts
index 18649d48870c2eeccc35f45457a9e7211f42a52e..7f341a636635cbad8151ccb85354075cce7ccc37 100644 (file)
--- a/src/pybind/mgr/dashboard/frontend/src/app/shared/components/grafana/grafana.component.ts
+++ b/src/pybind/mgr/dashboard/frontend/src/app/shared/components/grafana/grafana.component.ts
@@ -164,7 +164,8 @@ export class GrafanaComponent implements OnInit, OnChanges {
     this.styles = {
       one: 'grafana_one',
       two: 'grafana_two',
-      three: 'grafana_three'
+      three: 'grafana_three',
+      four: 'grafana_four'
     };
 
     this.settingsService.ifSettingConfigured('api/grafana/url', (url) => {