Simplified login failure handling

Author: Bernardo-MG

src/app/authentication/service/authentication.service.ts

@@ -24,7 +24,6 @@ export class AuthenticationService {
     const toUser = (status: LoginStatus) => this.loadUser(username, password, status);
 
     return this.http.post<ApiResponse<LoginStatus>>(this.loginUrl, { username, password })
-      .pipe(catchError(this.handleError))
       .pipe(map(response => response.content))
       .pipe(map(toUser));
   }
@@ -53,8 +52,4 @@ export class AuthenticationService {
     return this.user;
   }
 
-  private handleError(error: HttpErrorResponse) {
-    return throwError(() => new Error(error.message));
-  }
-
 }

src/app/login/components/login-form/login-form.component.html

@@ -23,7 +23,7 @@ <h4 class="card-header">Login</h4>
                     <span *ngIf="loading" class="spinner-border spinner-border-sm mr-1"></span>
                     Login
                 </button>
-                <div *ngIf="error" class="alert alert-danger mt-3 mb-0">{{error}}</div>
+                <div *ngIf="failed" class="alert alert-danger mt-3 mb-0">Invalid user</div>
             </form>
         </div>
     </div>

src/app/login/components/login-form/login-form.component.ts

@@ -11,7 +11,7 @@ export class LoginFormComponent {
 
   @Input() public loading = false;
 
-  @Input() public error = '';
+  @Input() public failed = false;
 
   @Output() public login = new EventEmitter<LoginUser>();
 

src/app/login/view/login-view/login-view.component.html

@@ -1 +1 @@
-<login-form (login)="onLogin($event)" [error]="error" [loading]="loading"></login-form>
+<login-form (login)="onLogin($event)" [failed]="failed" [loading]="loading"></login-form>

src/app/login/view/login-view/login-view.component.ts

@@ -13,7 +13,7 @@ export class LoginViewComponent implements OnInit {
 
   public loading = false;
 
-  public error = '';
+  public failed = false;
 
   private returnUrl: string = '';
 
@@ -37,13 +37,14 @@ export class LoginViewComponent implements OnInit {
     this.authenticationService.login(login.username, login.password)
       .subscribe({
         next: user => {
+          this.failed = false;
           this.loading = false;
           if (user.logged) {
             this.router.navigate([this.returnUrl]);
           }
         },
         error: error => {
-          this.error = error;
+          this.failed = true;
           this.loading = false;
         }
       });