snack errors

frontends/dnet-is-application/src/app/app.component.html

@@ -1,26 +1,19 @@
 <mat-sidenav-container class="sidenav-container">
   <mat-sidenav #drawer class="sidenav mat-elevation-z8" fixedInViewport
-        [attr.role]="(isHandset$ | async) ? 'dialog' : 'navigation'"
+    [attr.role]="(isHandset$ | async) ? 'dialog' : 'navigation'" [mode]="(isHandset$ | async) ? 'over' : 'side'"
-        [mode]="(isHandset$ | async) ? 'over' : 'side'"
     [opened]="(isHandset$ | async) === false">
     <app-main-menu-panels></app-main-menu-panels>
   </mat-sidenav>
   <mat-sidenav-content>
     <mat-toolbar color="primary">
-        <button
+      <button type="button" aria-label="Toggle sidenav" mat-icon-button (click)="drawer.toggle()">
-          type="button"
-          aria-label="Toggle sidenav"
-          mat-icon-button
-          (click)="drawer.toggle()">
         <mat-icon aria-label="Side nav toggle icon">menu</mat-icon>
       </button>
       <span>{{title}}</span>
     </mat-toolbar>
-    
     <div style="padding: 20px;">
       <!-- The routed views render in the <router-outlet>-->
       <router-outlet></router-outlet>
     </div>
   </mat-sidenav-content>
-  </mat-sidenav-container>
+</mat-sidenav-container>
-  

frontends/dnet-is-application/src/app/app.component.ts

@@ -1,4 +1,4 @@
-import { Component } from '@angular/core';
+import { Component, inject } from '@angular/core';
 import { TitleStrategy } from '@angular/router';
 import { BreakpointObserver, Breakpoints } from '@angular/cdk/layout';
 import { Observable } from 'rxjs';
@@ -21,3 +21,4 @@ export class AppComponent {
   constructor(private breakpointObserver: BreakpointObserver) {}
 
 }
+

frontends/dnet-is-application/src/app/app.module.ts

@@ -3,7 +3,7 @@ import { BrowserModule } from '@angular/platform-browser';
 import { FilterPipe } from './pipes/filter.pipe';
 import { AppRoutingModule } from './app-routing.module';
 import { AppComponent } from './app.component';
-import { FormsModule,ReactiveFormsModule } from '@angular/forms';
+import { FormsModule, ReactiveFormsModule } from '@angular/forms';
 import { HttpClientModule } from '@angular/common/http';
 import { InfoComponent } from './info/info.component';
 import { NoopAnimationsModule } from '@angular/platform-browser/animations';
@@ -13,7 +13,7 @@ import { MatButtonModule } from '@angular/material/button';
 import { MatSidenavModule } from '@angular/material/sidenav';
 import { MatIconModule } from '@angular/material/icon';
 import { MatListModule } from '@angular/material/list';
-import { MatTreeModule} from '@angular/material/tree';
+import { MatTreeModule } from '@angular/material/tree';
 import { MainMenuTreeComponent } from './main-menu-tree/main-menu-tree.component';
 import { MatBadgeModule } from '@angular/material/badge';
 import { MatCardModule } from '@angular/material/card';
@@ -25,8 +25,9 @@ import { MainMenuPanelsComponent } from './main-menu-panels/main-menu-panels.com
 import { MatExpansionModule } from '@angular/material/expansion';
 import { WfDialog, WfHistoryComponent } from './wf-history/wf-history.component';
 import { MatDialogModule } from '@angular/material/dialog';
-import {MatSortModule} from '@angular/material/sort';
+import { MatSortModule } from '@angular/material/sort';
 import { ResourcesComponent, ResContentDialog, ResCreateNewDialog, ResMetadataDialog } from './resources/resources.component'
+import { MatSnackBarModule } from '@angular/material/snack-bar';
 
 @NgModule({
   declarations: [
@@ -64,7 +65,8 @@ import { ResourcesComponent, ResContentDialog, ResCreateNewDialog, ResMetadataDi
     MatExpansionModule,
     MatDialogModule,
     MatSortModule,
-   ReactiveFormsModule
+    ReactiveFormsModule,
+    MatSnackBarModule
   ],
   providers: [],
   bootstrap: [AppComponent]

frontends/dnet-is-application/src/app/info/info.component.ts

@@ -1,5 +1,6 @@
 import { Component } from '@angular/core';
 import { ISService } from '../is.service';
+import { ISUtilsService } from '../is-utils.service';
 import { MatTableDataSource } from '@angular/material/table';
 import { KeyValue, Module } from '../model/controller.model';
 
@@ -21,7 +22,7 @@ export class InfoComponent {
   displayedKVColumns: string[] = ['k', 'v'];
   displayedModuleColumns: string[] = ['group', 'name', 'versions', 'files'];
  
-  constructor(public service:ISService)  {
+  constructor(public service:ISService, public utils:ISUtilsService)  {
     this.service.loadInfo().subscribe({
       next:(data:any[]) => {
         data.forEach(section => {
@@ -35,8 +36,7 @@ export class InfoComponent {
           }
         })
       },
-      error:error => console.log(error),
+      error:error => this.utils.snackError(error)
-      complete:()=>console.log("Completed")
     })
   }
 

frontends/dnet-is-application/src/app/is-utils.service.ts

@@ -1,21 +1,35 @@
-import { Injectable } from '@angular/core';
+import { Inject, Injectable } from '@angular/core';
 import { FormGroup } from '@angular/forms';
+import {MatSnackBar} from '@angular/material/snack-bar';
 
 @Injectable({
   providedIn: 'root'
 })
-export class IsUtilsService {
+export class ISUtilsService {
 
-  constructor() { }
+  constructor(public snackBar: MatSnackBar) { }
 
   prepareFormError(error:any, form:FormGroup): void {
-    if (error.error && error.error.message) {
+    form.setErrors({ serverError: this.errorMessage(error) })
-      form.setErrors({ serverError: error.error.message })
-    } else if (error.message) {
-      form.setErrors({ serverError: error.message })
-    } else {
-      form.setErrors({ serverError: 'Generic server side error' })
-    }
   }
 
+  snackError(error:any) {
+    this.snackBar.open(this.errorMessage(error), 'ERROR', {
+      duration: 5000,
+    });
+  }
+
+  alertError(error:any) {
+    alert(error);
+  }
+
+  private errorMessage(error:any) {
+    if (error.error && error.error.message) {
+      return error.error.message;
+    } else if (error.message) {
+      return error.message;
+    } else {
+      return 'Generic server side error';
+    }
+  }
 }

frontends/dnet-is-application/src/app/protocols/protocols.component.ts

@@ -1,5 +1,6 @@
 import { Component } from '@angular/core';
 import { ISService } from '../is.service';
+import { ISUtilsService } from '../is-utils.service';
 import { MatTableDataSource } from '@angular/material/table';
 import { Protocol, ProtocolParams } from '../model/controller.model';
 
@@ -17,7 +18,7 @@ export class ProtocolsComponent {
   protDatasources:ProtocolDatasource[] = [];
   colums : string[] = ['name', 'label', 'type', 'optional', 'hasSelFunction'];
 
-  constructor(public service:ISService)  {
+  constructor(public service:ISService, public utils:ISUtilsService)  {
     this.service.loadProtocols().subscribe({
       next:(data:Protocol[]) => {
         data.forEach(p => {
@@ -27,8 +28,7 @@ export class ProtocolsComponent {
          });
         })
       },
-      error:error => console.log(error),
+      error:error => this.utils.snackError(error)
-      complete:() => console.log("Completed")
     })
   }
 

frontends/dnet-is-application/src/app/resources/resources.component.ts

@@ -1,6 +1,6 @@
 import { Component, Inject,AfterViewInit, ViewChild, OnInit } from '@angular/core';
 import { ISService } from '../is.service';
-import { IsUtilsService } from '../is-utils.service';
+import { ISUtilsService } from '../is-utils.service';
 import { MatTableDataSource } from '@angular/material/table';
 import { MatSort, Sort } from '@angular/material/sort';
 import { ActivatedRoute } from '@angular/router';
@@ -22,7 +22,7 @@ export class ResourcesComponent implements OnInit {
   resources:SimpleResource[] = [];
   searchText:string = '';
 
-  constructor(public service: ISService, public route: ActivatedRoute, public newDialog: MatDialog, public contentDialog: MatDialog, public metadataDialog: MatDialog) {
+  constructor(public service: ISService, public utils:ISUtilsService, public route: ActivatedRoute, public newDialog: MatDialog, public contentDialog: MatDialog, public metadataDialog: MatDialog) {
   }
 
   ngOnInit() {
@@ -30,8 +30,7 @@ export class ResourcesComponent implements OnInit {
       this.typeId = params['type'];
       this.service.loadResourceType(this.typeId).subscribe({
         next: (data: ResourceType) => this.type = data,
-        error: error => console.log(error),
+        error: error => this.utils.snackError(error)
-        complete: () => console.log("Completed")
       });
       this.reload()
     });
@@ -41,8 +40,7 @@ export class ResourcesComponent implements OnInit {
     if (this.typeId) {
       this.service.loadSimpleResources(this.typeId).subscribe({
         next: (data: SimpleResource[]) => this.resources = data,
-        error: error => console.log(error),
+        error: error => this.utils.snackError(error)
-        complete: () => console.log("Completed")
       });
     }
   }
@@ -86,8 +84,7 @@ export class ResourcesComponent implements OnInit {
           if (result) this.reload();
         });
       },
-      error: error => console.log(error),
+      error: error => this.utils.snackError(error)
-      complete: () => console.log("Completed")
     });
   }
 
@@ -95,8 +92,7 @@ export class ResourcesComponent implements OnInit {
     if (confirm('Are you sure?')) {
       this.service.deleteSimpleResource(r).subscribe({
         next: (data: void) => this.reload(),
-        error: error => console.log(error),
+        error: error => this.utils.snackError(error)
-        complete: () => console.log("Completed")
       });
     }
 
@@ -116,7 +112,7 @@ export class ResContentDialog {
     content : this.contentFormControl
   });
 
-  constructor(public dialogRef: MatDialogRef<ResContentDialog>,  @Inject(MAT_DIALOG_DATA) public data: any, public service: ISService, public utils: IsUtilsService) {
+  constructor(public dialogRef: MatDialogRef<ResContentDialog>,  @Inject(MAT_DIALOG_DATA) public data: any, public service: ISService, public utils: ISUtilsService) {
     this.contentFormControl.setValue(data.content);
   }
 
@@ -127,8 +123,7 @@ export class ResContentDialog {
         next: (data: void) => {
           this.dialogRef.close(1)
         },
-        error: error => this.utils.prepareFormError(error, this.contentForm),
+        error: error => this.utils.prepareFormError(error, this.contentForm)
-        complete: () => console.log("Completed")
       });
     }
   }
@@ -149,7 +144,7 @@ export class ResMetadataDialog {
     description : new FormControl('')
   });
 
-  constructor(public dialogRef: MatDialogRef<ResMetadataDialog>,  @Inject(MAT_DIALOG_DATA) public data: any, public service: ISService, public utils: IsUtilsService) {
+  constructor(public dialogRef: MatDialogRef<ResMetadataDialog>,  @Inject(MAT_DIALOG_DATA) public data: any, public service: ISService, public utils: ISUtilsService) {
     this.metadataForm.get('name')?.setValue(data.name);
     if (data.description) {
       this.metadataForm.get('description')?.setValue(data.description);
@@ -163,8 +158,7 @@ export class ResMetadataDialog {
       next: (data: void) => {
         this.dialogRef.close(1)
       },
-      error: error => this.utils.prepareFormError(error, this.metadataForm),
+      error: error => this.utils.prepareFormError(error, this.metadataForm)
-      complete: () => console.log("Completed")
     });
   }
   
@@ -185,7 +179,7 @@ export class ResCreateNewDialog {
     content : new FormControl('')
   });
 
-  constructor(public dialogRef: MatDialogRef<ResCreateNewDialog>,  @Inject(MAT_DIALOG_DATA) public data: any, public service: ISService, public utils: IsUtilsService) {}
+  constructor(public dialogRef: MatDialogRef<ResCreateNewDialog>,  @Inject(MAT_DIALOG_DATA) public data: any, public service: ISService, public utils: ISUtilsService) {}
   
   onSubmit():void {
     let name:string = this.newResourceForm.get('name')?.value!;
@@ -197,8 +191,7 @@ export class ResCreateNewDialog {
       next: (data: void) => {
         this.dialogRef.close(1)
       },
-      error: error => this.utils.prepareFormError(error, this.newResourceForm),
+      error: error => this.utils.prepareFormError(error, this.newResourceForm)
-      complete: () => console.log("Completed")
     });
   }
   onNoClick(): void {

frontends/dnet-is-application/src/app/wf-history/wf-history.component.ts

@@ -1,5 +1,6 @@
 import { Component, Inject,AfterViewInit, OnInit, ViewChild } from '@angular/core';
 import { ISService } from '../is.service';
+import { ISUtilsService } from '../is-utils.service';
 import { MatTableDataSource } from '@angular/material/table';
 import { MatSort, Sort } from '@angular/material/sort';
 import { WfHistoryEntry } from '../model/controller.model';
@@ -24,7 +25,7 @@ export class WfHistoryComponent implements AfterViewInit , OnInit{
   from: number = -1
   to: number = -1
 
-  constructor(public service: ISService, public route: ActivatedRoute, public dialog: MatDialog)  {
+  constructor(public service: ISService, public utils:ISUtilsService, public route: ActivatedRoute, public dialog: MatDialog)  {
   }
 
   ngOnInit() {
@@ -42,8 +43,7 @@ export class WfHistoryComponent implements AfterViewInit , OnInit{
   
       this.service.loadWfHistory(this.total, this.from, this.to).subscribe({
         next: (data: WfHistoryEntry[]) => this.historyDatasource.data = data,
-        error: error => console.log(error),
+        error: error => this.utils.snackError(error)
-        complete: () => console.log("Completed")
       })
     });
   }