New dashboard improvements.

- add build buttons
- add build settings support and backup into project clientData
- improved async alert
- fixed project dropdown

Signed-off-by: Sebastien Douheret <sebastien.douheret@iot.bzh>

8 files changed, 20 insertions, 32 deletions

diff --git a/webapp/src/app/pages/projects/project-add-modal/project-add-modal.component.html b/webapp/src/app/pages/projects/project-add-modal/project-add-modal.component.html
index e2c6748..9d26c71 100644
--- a/webapp/src/app/pages/projects/project-add-modal/project-add-modal.component.html
+++ b/webapp/src/app/pages/projects/project-add-modal/project-add-modal.component.html
@@ -39,13 +39,14 @@
           <input type="text" id="inputLabel" class="form-control" formControlName="label" (keyup)="onKeyLabel($event)">
         </div>
       </div>
-
-      <div class="offset-sm-3 col-sm-9">
-        <button class="btn btn-md btn-secondary" (click)="cancelAction=true; closeModal()"> Cancel </button>
-        <button class="btn btn-md btn-primary" type="submit" [disabled]="!addProjectForm.valid">Add Folder</button>
-      </div>
     </form>
   </div>
 </div>
 <div class="modal-footer form-group">
+  <div class="col-12">
+    <div class="offset-sm-4 col-sm-6">
+      <button class="btn btn-md btn-secondary" (click)="cancelAction=true; closeModal()"> Cancel </button>
+      <button class="btn btn-md btn-primary" (click)="onSubmit()" [disabled]="!addProjectForm.valid">Add Folder</button>
+    </div>
+  </div>
 </div>
diff --git a/webapp/src/app/pages/projects/project-add-modal/project-add-modal.component.ts b/webapp/src/app/pages/projects/project-add-modal/project-add-modal.component.ts
index 640ac5c..15b1b24 100644
--- a/webapp/src/app/pages/projects/project-add-modal/project-add-modal.component.ts
+++ b/webapp/src/app/pages/projects/project-add-modal/project-add-modal.component.ts
@@ -16,7 +16,7 @@ import { XDSConfigService } from '../../../@core-xds/services/xds-config.service
 @Component({
   selector: 'xds-project-add-modal',
   templateUrl: 'project-add-modal.component.html',
-  styleUrls: ['project-add-modal.component.scss']
+  styleUrls: ['project-add-modal.component.scss'],
 })
 export class ProjectAddModalComponent implements OnInit {
   // @Input('server-id') serverID: string;
@@ -24,7 +24,7 @@ export class ProjectAddModalComponent implements OnInit {
 
   cancelAction = false;
   userEditedLabel = false;
-  projectTypes = ProjectTypes;
+  projectTypes = Object.assign([], ProjectTypes);
 
   addProjectForm: FormGroup;
   typeCtrl: FormControl;
@@ -36,7 +36,7 @@ export class ProjectAddModalComponent implements OnInit {
     private projectSvr: ProjectService,
     private XdsConfigSvr: XDSConfigService,
     private fb: FormBuilder,
-    private activeModal: NgbActiveModal
+    private activeModal: NgbActiveModal,
   ) {
     // Define types (first one is special/placeholder)
     this.projectTypes.unshift({ value: ProjectType.UNSET, display: '--Select a type--' });
@@ -108,7 +108,7 @@ export class ProjectAddModalComponent implements OnInit {
     const formVal = this.addProjectForm.value;
 
     const type = formVal['type'].value;
-    this.projectSvr.Add({
+    this.projectSvr.add({
       serverId: this.serverID,
       label: formVal['label'],
       pathClient: formVal['pathCli'],
diff --git a/webapp/src/app/pages/projects/project-card/project-card.component.scss b/webapp/src/app/pages/projects/project-card/project-card.component.scss
index a433f58..6ac8d11 100644
--- a/webapp/src/app/pages/projects/project-card/project-card.component.scss
+++ b/webapp/src/app/pages/projects/project-card/project-card.component.scss
@@ -13,11 +13,6 @@ nb-card-footer {
   text-align: right;
 }
 
-.fa-big {
-  font-size: 20px;
-  font-weight: bold;
-}
-
 .fa-size-x2 {
   font-size: 20px;
 }
@@ -31,14 +26,6 @@ th label {
   margin-bottom: 0;
 }
 
-tr.info>th {
-  vertical-align: middle;
-}
-
-tr.info>td {
-  vertical-align: middle;
-}
-
 .btn-outline-danger.btn-xds {
   color: #ff4c6a;
   &:focus {
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..840d656 100644
--- a/webapp/src/app/pages/projects/project-card/project-card.component.ts
+++ b/webapp/src/app/pages/projects/project-card/project-card.component.ts
@@ -17,28 +17,28 @@ export class ProjectCardComponent {
 
   constructor(
     private alert: AlertService,
-    private projectSvr: ProjectService
+    private projectSvr: ProjectService,
   ) {
   }
 
   delete(prj: IProject) {
-    this.projectSvr.Delete(prj).subscribe(
+    this.projectSvr.delete(prj).subscribe(
       res => { },
-      err => this.alert.error('ERROR delete: ' + err)
+      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 {
diff --git a/webapp/src/app/pages/projects/projects.component.html b/webapp/src/app/pages/projects/projects.component.html
index 662dfcc..ecce824 100644
--- a/webapp/src/app/pages/projects/projects.component.html
+++ b/webapp/src/app/pages/projects/projects.component.html
@@ -20,7 +20,7 @@
       </div>
     </nb-card-body>
   </div>
-  <div class="col-md-12 col-lg-12 col-xxxl-6" *ngFor="let prj of (projects$ | async)">
+  <div class="col-md-6 col-lg-6" *ngFor="let prj of (projects$ | async)">
     <xds-project-card [project]="prj"></xds-project-card>
   </div>
 </div>
diff --git a/webapp/src/app/pages/projects/projects.component.scss b/webapp/src/app/pages/projects/projects.component.scss
index 3631fbb..92a8807 100644
--- a/webapp/src/app/pages/projects/projects.component.scss
+++ b/webapp/src/app/pages/projects/projects.component.scss
@@ -25,7 +25,7 @@
     order: 1;
     flex-direction: row-reverse;
   }
-  nb-actions>nb-action {
+  nb-actions > nb-action {
     padding: 0;
   }
   nb-action {
diff --git a/webapp/src/app/pages/projects/projects.component.ts b/webapp/src/app/pages/projects/projects.component.ts
index 179bbd0..761ff50 100644
--- a/webapp/src/app/pages/projects/projects.component.ts
+++ b/webapp/src/app/pages/projects/projects.component.ts
@@ -23,7 +23,7 @@ export class ProjectsComponent implements OnInit {
   }
 
   ngOnInit() {
-    this.projects$ = this.projectSvr.Projects$;
+    this.projects$ = this.projectSvr.projects$;
   }
 
   add() {
diff --git a/webapp/src/app/pages/projects/projects.module.ts b/webapp/src/app/pages/projects/projects.module.ts
index 48f37ce..960a2da 100644
--- a/webapp/src/app/pages/projects/projects.module.ts
+++ b/webapp/src/app/pages/projects/projects.module.ts
@@ -17,7 +17,7 @@ import { ProjectAddModalComponent } from './project-add-modal/project-add-modal.
     ProjectReadableTypePipe,
   ],
   entryComponents: [
-    ProjectAddModalComponent
+    ProjectAddModalComponent,
   ],
 })
 export class ProjectsModule { }