bug fix, display correctly http error message inside Toaster service

src/app/components/permissions-management/add-permission-line/add-permission-line.component.ts

@@ -16,6 +16,7 @@ import {ApiInformationService} from "@services/api-information.service";
 import {Methods, Permission, PermissionActions} from "@models/api/permission";
 import {PermissionsService} from "@services/permissions.service";
 import {ToasterService} from "@services/toaster.service";
+import {HttpErrorResponse} from "@angular/common/http";
 
 @Component({
   selector: 'app-add-permission-line',
@@ -72,8 +73,10 @@ export class AddPermissionLineComponent implements OnInit {
       .subscribe(() => {
         this.toasterService.success(`permission was created`);
         this.reset();
-      }, (error) => {
+      }, (error: HttpErrorResponse) => {
-        this.toasterService.error(error);
+        this.toasterService.error(`
+        ${error.message}
+        ${error.error.message}`);
       });
   }
 }

src/app/components/role-management/role-detail/role-detail.component.ts

@@ -18,6 +18,7 @@ import {ServerService} from "@services/server.service";
 import {Role} from "@models/api/role";
 import {FormControl, FormGroup} from "@angular/forms";
 import {ToasterService} from "@services/toaster.service";
+import {HttpErrorResponse} from "@angular/common/http";
 
 @Component({
   selector: 'app-role-detail',
@@ -52,8 +53,9 @@ export class RoleDetailComponent implements OnInit {
       .subscribe(() => {
           this.toastService.success(`role: ${this.role.name} was updated`);
         },
-        (error) => {
+        (error: HttpErrorResponse) => {
-        this.toastService.error(error);
+          this.toastService.error(`${error.message}
+        ${error.error.message}`);
         });
   }
 }

src/app/components/role-management/role-detail/role-permissions/role-permissions.component.ts

@@ -20,6 +20,7 @@ import {Role} from "@models/api/role";
 import {Permission} from "@models/api/permission";
 import {Observable} from "rxjs/Rx";
 import {forkJoin} from "rxjs";
+import {HttpErrorResponse} from "@angular/common/http";
 
 @Component({
   selector: 'app-role-permissions',
@@ -61,8 +62,9 @@ export class RolePermissionsComponent implements OnInit {
           this.toastService.success(`permissions updated`);
           this.router.navigate(['/server', this.server.id, 'management', 'roles', this.role.role_id]);
         },
-        (error) => {
+        (error: HttpErrorResponse) => {
-          this.toastService.error(error);
+          this.toastService.error(`${error.message}
+          ${error.error.message}`);
         });
   }
 }

src/app/components/role-management/role-management.component.ts

@@ -26,6 +26,7 @@ import {RoleService} from "@services/role.service";
 import {AddRoleDialogComponent} from "@components/role-management/add-role-dialog/add-role-dialog.component";
 import {DeleteRoleDialogComponent} from "@components/role-management/delete-role-dialog/delete-role-dialog.component";
 import {forkJoin} from "rxjs";
+import {HttpErrorResponse} from "@angular/common/http";
 
 
 @Component({
@@ -95,7 +96,8 @@ export class RoleManagementComponent implements OnInit {
                 this.toasterService.success(`${role.name} role created`);
                 this.refresh();
               },
-              (error) => this.toasterService.error(error));
+              (error: HttpErrorResponse) => this.toasterService.error(`${error.message}
+              ${error.error.message}`));
         }
       });
   }

src/app/components/user-management/user-detail/user-permissions/user-permissions.component.ts

@@ -10,6 +10,7 @@ import {forkJoin} from "rxjs";
 import {Observable} from "rxjs/Rx";
 import {UserService} from "@services/user.service";
 import {User} from "@models/users/user";
+import {HttpErrorResponse} from "@angular/common/http";
 
 @Component({
   selector: 'app-user-permissions',
@@ -54,8 +55,9 @@ export class UserPermissionsComponent implements OnInit {
           this.toastService.success(`permissions updated`);
           this.router.navigate(['/server', this.server.id, 'management', 'users', this.user.user_id]);
         },
-        (error) => {
+        (error: HttpErrorResponse) => {
-          this.toastService.error(error);
+          this.toastService.error(`${error.message}
+          ${error.error.message}`);
         });
   }
 

src/styles.scss

@@ -23,6 +23,7 @@ a.table-link {
 .snackbar-error {
   background: #b00020 !important;
   color: white !important;
+  white-space: pre-wrap !important;
 }
 
 .mat-dialog-actions {