Add confirmation modal when deleting a project.

[src/xds/xds-agent.git] / webapp / src / app / pages / projects / project-card / project-card.component.ts

diff --git a/webapp/src/app/pages/projects/project-card/project-card.component.ts b/webapp/src/app/pages/projects/project-card/project-card.component.ts
index 160c4c8..eebab98 100644 (file)
--- a/webapp/src/app/pages/projects/project-card/project-card.component.ts
+++ b/webapp/src/app/pages/projects/project-card/project-card.component.ts
@@ -1,7 +1,26 @@
+/**
+* @license
+* Copyright (C) 2017 "IoT.bzh"
+* Author Sebastien Douheret <sebastien@iot.bzh>
+*
+* Licensed under the Apache License, Version 2.0 (the "License");
+* you may not use this file except in compliance with the License.
+* You may obtain a copy of the License at
+*
+*   http://www.apache.org/licenses/LICENSE-2.0
+*
+* Unless required by applicable law or agreed to in writing, software
+* distributed under the License is distributed on an "AS IS" BASIS,
+* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+* See the License for the specific language governing permissions and
+* limitations under the License.
+*/
+
 import { Component, Input, Pipe, PipeTransform } from '@angular/core';
 import { ProjectService, IProject, ProjectType, ProjectTypeEnum } from '../../../@core-xds/services/project.service';
 import { AlertService } from '../../../@core-xds/services/alert.service';
-
+import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
+import { ConfirmModalComponent, EType } from '../../confirm/confirm-modal/confirm-modal.component';
 
 @Component({
   selector: 'xds-project-card',
@@ -17,28 +36,48 @@ export class ProjectCardComponent {
 
   constructor(
     private alert: AlertService,
-    private projectSvr: ProjectService
+    private projectSvr: ProjectService,
+    private modalService: NgbModal,
   ) {
   }
 
   delete(prj: IProject) {
-    this.projectSvr.Delete(prj).subscribe(
-      res => { },
-      err => this.alert.error('ERROR delete: ' + err)
-    );
+
+    const modal = this.modalService.open(ConfirmModalComponent, {
+      size: 'lg',
+      backdrop: 'static',
+      container: 'nb-layout',
+    });
+    modal.componentInstance.title = 'Confirm SDK deletion';
+    modal.componentInstance.type = EType.YesNo;
+    modal.componentInstance.question = `
+      Do you <b>permanently delete '` + prj.label + `'</b> project ?
+      <br><br>
+      <i><small>(Project ID: ` + prj.id + ` )</small></i>`;
+
+    modal.result
+      .then(res => {
+        if (res === 'yes') {
+          this.projectSvr.delete(prj).subscribe(
+            r => { },
+            err => this.alert.error('ERROR delete: ' + err),
+          );
+        }
+      });
+
   }
 
   sync(prj: IProject) {
-    this.projectSvr.Sync(prj).subscribe(
+    this.projectSvr.sync(prj).subscribe(
       res => { },
-      err => this.alert.error('ERROR: ' + err)
+      err => this.alert.error('ERROR: ' + err),
     );
   }
 }
 
 // Make Project type human readable
 @Pipe({
-  name: 'readableType'
+  name: 'readableType',
 })
 
 export class ProjectReadableTypePipe implements PipeTransform {