From ccbda0fd74bcfd7900faa61a2728a3a8fa787e19 Mon Sep 17 00:00:00 2001
From: Zoe Roux <zoe.roux@sdg.moe>
Date: Fri, 20 Mar 2020 00:22:18 +0100
Subject: [PATCH] Adding errors to the login/register view

---
 src/app/login/login.component.html | 11 ++++++++++-
 src/app/login/login.component.ts   | 11 +++++------
 2 files changed, 15 insertions(+), 7 deletions(-)

diff --git a/src/app/login/login.component.html b/src/app/login/login.component.html
index 60a85774..3bb132b6 100644
--- a/src/app/login/login.component.html
+++ b/src/app/login/login.component.html
@@ -29,6 +29,11 @@
 						</mat-form-field>
 						<br/>
 						<mat-checkbox class="pl-3" [(ngModel)]="loginInformation.stayLoggedIn" name="rememberme">Stay logged in</mat-checkbox>
+						<br/>
+						<br/>
+						<mat-error *ngFor="let item of this.loginErrors;">
+							{{item.description}}
+						</mat-error>
 					</mat-card-content>
 					<div fxFlexAlign="end" align="end" style="text-align: end">
 						<button mat-button type="submit" [disabled]="!loginForm.valid">Login</button>
@@ -38,7 +43,7 @@
 			<mat-tab label="Register">
 				<br/>
 				<form #signinForm="ngForm" (ngSubmit)="register()">
-					<mat-card-content>
+					<mat-card-content>						
 						<mat-form-field appearance="outline" class="w-75">
 							<mat-label>Email</mat-label>
 							<input matInput name="signinEmail" #signinEmail="ngModel" [(ngModel)]="signinInformation.email" required email>
@@ -73,6 +78,10 @@
 								Error: {{signinPassword.getError("passwordError")["error"]}}
 							</mat-error>
 						</mat-form-field>
+
+						<mat-error *ngFor="let item of this.registerErrors;">
+							{{item.description}}
+						</mat-error>
 					</mat-card-content>
 					<div fxFlexAlign="end" align="end" style="text-align: end">
 						<button mat-button type="submit" [disabled]="!signinForm.valid">Sigin</button>
diff --git a/src/app/login/login.component.ts b/src/app/login/login.component.ts
index 26726246..c608245c 100644
--- a/src/app/login/login.component.ts
+++ b/src/app/login/login.component.ts
@@ -16,6 +16,9 @@ export class LoginComponent
 	signinInformation: {email: string, username: string, password: string} = {email: "", username: "", password: ""};
 	hidePassword: boolean = true;
 	redirectURI: string;
+
+	loginErrors: [{code: string, description: string}];
+	registerErrors: [{code: string, description: string}];
 	
 	constructor(private router: Router, private route: ActivatedRoute, private http: HttpClient, private snackBar: MatSnackBar) 
 	{
@@ -29,14 +32,11 @@ export class LoginComponent
 	{
 		this.http.post("/api/account/login", this.loginInformation).pipe(catchError((error =>
 		{
-			console.log(error.status + " - " + error.message);
-			this.snackBar.open(`An unknown error occured: ${error.message}.`, null, { horizontalPosition: "left", panelClass: ['snackError'], duration: 2500 });
+			this.loginErrors = error.error;
 			return EMPTY;
 		}))).subscribe(() =>
 		{
 			window.location.href = this.redirectURI;
-		}, error => {
-			console.log("Login error: " + error);
 		});
 	}
 	
@@ -50,8 +50,7 @@ export class LoginComponent
 		// @ts-ignore
 		this.http.post<string>("/api/account/register", this.signinInformation, {responseType: "text"}).pipe(catchError((error =>
 		{
-			console.log(error.status + " - " + error.message);
-			this.snackBar.open(`An unknown error occured: ${error.message}.`, null, { horizontalPosition: "left", panelClass: ['snackError'], duration: 2500 });
+			this.registerErrors = JSON.parse(error.error);
 			return EMPTY;
 		}))).subscribe(otac => { this.useOTAC(otac); });
 	}