WIP multi error messages

src/app/app.module.ts

@@ -66,6 +66,7 @@ import { SelectObjectDialogComponent } from './components/select-object-dialog/s
 import { AutocompleteSelectComponent } from './components/autocomplete-select/autocomplete-select.component';
 import { LendingStationComponent } from './pages/dataPages/lending-station/lending-station.component';
 import { ProfileComponent } from './pages/profile/profile.component';
+import { ErrorSnackbarComponent, SnackbarDialog } from './helper/snackbar-ref.component';
 
 
 
@@ -96,6 +97,8 @@ import { ProfileComponent } from './pages/profile/profile.component';
     AutocompleteSelectComponent,
     LendingStationComponent,
     ProfileComponent,
+    ErrorSnackbarComponent,
+    SnackbarDialog
   ],
   imports: [
     BrowserModule,

src/app/helper/snackbar-dialog.html

@@ -0,0 +1,5 @@
+<h1 mat-dialog-title>Dialog with elements</h1>
+<div mat-dialog-content>This dialog showcases the title, close, content and actions elements.</div>
+<div mat-dialog-actions>
+  <button mat-button mat-dialog-close>Close</button>
+</div>

src/app/helper/snackbar-ref.component.ts

@@ -0,0 +1,35 @@
+import { Component, Inject } from '@angular/core';
+import { MatDialog } from '@angular/material/dialog';
+import { MAT_SNACK_BAR_DATA, MatSnackBarRef } from '@angular/material/snack-bar';
+
+@Component({
+  selector: 'app-error-snackbar',
+  template: `
+    <p>{{ data.message }}</p>
+    <button mat-raised-button
+            color="accent"
+            (click)="actionAndDismiss()">{{ data.action }}</button>
+  `,
+})
+
+
+export class ErrorSnackbarComponent {
+  constructor(
+    public snackBarRef: MatSnackBarRef<ErrorSnackbarComponent>,
+    public dialog: MatDialog,
+    @Inject(MAT_SNACK_BAR_DATA) public data: any,
+  ) {}
+
+
+  public actionAndDismiss(){
+      console.log("test");
+      this.dialog.open(SnackbarDialog);
+      this.snackBarRef.dismiss()
+  }
+}
+
+@Component({
+    selector: 'app-snackbar-dialog',
+    templateUrl: 'snackbar-dialog.html',
+  })
+  export class SnackbarDialog {}

src/app/helper/token.interceptor.ts

@@ -39,12 +39,11 @@ export class TokenInterceptor implements HttpInterceptor {
                 break;
             
               default:
-                errorMessage = `${error.error.message}. Error Code: ${error.status}.`;
+                errorMessage = this.serverErrorMessageGenerator(error);
                 break;
             }
             
-          } else  
-          if (error.status === 401) {
+          } else if (error.status === 401) {
             var urlSplit : string[] = error.url.split("/");  
             if (urlSplit[3] === "users" && urlSplit[5] === "update"){ // Allow user pw updates to be processed correctly
               errorMessage = "Das aktuelle Passwort ist inkorrekt.";
@@ -52,14 +51,29 @@ export class TokenInterceptor implements HttpInterceptor {
               return this.handle401Error(request, next);
             }
           } else {
-            errorMessage = `${error.error.message}. Error Code: ${error.status}.`;
+            errorMessage = this.serverErrorMessageGenerator(error);
           }
         }
+      if (errorMessage === "Viele Fehler sind aufgetreten.") {
+        this.snackBar.openSnackBar(errorMessage, "Erweitert", true, error.error.errors);
+      } else {
         this.snackBar.openSnackBar(errorMessage, "Ok", true);
+      }
+      
       return throwError(errorMessage);
     }));
   }
 
+  private serverErrorMessageGenerator (error: HttpErrorResponse): string  {
+    if (error.error.message === undefined){
+      return "Viele Fehler sind aufgetreten."  // If you change this you have to change it over this aswell
+    } else {
+      `${error.error.message}. Fehlercode: ${error.status}.`;
+    }
+
+  }
+
+
   private addToken(request: HttpRequest<any>, token: string) {
     return request.clone({
       setHeaders: {

src/app/services/snackbar.service.ts

@@ -1,5 +1,6 @@
 import { Injectable } from '@angular/core';
 import {MatSnackBar} from '@angular/material/snack-bar'; 
+import { ErrorSnackbarComponent } from '../helper/snackbar-ref.component';
 
 @Injectable({
   providedIn: 'root',
@@ -9,15 +10,26 @@ export class SnackBarService {
     constructor(private snackBar : MatSnackBar) { } 
   
   
-    openSnackBar(message: string, action: string = "", error: boolean = false) { 
+    openSnackBar(message: string, action: string = "", error: boolean = false, errorMessageArray: Object[] = undefined) { 
         if (error){
+            if (errorMessageArray === undefined){
                 this.snackBar.open(message, action, { 
                     duration: 5000, 
                     panelClass: ['mat-toolbar', 'mat-warn', 'simple-snack-bar']
                 });
+            } else {
+                this.snackBar.openFromComponent(ErrorSnackbarComponent, {
+                    data: {
+                            "message" : message,
+                            "action" : action,
+                          },
+                    panelClass: ['mat-toolbar', 'mat-warn', 'simple-snack-bar'],
+                    duration: 5000
+                  });
+            }
         } else {
             this.snackBar.open(message, action, { 
-                duration: 5000, 
+                duration: 2000, 
                 panelClass: ['mat-toolbar', 'mat-primary', 'simple-snack-bar']
             });
         }