mgr/dashboard: sort monitors by open sessions correctly.

Fixes: https://tracker.ceph.com/issues/42893
Signed-off-by: Alfonso Martínez <almartin@redhat.com>

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/monitor/monitor.component.spec.ts b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/monitor/monitor.component.spec.ts
index 497ca3b6e081daffd011352cdf711b0beb5725ac..b3f4ee53901a4f72d0c47116d813f8b9dd786d6b 100644 (file)
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/monitor/monitor.component.spec.ts
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/monitor/monitor.component.spec.ts
@@ -1,6 +1,9 @@
+import { HttpClientTestingModule } from '@angular/common/http/testing';
 import { NO_ERRORS_SCHEMA } from '@angular/core';
 import { ComponentFixture, TestBed } from '@angular/core/testing';
 
+import { of } from 'rxjs';
+
 import { configureTestBed, i18nProviders } from '../../../../testing/unit-test-helper';
 import { MonitorService } from '../../../shared/api/monitor.service';
 import { MonitorComponent } from './monitor.component';
@@ -8,22 +11,76 @@ import { MonitorComponent } from './monitor.component';
 describe('MonitorComponent', () => {
   let component: MonitorComponent;
   let fixture: ComponentFixture<MonitorComponent>;
-
-  const fakeService = {};
+  let getMonitorSpy: jasmine.Spy;
 
   configureTestBed({
+    imports: [HttpClientTestingModule],
     declarations: [MonitorComponent],
     schemas: [NO_ERRORS_SCHEMA],
-    providers: [{ provide: MonitorService, useValue: fakeService }, i18nProviders]
+    providers: [MonitorService, i18nProviders]
   });
 
   beforeEach(() => {
     fixture = TestBed.createComponent(MonitorComponent);
     component = fixture.componentInstance;
-    fixture.detectChanges();
+    const getMonitorPayload = {
+      in_quorum: [
+        {
+          stats: { num_sessions: [[1, 5]] }
+        },
+        {
+          stats: { num_sessions: [[1, 1], [2, 10], [3, 1]] }
+        },
+        {
+          stats: { num_sessions: [[1, 0], [2, 3]] }
+        },
+        {
+          stats: { num_sessions: [[1, 2], [2, 1], [3, 7], [4, 5]] }
+        }
+      ],
+      mon_status: null,
+      out_quorum: []
+    };
+    getMonitorSpy = spyOn(TestBed.get(MonitorService), 'getMonitor').and.returnValue(
+      of(getMonitorPayload)
+    );
   });
 
   it('should create', () => {
     expect(component).toBeTruthy();
   });
+
+  it('should sort by open sessions column correctly', () => {
+    component.refresh();
+
+    expect(getMonitorSpy).toHaveBeenCalled();
+
+    expect(component.inQuorum.columns[3].comparator(undefined, undefined)).toBe(0);
+    expect(component.inQuorum.columns[3].comparator(null, null)).toBe(0);
+    expect(component.inQuorum.columns[3].comparator([], [])).toBe(0);
+    expect(
+      component.inQuorum.columns[3].comparator(
+        component.inQuorum.data[0].cdOpenSessions,
+        component.inQuorum.data[3].cdOpenSessions
+      )
+    ).toBe(0);
+    expect(
+      component.inQuorum.columns[3].comparator(
+        component.inQuorum.data[0].cdOpenSessions,
+        component.inQuorum.data[1].cdOpenSessions
+      )
+    ).toBe(1);
+    expect(
+      component.inQuorum.columns[3].comparator(
+        component.inQuorum.data[1].cdOpenSessions,
+        component.inQuorum.data[0].cdOpenSessions
+      )
+    ).toBe(-1);
+    expect(
+      component.inQuorum.columns[3].comparator(
+        component.inQuorum.data[2].cdOpenSessions,
+        component.inQuorum.data[1].cdOpenSessions
+      )
+    ).toBe(1);
+  });
 });

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/monitor/monitor.component.ts b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/monitor/monitor.component.ts
index 6050ded5097e74a7d395c21d4f146878114e29d8..d53f8626168758de50c8c4eba5e41926300f990f 100644 (file)
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/monitor/monitor.component.ts
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/monitor/monitor.component.ts
@@ -1,6 +1,7 @@
 import { Component } from '@angular/core';
 
 import { I18n } from '@ngx-translate/i18n-polyfill';
+import * as _ from 'lodash';
 
 import { MonitorService } from '../../../shared/api/monitor.service';
 import { CellTemplate } from '../../../shared/enum/cell-template.enum';
@@ -16,10 +17,6 @@ export class MonitorComponent {
   notInQuorum: any;
 
   interval: any;
-  sparklineStyle = {
-    height: '30px',
-    width: '50%'
-  };
 
   constructor(private monitorService: MonitorService, private i18n: I18n) {
     this.inQuorum = {
@@ -30,7 +27,18 @@ export class MonitorComponent {
         {
           prop: 'cdOpenSessions',
           name: this.i18n('Open Sessions'),
-          cellTransformation: CellTemplate.sparkline
+          cellTransformation: CellTemplate.sparkline,
+          comparator: (dataA, dataB) => {
+            // We get the last value of time series to compare:
+            const lastValueA = _.last(dataA);
+            const lastValueB = _.last(dataB);
+
+            if (!lastValueA || !lastValueB || lastValueA === lastValueB) {
+              return 0;
+            }
+
+            return lastValueA > lastValueB ? 1 : -1;
+          }
         }
       ],
       data: []