Skip to content

Commit b5536d8

Browse files
author
Aashish Sharma
committed
mgr/dashboard: Add Performance Details grafana charts for individual clusters in Manage-clusters page
Fixes: https://tracker.ceph.com/issues/67192 Signed-off-by: Aashish Sharma <[email protected]>
1 parent 67ff11f commit b5536d8

File tree

12 files changed

+108
-116
lines changed

12 files changed

+108
-116
lines changed

‎monitoring/ceph-mixin/dashboards/multi-cluster.libsonnet‎

Lines changed: 3 additions & 41 deletions
Original file line numberDiff line numberDiff line change
@@ -136,18 +136,6 @@ local g = import 'grafonnet/grafana.libsonnet';
136136
{ id: 'mappings', value: [{ options: { '0': { color: 'semi-dark-green', index: 2, text: 'Healthy' }, '1': { color: 'semi-dark-yellow', index: 0, text: 'Warning' }, '2': { color: 'semi-dark-red', index: 1, text: 'Error' } }, type: 'value' }] },
137137
],
138138
},
139-
{
140-
matcher: { id: 'byName', options: 'IOPS' },
141-
properties: [
142-
{ id: 'unit', value: 'ops' },
143-
],
144-
},
145-
{
146-
matcher: { id: 'byName', options: 'Value #E' },
147-
properties: [
148-
{ id: 'unit', value: 'bytes' },
149-
],
150-
},
151139
{
152140
matcher: { id: 'byName', options: 'Capacity Used' },
153141
properties: [
@@ -157,7 +145,7 @@ local g = import 'grafonnet/grafana.libsonnet';
157145
{
158146
matcher: { id: 'byName', options: 'Cluster' },
159147
properties: [
160-
{ id: 'links', value: [{ title: '', url: '/d/GQ3MHvnIz/ceph-cluster-new?var-cluster=${__data.fields.Cluster}&${DS_PROMETHEUS:queryparam}' }] },
148+
{ id: 'links', value: [{ title: '', url: '/d/edtb0oxdq/ceph-cluster?var-cluster=${__data.fields.Cluster}&${DS_PROMETHEUS:queryparam}' }] },
161149
],
162150
},
163151
{
@@ -211,9 +199,7 @@ local g = import 'grafonnet/grafana.libsonnet';
211199
'Value #A': 1,
212200
'Value #B': 20,
213201
'Value #C': 3,
214-
'Value #D': 4,
215-
'Value #E': 5,
216-
'Value #F': 6,
202+
'Value #D': 6,
217203
'__name__ 1': 9,
218204
'__name__ 2': 14,
219205
'__name__ 3': 24,
@@ -235,9 +221,7 @@ local g = import 'grafonnet/grafana.libsonnet';
235221
renameByName: {
236222
'Value #A': 'Status',
237223
'Value #C': 'Alerts',
238-
'Value #D': 'IOPS',
239-
'Value #E': 'Throughput',
240-
'Value #F': 'Capacity Used',
224+
'Value #D': 'Capacity Used',
241225
ceph_version: 'Version',
242226
cluster: 'Cluster',
243227
},
@@ -277,28 +261,6 @@ local g = import 'grafonnet/grafana.libsonnet';
277261
legendFormat='__auto',
278262
range=false,
279263
),
280-
$.addTargetSchema(
281-
expr='sum by (cluster) (irate(ceph_pool_wr[$__interval])) \n+ sum by (cluster) (irate(ceph_pool_rd[$__interval])) ',
282-
datasource={ type: 'prometheus', uid: '$datasource' },
283-
format='table',
284-
hide=false,
285-
exemplar=false,
286-
instant=true,
287-
interval='',
288-
legendFormat='__auto',
289-
range=false,
290-
),
291-
$.addTargetSchema(
292-
expr='sum by (cluster) (irate(ceph_pool_rd_bytes[$__interval]))\n+ sum by (cluster) (irate(ceph_pool_wr_bytes[$__interval])) ',
293-
datasource={ type: 'prometheus', uid: '$datasource' },
294-
format='table',
295-
hide=false,
296-
exemplar=false,
297-
instant=true,
298-
interval='',
299-
legendFormat='__auto',
300-
range=false,
301-
),
302264
$.addTargetSchema(
303265
expr='ceph_cluster_by_class_total_used_bytes',
304266
datasource={ type: 'prometheus', uid: '$datasource' },

‎monitoring/ceph-mixin/dashboards_out/ceph-cluster.json‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -32,6 +32,7 @@
3232
"editable": false,
3333
"gnetId": null,
3434
"graphTooltip": 0,
35+
"hideControls": false,
3536
"id": null,
3637
"iteration": 1525415495309,
3738
"links": [],
@@ -1428,5 +1429,6 @@
14281429
},
14291430
"timezone": "",
14301431
"title": "Ceph - Cluster",
1431-
"version": 13
1432+
"uid": "edtb0oxdq",
1433+
"version": 0
14321434
}

‎monitoring/ceph-mixin/dashboards_out/multi-cluster-overview.json‎

Lines changed: 4 additions & 64 deletions
Original file line numberDiff line numberDiff line change
@@ -247,30 +247,6 @@
247247
}
248248
]
249249
},
250-
{
251-
"matcher": {
252-
"id": "byName",
253-
"options": "IOPS"
254-
},
255-
"properties": [
256-
{
257-
"id": "unit",
258-
"value": "ops"
259-
}
260-
]
261-
},
262-
{
263-
"matcher": {
264-
"id": "byName",
265-
"options": "Value #E"
266-
},
267-
"properties": [
268-
{
269-
"id": "unit",
270-
"value": "bytes"
271-
}
272-
]
273-
},
274250
{
275251
"matcher": {
276252
"id": "byName",
@@ -294,7 +270,7 @@
294270
"value": [
295271
{
296272
"title": "",
297-
"url": "/d/GQ3MHvnIz/ceph-cluster-new?var-cluster=${__data.fields.Cluster}&${DS_PROMETHEUS:queryparam}"
273+
"url": "/d/edtb0oxdq/ceph-cluster?var-cluster=${__data.fields.Cluster}&${DS_PROMETHEUS:queryparam}"
298274
}
299275
]
300276
}
@@ -397,38 +373,6 @@
397373
"range": false,
398374
"refId": "C"
399375
},
400-
{
401-
"datasource": {
402-
"type": "prometheus",
403-
"uid": "$datasource"
404-
},
405-
"exemplar": false,
406-
"expr": "sum by (cluster) (irate(ceph_pool_wr[$__interval])) \n+ sum by (cluster) (irate(ceph_pool_rd[$__interval])) ",
407-
"format": "table",
408-
"hide": false,
409-
"instant": true,
410-
"interval": "",
411-
"intervalFactor": 1,
412-
"legendFormat": "__auto",
413-
"range": false,
414-
"refId": "D"
415-
},
416-
{
417-
"datasource": {
418-
"type": "prometheus",
419-
"uid": "$datasource"
420-
},
421-
"exemplar": false,
422-
"expr": "sum by (cluster) (irate(ceph_pool_rd_bytes[$__interval]))\n+ sum by (cluster) (irate(ceph_pool_wr_bytes[$__interval])) ",
423-
"format": "table",
424-
"hide": false,
425-
"instant": true,
426-
"interval": "",
427-
"intervalFactor": 1,
428-
"legendFormat": "__auto",
429-
"range": false,
430-
"refId": "E"
431-
},
432376
{
433377
"datasource": {
434378
"type": "prometheus",
@@ -443,7 +387,7 @@
443387
"intervalFactor": 1,
444388
"legendFormat": "__auto",
445389
"range": false,
446-
"refId": "F"
390+
"refId": "D"
447391
}
448392
],
449393
"timeFrom": null,
@@ -494,9 +438,7 @@
494438
"Value #A": 1,
495439
"Value #B": 20,
496440
"Value #C": 3,
497-
"Value #D": 4,
498-
"Value #E": 5,
499-
"Value #F": 6,
441+
"Value #D": 6,
500442
"__name__ 1": 9,
501443
"__name__ 2": 14,
502444
"__name__ 3": 24,
@@ -518,9 +460,7 @@
518460
"renameByName": {
519461
"Value #A": "Status",
520462
"Value #C": "Alerts",
521-
"Value #D": "IOPS",
522-
"Value #E": "Throughput",
523-
"Value #F": "Capacity Used",
463+
"Value #D": "Capacity Used",
524464
"ceph_version": "Version",
525465
"cluster": "Cluster"
526466
}

‎src/pybind/mgr/dashboard/frontend/src/app/app-routing.module.ts‎

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -50,6 +50,7 @@ import { CephfsVolumeFormComponent } from './ceph/cephfs/cephfs-form/cephfs-form
5050
import { UpgradeProgressComponent } from './ceph/cluster/upgrade/upgrade-progress/upgrade-progress.component';
5151
import { MultiClusterComponent } from './ceph/cluster/multi-cluster/multi-cluster.component';
5252
import { MultiClusterListComponent } from './ceph/cluster/multi-cluster/multi-cluster-list/multi-cluster-list.component';
53+
import { MultiClusterDetailsComponent } from './ceph/cluster/multi-cluster/multi-cluster-details/multi-cluster-details.component';
5354

5455
@Injectable()
5556
export class PerformanceCounterBreadcrumbsResolver extends BreadcrumbsResolver {
@@ -203,7 +204,13 @@ const routes: Routes = [
203204
component: MultiClusterListComponent,
204205
data: {
205206
breadcrumbs: 'Multi-Cluster/Manage Clusters'
206-
}
207+
},
208+
children: [
209+
{
210+
path: 'performance-details',
211+
component: MultiClusterDetailsComponent
212+
}
213+
]
207214
}
208215
]
209216
},

‎src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/cluster.module.ts‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -65,6 +65,7 @@ import { MultiClusterComponent } from './multi-cluster/multi-cluster.component';
6565
import { MultiClusterFormComponent } from './multi-cluster/multi-cluster-form/multi-cluster-form.component';
6666
import { MultiClusterListComponent } from './multi-cluster/multi-cluster-list/multi-cluster-list.component';
6767
import { DashboardV3Module } from '../dashboard-v3/dashboard-v3.module';
68+
import { MultiClusterDetailsComponent } from './multi-cluster/multi-cluster-details/multi-cluster-details.component';
6869

6970
@NgModule({
7071
imports: [
@@ -132,7 +133,8 @@ import { DashboardV3Module } from '../dashboard-v3/dashboard-v3.module';
132133
UpgradeProgressComponent,
133134
MultiClusterComponent,
134135
MultiClusterFormComponent,
135-
MultiClusterListComponent
136+
MultiClusterListComponent,
137+
MultiClusterDetailsComponent
136138
],
137139
providers: [NgbActiveModal]
138140
})

‎src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/multi-cluster/multi-cluster-details/multi-cluster-details.component.html‎

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
<ng-container *ngIf="selection">
2+
<nav ngbNav
3+
#nav="ngbNav"
4+
id="tabset-multi-cluster-details"
5+
class="nav-tabs"
6+
cdStatefulTab="multi-cluster-details">
7+
<ng-container ngbNavItem="performance-details"
8+
*ngIf="permissions.grafana.read">
9+
<a ngbNavLink
10+
routerLink="performance-details"
11+
i18n>Performance Details</a>
12+
<ng-template ngbNavContent>
13+
<cd-grafana i18n-title
14+
title="Cluster details"
15+
[grafanaPath]="'ceph-cluster?var-cluster=' + selectedClusterFsid"
16+
[type]="'metrics'"
17+
uid="edtb0oxdq"
18+
grafanaStyle="four">
19+
</cd-grafana>
20+
</ng-template>
21+
</ng-container>
22+
</nav>
23+
<div [ngbNavOutlet]="nav"></div>
24+
</ng-container>

‎src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/multi-cluster/multi-cluster-details/multi-cluster-details.component.scss‎

Whitespace-only changes.

‎src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/multi-cluster/multi-cluster-details/multi-cluster-details.component.spec.ts‎

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
import { ComponentFixture, TestBed } from '@angular/core/testing';
2+
3+
import { MultiClusterDetailsComponent } from './multi-cluster-details.component';
4+
5+
describe('MultiClusterDetailsComponent', () => {
6+
let component: MultiClusterDetailsComponent;
7+
let fixture: ComponentFixture<MultiClusterDetailsComponent>;
8+
9+
beforeEach(async () => {
10+
await TestBed.configureTestingModule({
11+
declarations: [MultiClusterDetailsComponent]
12+
}).compileComponents();
13+
14+
fixture = TestBed.createComponent(MultiClusterDetailsComponent);
15+
component = fixture.componentInstance;
16+
fixture.detectChanges();
17+
});
18+
19+
it('should create', () => {
20+
expect(component).toBeTruthy();
21+
});
22+
});

‎src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/multi-cluster/multi-cluster-details/multi-cluster-details.component.ts‎

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
import { Component, Input } from '@angular/core';
2+
3+
@Component({
4+
selector: 'cd-multi-cluster-details',
5+
templateUrl: './multi-cluster-details.component.html',
6+
styleUrls: ['./multi-cluster-details.component.scss']
7+
})
8+
export class MultiClusterDetailsComponent {
9+
@Input()
10+
permissions: Permissions;
11+
12+
@Input()
13+
selection: any;
14+
15+
get selectedClusterFsid(): string {
16+
return this.selection !== undefined ? this.selection['name'] : null;
17+
}
18+
}

‎src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/multi-cluster/multi-cluster-list/multi-cluster-list.component.html‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -34,6 +34,8 @@ <h4 class="mt-3">This cluster is already managed by cluster -
3434
[columns]="columns"
3535
columnMode="flex"
3636
selectionType="single"
37+
[hasDetails]="true"
38+
(setExpandedRow)="setExpandedRow($event)"
3739
[maxLimit]="25"
3840
(updateSelection)="updateSelection($event)">
3941
<div class="table-actions btn-toolbar">
@@ -44,6 +46,10 @@ <h4 class="mt-3">This cluster is already managed by cluster -
4446
[tableActions]="tableActions">
4547
</cd-table-actions>
4648
</div>
49+
<cd-multi-cluster-details cdTableDetail
50+
[permissions]="permissions"
51+
[selection]="expandedRow">
52+
</cd-multi-cluster-details>
4753
</cd-table>
4854
</ng-template>
4955
</ng-container>

0 commit comments

Comments
 (0)