From 8c41a278aec69809a4def0941c49a40da8170308 Mon Sep 17 00:00:00 2001
From: Tiago Melo <tmelo@suse.com>
Date: Wed, 30 May 2018 10:59:16 +0100
Subject: [PATCH] mgr/dashboard: Add scrub action to the OSD table

Signed-off-by: Tiago Melo <tmelo@suse.com>
---
 .../src/app/ceph/cluster/cluster.module.ts    |  4 +-
 .../osd/osd-list/osd-list.component.html      | 37 ++++++++++++++-
 .../osd/osd-list/osd-list.component.ts        | 47 +++++++++++++------
 3 files changed, 69 insertions(+), 19 deletions(-)

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/cluster.module.ts b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/cluster.module.ts
index 364ac5c6680..9d0460e2b3e 100644
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/cluster.module.ts
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/cluster.module.ts
@@ -18,9 +18,7 @@ import { OsdPerformanceHistogramComponent } from './osd/osd-performance-histogra
 import { OsdScrubModalComponent } from './osd/osd-scrub-modal/osd-scrub-modal.component';
 
 @NgModule({
-  entryComponents: [
-    OsdDetailsComponent
-  ],
+  entryComponents: [OsdDetailsComponent, OsdScrubModalComponent],
   imports: [
     CommonModule,
     PerformanceCounterModule,
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 86db34300a4..c25b416d276 100644
--- 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
@@ -10,6 +10,37 @@
           selectionType="single"
           (updateSelection)="updateSelection($event)"
           [updateSelectionOnRefresh]="false">
+  <div class="table-actions">
+    <div class="btn-group"
+         dropdown>
+      <button dropdownToggle
+              type="button"
+              class="btn btn-sm btn-primary dropdown-toggle tc_scrub_toggle"
+              [ngClass]="{disabled: !tableComponent.selection.hasSelection}">
+        <ng-container i18n> Perform Task</ng-container>
+        <span class="caret"></span>
+      </button>
+      <ul *dropdownMenu
+          class="dropdown-menu"
+          role="menu">
+        <li role="menuitem"
+            (click)="scrubAction(false)">
+          <a>
+            <i class="fa fa-fw fa-stethoscope"></i>
+            <ng-container i18n>Scrub</ng-container>
+          </a>
+        </li>
+        <li role="menuitem"
+            (click)="scrubAction(true)">
+          <a>
+            <i class="fa fa-fw fa-stethoscope"></i>
+            <ng-container i18n>Deep Scrub</ng-container>
+          </a>
+        </li>
+      </ul>
+    </div>
+  </div>
+
   <cd-osd-details cdTableDetail
                   [selection]="selection">
   </cd-osd-details>
@@ -20,12 +51,14 @@
   <span *ngFor="let state of value; last as last">
     <span [class.text-success]="'up' === state || 'in' === state"
           [class.text-warning]="'down' === state || 'out' === state">
-      {{ state }}</span><span *ngIf="!last">, </span>
+      {{ state }}</span>
+    <span *ngIf="!last">, </span>
     <!-- Has to be on the same line to prevent a space between state and comma. -->
   </span>
 </ng-template>
 
 <ng-template #osdUsageTpl
              let-row="row">
-  <cd-usage-bar [totalBytes]="row.stats.stat_bytes" [usedBytes]="row.stats.stat_bytes_used"></cd-usage-bar>
+  <cd-usage-bar [totalBytes]="row.stats.stat_bytes"
+                [usedBytes]="row.stats.stat_bytes_used"></cd-usage-bar>
 </ng-template>
diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/osd/osd-list/osd-list.component.ts b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/osd/osd-list/osd-list.component.ts
index 2f3980947f5..223debe42bf 100644
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/osd/osd-list/osd-list.component.ts
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/osd/osd-list/osd-list.component.ts
@@ -1,38 +1,44 @@
 import { Component, OnInit, TemplateRef, ViewChild } from '@angular/core';
 
+import { BsModalRef, BsModalService } from 'ngx-bootstrap';
+
 import { OsdService } from '../../../../shared/api/osd.service';
+import { TableComponent } from '../../../../shared/datatable/table/table.component';
 import { CellTemplate } from '../../../../shared/enum/cell-template.enum';
 import { CdTableColumn } from '../../../../shared/models/cd-table-column';
 import { CdTableSelection } from '../../../../shared/models/cd-table-selection';
 import { DimlessBinaryPipe } from '../../../../shared/pipes/dimless-binary.pipe';
+import { OsdScrubModalComponent } from '../osd-scrub-modal/osd-scrub-modal.component';
 
 @Component({
   selector: 'cd-osd-list',
   templateUrl: './osd-list.component.html',
   styleUrls: ['./osd-list.component.scss']
 })
-
 export class OsdListComponent implements OnInit {
   @ViewChild('statusColor') statusColor: TemplateRef<any>;
   @ViewChild('osdUsageTpl') osdUsageTpl: TemplateRef<any>;
+  @ViewChild(TableComponent) tableComponent: TableComponent;
 
+  bsModalRef: BsModalRef;
   osds = [];
   columns: CdTableColumn[];
   selection = new CdTableSelection();
 
   constructor(
     private osdService: OsdService,
-    private dimlessBinaryPipe: DimlessBinaryPipe
-  ) { }
+    private dimlessBinaryPipe: DimlessBinaryPipe,
+    private modalService: BsModalService
+  ) {}
 
   ngOnInit() {
     this.columns = [
-      {prop: 'host.name', name: 'Host'},
-      {prop: 'id', name: 'ID', cellTransformation: CellTemplate.bold},
-      {prop: 'collectedStates', name: 'Status', cellTemplate: this.statusColor},
-      {prop: 'stats.numpg', name: 'PGs'},
-      {prop: 'stats.stat_bytes', name: 'Size', pipe: this.dimlessBinaryPipe},
-      {name: 'Usage', cellTemplate: this.osdUsageTpl},
+      { prop: 'host.name', name: 'Host' },
+      { prop: 'id', name: 'ID', cellTransformation: CellTemplate.bold },
+      { prop: 'collectedStates', name: 'Status', cellTemplate: this.statusColor },
+      { prop: 'stats.numpg', name: 'PGs' },
+      { prop: 'stats.stat_bytes', name: 'Size', pipe: this.dimlessBinaryPipe },
+      { name: 'Usage', cellTemplate: this.osdUsageTpl },
       {
         prop: 'stats_history.out_bytes',
         name: 'Read bytes',
@@ -43,8 +49,8 @@ export class OsdListComponent implements OnInit {
         name: 'Writes bytes',
         cellTransformation: CellTemplate.sparkline
       },
-      {prop: 'stats.op_r', name: 'Read ops', cellTransformation: CellTemplate.perSecond},
-      {prop: 'stats.op_w', name: 'Write ops', cellTransformation: CellTemplate.perSecond}
+      { prop: 'stats.op_r', name: 'Read ops', cellTransformation: CellTemplate.perSecond },
+      { prop: 'stats.op_w', name: 'Write ops', cellTransformation: CellTemplate.perSecond }
     ];
   }
 
@@ -57,19 +63,32 @@ export class OsdListComponent implements OnInit {
       this.osds = data;
       data.map((osd) => {
         osd.collectedStates = this.collectStates(osd);
-        osd.stats_history.out_bytes = osd.stats_history.op_out_bytes.map(i => i[1]);
-        osd.stats_history.in_bytes = osd.stats_history.op_in_bytes.map(i => i[1]);
+        osd.stats_history.out_bytes = osd.stats_history.op_out_bytes.map((i) => i[1]);
+        osd.stats_history.in_bytes = osd.stats_history.op_in_bytes.map((i) => i[1]);
         return osd;
       });
     });
   }
 
   collectStates(osd) {
-    const select = (onState, offState) => osd[onState] ? onState : offState;
+    const select = (onState, offState) => (osd[onState] ? onState : offState);
     return [select('up', 'down'), select('in', 'out')];
   }
 
   beforeShowDetails(selection: CdTableSelection) {
     return selection.hasSingleSelection;
   }
+
+  scrubAction(deep) {
+    if (!this.tableComponent.selection.hasSelection) {
+      return;
+    }
+
+    const initialState = {
+      selected: this.tableComponent.selection.selected,
+      deep: deep
+    };
+
+    this.bsModalRef = this.modalService.show(OsdScrubModalComponent, { initialState });
+  }
 }
-- 
2.39.5