Le AlertHandlerComponent va maintenant chercher les alertes lui-même pour ne pas être limité à voir les alertes dans la queue lorsqu'une nouvelle alerte arrive.

src/app/modules/accounts/pages/login/login.component.ts

@@ -1,14 +1,20 @@
-import {Component, OnInit} from '@angular/core';
-import {FormBuilder, FormControl, FormGroup, Validators} from "@angular/forms";
-import {AccountService} from "../../services/account.service";
-import {Router} from "@angular/router";
+import {Component, OnInit} from '@angular/core'
+import {FormBuilder, FormControl, FormGroup, Validators} from '@angular/forms'
+import {AccountService} from '../../services/account.service'
+import {Router} from '@angular/router'
+import {ErrorHandler, ErrorModel, ErrorService} from '../../../shared/service/error.service'
 
 @Component({
   selector: 'cre-login',
   templateUrl: './login.component.html',
   styleUrls: ['./login.component.sass']
 })
-export class LoginComponent implements OnInit {
+export class LoginComponent extends ErrorHandler implements OnInit {
+  readonly handledErrorModels: ErrorModel[] = [{
+    filter: error => error.status === 401,
+    messageProducer: () => 'Les identifiants entrés sont invalides.'
+  }]
+
   form: FormGroup
   idFormControl: FormControl
   passwordFormControl: FormControl
@@ -18,8 +24,10 @@ export class LoginComponent implements OnInit {
   constructor(
     private formBuilder: FormBuilder,
     private accountService: AccountService,
-    private router: Router
+    private router: Router,
+    errorService: ErrorService
   ) {
+    super(errorService)
   }
 
   ngOnInit(): void {
@@ -39,8 +47,7 @@ export class LoginComponent implements OnInit {
     this.accountService.login(
       this.idFormControl.value,
       this.passwordFormControl.value,
-      () => this.router.navigate(["/color"]),
-      err => this.invalidCredentials = err.status === 401
+      () => this.router.navigate(['/color'])
     )
   }
 }