From cc3ffade78ad8700f58388a5f5e3861171ff52b9 Mon Sep 17 00:00:00 2001
From: Ricardo Marques <rimarques@suse.com>
Date: Thu, 19 Apr 2018 15:11:32 +0100
Subject: [PATCH] mgr/dashboard: RBD snapshot clone (frontend)

Signed-off-by: Ricardo Marques <rimarques@suse.com>
---
 .../frontend/src/app/app-routing.module.ts    |   5 +
 .../rbd-details/rbd-details.component.spec.ts |   3 +-
 .../rbd-form/rbd-form-clone-request.model.ts  |   9 ++
 .../ceph/block/rbd-form/rbd-form-mode.enum.ts |   4 +
 .../block/rbd-form/rbd-form-response.model.ts |   2 +
 .../block/rbd-form/rbd-form.component.html    |  27 ++++-
 .../ceph/block/rbd-form/rbd-form.component.ts | 101 ++++++++++++++++--
 .../ceph/block/rbd-form/rbd-parent.model.ts   |   5 +
 .../ceph/block/rbd-list/rbd-list.component.ts |   7 ++
 .../rbd-snapshot-list.component.html          |   6 ++
 .../rbd-snapshot-list.component.spec.ts       |   4 +-
 .../src/app/shared/api/rbd.service.ts         |   6 ++
 .../services/task-manager-message.service.ts  |  12 +++
 13 files changed, 174 insertions(+), 17 deletions(-)
 create mode 100644 src/pybind/mgr/dashboard/frontend/src/app/ceph/block/rbd-form/rbd-form-clone-request.model.ts
 create mode 100644 src/pybind/mgr/dashboard/frontend/src/app/ceph/block/rbd-form/rbd-form-mode.enum.ts
 create mode 100644 src/pybind/mgr/dashboard/frontend/src/app/ceph/block/rbd-form/rbd-parent.model.ts

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/app-routing.module.ts b/src/pybind/mgr/dashboard/frontend/src/app/app-routing.module.ts
index f6b0ed126d2..a015eebe050 100644
--- a/src/pybind/mgr/dashboard/frontend/src/app/app-routing.module.ts
+++ b/src/pybind/mgr/dashboard/frontend/src/app/app-routing.module.ts
@@ -49,6 +49,11 @@ const routes: Routes = [
   { path: 'rbd/add', component: RbdFormComponent, canActivate: [AuthGuardService] },
   { path: 'rbd/edit/:pool/:name', component: RbdFormComponent, canActivate: [AuthGuardService] },
   { path: 'pool', component: PoolListComponent, canActivate: [AuthGuardService] },
+  {
+    path: 'rbd/clone/:pool/:name/:snap',
+    component: RbdFormComponent,
+    canActivate: [AuthGuardService]
+  },
   {
     path: 'perf_counters/:type/:id',
     component: PerformanceCounterComponent,
diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/rbd-details/rbd-details.component.spec.ts b/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/rbd-details/rbd-details.component.spec.ts
index efca5704b5b..25a2d4507ce 100644
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/rbd-details/rbd-details.component.spec.ts
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/rbd-details/rbd-details.component.spec.ts
@@ -1,4 +1,5 @@
 import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { RouterTestingModule } from '@angular/router/testing';
 
 import { TabsModule, TooltipModule } from 'ngx-bootstrap';
 
@@ -13,7 +14,7 @@ describe('RbdDetailsComponent', () => {
   beforeEach(async(() => {
     TestBed.configureTestingModule({
       declarations: [ RbdDetailsComponent, RbdSnapshotListComponent ],
-      imports: [ SharedModule, TabsModule.forRoot(), TooltipModule.forRoot(), ]
+      imports: [ SharedModule, TabsModule.forRoot(), TooltipModule.forRoot(), RouterTestingModule]
     })
     .compileComponents();
   }));
diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/rbd-form/rbd-form-clone-request.model.ts b/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/rbd-form/rbd-form-clone-request.model.ts
new file mode 100644
index 00000000000..826d4cc3fa9
--- /dev/null
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/rbd-form/rbd-form-clone-request.model.ts
@@ -0,0 +1,9 @@
+export class RbdFormCloneRequestModel {
+  child_pool_name: string;
+  child_image_name: string;
+  obj_size: number;
+  features: Array<string> = [];
+  stripe_unit: number;
+  stripe_count: number;
+  data_pool: string;
+}
diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/rbd-form/rbd-form-mode.enum.ts b/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/rbd-form/rbd-form-mode.enum.ts
new file mode 100644
index 00000000000..c89005fbc19
--- /dev/null
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/rbd-form/rbd-form-mode.enum.ts
@@ -0,0 +1,4 @@
+export enum RbdFormMode {
+  editing = 'editing',
+  cloning = 'cloning'
+}
diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/rbd-form/rbd-form-response.model.ts b/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/rbd-form/rbd-form-response.model.ts
index 112d060502d..7468e3a2b50 100644
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/rbd-form/rbd-form-response.model.ts
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/rbd-form/rbd-form-response.model.ts
@@ -1,5 +1,7 @@
 import { RbdFormModel } from './rbd-form.model';
+import { RbdParentModel } from './rbd-parent.model';
 
 export class RbdFormResponseModel extends RbdFormModel {
   features_name: string[];
+  parent: RbdParentModel;
 }
diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/rbd-form/rbd-form.component.html b/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/rbd-form/rbd-form.component.html
index 19f745f5ec8..71bcda73c69 100644
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/rbd-form/rbd-form.component.html
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/rbd-form/rbd-form.component.html
@@ -4,7 +4,7 @@
     <li class="breadcrumb-item">
       <a routerLink="/block/rbd">Images</a></li>
     <li class="breadcrumb-item active"
-        i18n>{editing, select, 1 {Edit} other {Add}}</li>
+        i18n>{mode, select, editing {Edit} cloning {Clone} other {Add}}</li>
   </ol>
 </nav>
 
@@ -17,11 +17,28 @@
     <div class="panel panel-default">
       <div class="panel-heading">
         <h3 class="panel-title">
-          <span i18n>{editing, select, 1 {Edit} other {Add}}</span> RBD
+          <span i18n>{mode, select, editing {Edit} cloning {Clone} other {Add}}</span> RBD
         </h3>
       </div>
       <div class="panel-body">
 
+        <!-- Parent -->
+        <div class="form-group"
+             *ngIf="rbdForm.controls.parent.value">
+          <label i18n
+                 class="control-label col-sm-3"
+                 for="name">{mode, select, cloning {Clone from} other {Parent}}
+          </label>
+          <div class="col-sm-9">
+            <input class="form-control"
+                   type="text"
+                   id="parent"
+                   name="parent"
+                   formControlName="parent">
+            <hr>
+          </div>
+        </div>
+
         <!-- Name -->
         <div class="form-group"
              [ngClass]="{'has-error': (formDir.submitted || rbdForm.controls.name.dirty) && rbdForm.controls.name.invalid}">
@@ -175,7 +192,7 @@
           </label>
           <div class="col-sm-9">
             <div class="checkbox checkbox-primary"
-                 *ngIf="!editing">
+                 *ngIf="mode !== rbdFormMode.editing">
               <input type="checkbox"
                      id="default-features"
                      name="default-features"
@@ -184,7 +201,7 @@
                      for="default-features">Use default features</label>
             </div>
             <div *ngIf="!featuresFormGroups.value.defaultFeatures">
-              <br *ngIf="!editing">
+              <br *ngIf="mode !== rbdFormMode.editing">
               <div class="checkbox checkbox-primary"
                    *ngFor="let feature of featuresList">
                 <input type="checkbox"
@@ -299,7 +316,7 @@
           <cd-submit-button [form]="rbdForm"
                             type="button"
                             (submitAction)="submit()">
-            <span i18n>{editing, select, 1 {Update} other {Create}}</span> RBD
+            <span i18n>{mode, select, editing {Update} cloning {Clone} other {Create}}</span> RBD
           </cd-submit-button>
           <button i18n
                   type="button"
diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/rbd-form/rbd-form.component.ts b/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/rbd-form/rbd-form.component.ts
index 5e936f0a9e1..5eb224eb7cd 100644
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/rbd-form/rbd-form.component.ts
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/rbd-form/rbd-form.component.ts
@@ -13,8 +13,10 @@ import { FormatterService } from '../../../shared/services/formatter.service';
 import { NotificationService } from '../../../shared/services/notification.service';
 import { TaskManagerMessageService } from '../../../shared/services/task-manager-message.service';
 import { TaskManagerService } from '../../../shared/services/task-manager.service';
+import { RbdFormCloneRequestModel } from './rbd-form-clone-request.model';
 import { RbdFormCreateRequestModel } from './rbd-form-create-request.model';
 import { RbdFormEditRequestModel } from './rbd-form-edit-request.model';
+import { RbdFormMode } from './rbd-form-mode.enum';
 import { RbdFormResponseModel } from './rbd-form-response.model';
 
 @Component({
@@ -46,9 +48,11 @@ export class RbdFormComponent implements OnInit {
 
   advancedEnabled = false;
 
-  editing = false;
+  public rbdFormMode = RbdFormMode;
+  mode: RbdFormMode;
 
   response: RbdFormResponseModel;
+  snapName: string;
 
   defaultObjectSize = '4MiB';
 
@@ -142,6 +146,7 @@ export class RbdFormComponent implements OnInit {
       'fast-diff': this.fastDiffFormControl,
     });
     this.rbdForm = new FormGroup({
+      parent: new FormControl(''),
       name: new FormControl('', {
         validators: [
           Validators.required
@@ -167,6 +172,7 @@ export class RbdFormComponent implements OnInit {
   }
 
   disableForEdit() {
+    this.rbdForm.get('parent').disable();
     this.rbdForm.get('pool').disable();
     this.rbdForm.get('useDataPool').disable();
     this.rbdForm.get('dataPool').disable();
@@ -175,19 +181,28 @@ export class RbdFormComponent implements OnInit {
     this.rbdForm.get('stripingCount').disable();
   }
 
+  disableForClone() {
+    this.rbdForm.get('parent').disable();
+    this.rbdForm.get('size').disable();
+  }
+
   ngOnInit() {
     if (this.router.url.startsWith('/rbd/edit')) {
-      this.editing = true;
-    }
-    if (this.editing) {
+      this.mode = this.rbdFormMode.editing;
       this.disableForEdit();
+    } else if (this.router.url.startsWith('/rbd/clone')) {
+      this.mode = this.rbdFormMode.cloning;
+      this.disableForClone();
+    }
+    if (this.mode === this.rbdFormMode.editing || this.mode === this.rbdFormMode.cloning) {
       this.routeParamsSubscribe = this.route.params.subscribe(
-        (params: { pool: string, name: string }) => {
+        (params: { pool: string, name: string, snap: string }) => {
           const poolName = params.pool;
           const rbdName = params.name;
+          this.snapName = params.snap;
           this.rbdService.get(poolName, rbdName)
             .subscribe((resp: RbdFormResponseModel) => {
-              this.setResponse(resp);
+              this.setResponse(resp, this.snapName);
             });
         }
       );
@@ -330,7 +345,7 @@ export class RbdFormComponent implements OnInit {
           this.deepBoxCheck(feature, checked);
         }
       }
-      if (this.editing && this.featuresFormGroups.get(feature).enabled) {
+      if (this.mode === this.rbdFormMode.editing && this.featuresFormGroups.get(feature).enabled) {
 
         if (this.response.features_name.indexOf(feature) !== -1 && !details.allowDisable) {
           this.featuresFormGroups.get(feature).disable();
@@ -359,9 +374,18 @@ export class RbdFormComponent implements OnInit {
     }
   }
 
-  setResponse(response: RbdFormResponseModel) {
+  setResponse(response: RbdFormResponseModel, snapName: string) {
     this.response = response;
-    this.rbdForm.get('name').setValue(response.name);
+    if (this.mode === this.rbdFormMode.cloning) {
+      this.rbdForm.get('parent').setValue(`${response.pool_name}/${response.name}@${snapName}`);
+    } else if (response.parent) {
+      const parent = response.parent;
+      this.rbdForm.get('parent')
+        .setValue(`${parent.pool_name}/${parent.image_name}@${parent.snap_name}`);
+    }
+    if (this.mode === this.rbdFormMode.editing) {
+      this.rbdForm.get('name').setValue(response.name);
+    }
     this.rbdForm.get('pool').setValue(response.pool_name);
     if (response.data_pool) {
       this.rbdForm.get('useDataPool').setValue(true);
@@ -443,6 +467,26 @@ export class RbdFormComponent implements OnInit {
     return request;
   }
 
+  cloneRequest(): RbdFormCloneRequestModel {
+    const request = new RbdFormCloneRequestModel();
+    request.child_pool_name = this.rbdForm.get('pool').value;
+    request.child_image_name = this.rbdForm.get('name').value;
+    request.obj_size = this.formatter.toBytes(this.rbdForm.get('obj_size').value);
+    if (!this.defaultFeaturesFormControl.value) {
+      _.forIn(this.features, (feature) => {
+        if (this.featuresFormGroups.get(feature.key).value) {
+          request.features.push(feature.key);
+        }
+      });
+    } else {
+      request.features = null;
+    }
+    request.stripe_unit = this.formatter.toBytes(this.rbdForm.get('stripingUnit').value);
+    request.stripe_count = this.rbdForm.get('stripingCount').value;
+    request.data_pool = this.rbdForm.get('dataPool').value;
+    return request;
+  }
+
   editAction() {
     const request = this.editRequest();
     const finishedTask = new FinishedTask();
@@ -474,9 +518,46 @@ export class RbdFormComponent implements OnInit {
       });
   }
 
+  cloneAction() {
+    const request = this.cloneRequest();
+    const finishedTask = new FinishedTask();
+    finishedTask.name = 'rbd/clone';
+    finishedTask.metadata = {
+      'parent_pool_name': this.response.pool_name,
+      'parent_image_name': this.response.name,
+      'parent_snap_name': this.snapName,
+      'child_pool_name': request.child_pool_name,
+      'child_image_name': request.child_image_name
+    };
+    this.rbdService
+      .cloneSnapshot(this.response.pool_name, this.response.name, this.snapName, request)
+      .subscribe((resp) => {
+        if (resp.status === 202) {
+          this.notificationService.show(NotificationType.info,
+            `RBD clone in progress...`,
+            this.taskManagerMessageService.getDescription(finishedTask));
+          this.taskManagerService.subscribe(finishedTask.name, finishedTask.metadata,
+            (asyncFinishedTask: FinishedTask) => {
+              this.notificationService.notifyTask(asyncFinishedTask);
+            });
+        } else {
+          finishedTask.success = true;
+          this.notificationService.notifyTask(finishedTask);
+        }
+        this.router.navigate(['/block/rbd']);
+      }, (resp) => {
+        this.rbdForm.setErrors({'cdSubmitButton': true});
+        finishedTask.success = false;
+        finishedTask.exception = resp.error;
+        this.notificationService.notifyTask(finishedTask);
+      });
+  }
+
   submit() {
-    if (this.editing) {
+    if (this.mode === this.rbdFormMode.editing) {
       this.editAction();
+    } else if (this.mode === this.rbdFormMode.cloning) {
+      this.cloneAction();
     } else {
       this.createAction();
     }
diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/rbd-form/rbd-parent.model.ts b/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/rbd-form/rbd-parent.model.ts
new file mode 100644
index 00000000000..a10f8a3715e
--- /dev/null
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/rbd-form/rbd-parent.model.ts
@@ -0,0 +1,5 @@
+export class RbdParentModel {
+  image_name: string;
+  pool_name: string;
+  snap_name: string;
+}
diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/rbd-list/rbd-list.component.ts b/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/rbd-list/rbd-list.component.ts
index 6ac2fbb02ab..e223ff9f7c6 100644
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/rbd-list/rbd-list.component.ts
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/rbd-list/rbd-list.component.ts
@@ -201,6 +201,13 @@ export class RbdListComponent implements OnInit, OnDestroy {
         rbdModel.pool_name = executingTask.metadata['pool_name'];
         rbdModel.cdExecuting = 'creating';
         resultRBDs.push(rbdModel);
+
+      } else if (executingTask.name === 'rbd/clone') {
+        const rbdModel = new RbdModel();
+        rbdModel.name = executingTask.metadata['child_image_name'];
+        rbdModel.pool_name = executingTask.metadata['child_pool_name'];
+        rbdModel.cdExecuting = 'cloning';
+        resultRBDs.push(rbdModel);
       }
     });
     return resultRBDs;
diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/rbd-snapshot-list/rbd-snapshot-list.component.html b/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/rbd-snapshot-list/rbd-snapshot-list.component.html
index 76a1d42cb1c..944f755eed9 100644
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/rbd-snapshot-list/rbd-snapshot-list.component.html
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/rbd-snapshot-list/rbd-snapshot-list.component.html
@@ -33,6 +33,12 @@
             <span *ngIf="selection.first()?.is_protected"><i class="fa fa-fw fa-unlock"></i><span i18n>Unprotect</span></span>
           </a>
         </li>
+        <li role="menuitem"
+            [ngClass]="{'disabled': !selection.hasSingleSelection || selection.first().executing}">
+          <a class="dropdown-item" routerLink="/rbd/clone/{{ poolName }}/{{ rbdName }}/{{ selection.first()?.name }}">
+            <i class="fa fa-fw fa-clone"></i><span i18n>Clone</span>
+          </a>
+        </li>
         <li role="menuitem"
             [ngClass]="{'disabled': !selection.hasSingleSelection || selection.first().executing}">
           <a class="dropdown-item" (click)="rollbackModal()"><i class="fa fa-fw fa-undo"></i><span i18n>Rollback</span></a>
diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/rbd-snapshot-list/rbd-snapshot-list.component.spec.ts b/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/rbd-snapshot-list/rbd-snapshot-list.component.spec.ts
index c17eace27f8..54ebf3671aa 100644
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/rbd-snapshot-list/rbd-snapshot-list.component.spec.ts
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/rbd-snapshot-list/rbd-snapshot-list.component.spec.ts
@@ -1,5 +1,6 @@
 import { HttpClientTestingModule } from '@angular/common/http/testing';
 import { async, ComponentFixture, fakeAsync, TestBed, tick } from '@angular/core/testing';
+import { RouterTestingModule } from '@angular/router/testing';
 
 import { ToastModule } from 'ng2-toastr';
 import { BsModalRef, ModalModule } from 'ngx-bootstrap';
@@ -28,7 +29,8 @@ describe('RbdSnapshotListComponent', () => {
         ToastModule.forRoot(),
         ServicesModule,
         ApiModule,
-        HttpClientTestingModule
+        HttpClientTestingModule,
+        RouterTestingModule
       ],
       providers: [ AuthStorageService ]
     })
diff --git a/src/pybind/mgr/dashboard/frontend/src/app/shared/api/rbd.service.ts b/src/pybind/mgr/dashboard/frontend/src/app/shared/api/rbd.service.ts
index c57f1ec6feb..f01cbaad635 100644
--- a/src/pybind/mgr/dashboard/frontend/src/app/shared/api/rbd.service.ts
+++ b/src/pybind/mgr/dashboard/frontend/src/app/shared/api/rbd.service.ts
@@ -59,6 +59,12 @@ export class RbdService {
       { observe: 'response' });
   }
 
+  cloneSnapshot(poolName, rbdName, snapshotName, request) {
+    return this.http.post(
+      `api/block/image/${poolName}/${rbdName}/snap/${snapshotName}/clone`, request,
+      { observe: 'response' });
+  }
+
   deleteSnapshot(poolName, rbdName, snapshotName) {
     return this.http.delete(
       `api/block/image/${poolName}/${rbdName}/snap/${snapshotName}`,
diff --git a/src/pybind/mgr/dashboard/frontend/src/app/shared/services/task-manager-message.service.ts b/src/pybind/mgr/dashboard/frontend/src/app/shared/services/task-manager-message.service.ts
index cc4be50f0a0..f4fa85dc037 100644
--- a/src/pybind/mgr/dashboard/frontend/src/app/shared/services/task-manager-message.service.ts
+++ b/src/pybind/mgr/dashboard/frontend/src/app/shared/services/task-manager-message.service.ts
@@ -52,6 +52,18 @@ export class TaskManagerMessageService {
         };
       }
     ),
+    'rbd/clone': new TaskManagerMessage(
+      (metadata) => `Clone RBD '${metadata.child_pool_name}/${metadata.child_image_name}'`,
+      (metadata) => `RBD '${metadata.child_pool_name}/${metadata.child_image_name}'
+                     has been cloned successfully`,
+      (metadata) => {
+        return {
+          '17': `Name '${metadata.child_pool_name}/${metadata.child_image_name}' is already
+                 in use.`,
+          '22': `Snapshot must be protected.`
+        };
+      }
+    ),
     'rbd/snap/create': new TaskManagerMessage(
       (metadata) => `Create snapshot ` +
                     `'${metadata.pool_name}/${metadata.image_name}@${metadata.snapshot_name}'`,
-- 
2.39.5