add loading info to register and login

This commit is contained in:
rubikscraft 2022-09-04 14:43:19 +02:00
parent 27b5fdeae1
commit f602e71520
No known key found for this signature in database
GPG key ID: 1463EBE9200A5CD4
4 changed files with 26 additions and 4 deletions

View file

@ -40,8 +40,14 @@
</div>
<div class="col-12 py-2">
<button mat-raised-button color="accent" class="mx-2" type="submit">
LOGIN
<button
mat-raised-button
color="accent"
class="mx-2"
type="submit"
[disabled]="loading"
>
{{ loading ? 'LOADING...' : 'LOGIN' }}
</button>
<button
*ngIf="showRegister"

View file

@ -19,6 +19,7 @@ export class LoginComponent implements OnInit {
private readonly logger = new Logger(LoginComponent.name);
public showRegister = false;
public loading = false;
public readonly model = new LoginControl();
@ -52,7 +53,10 @@ export class LoginComponent implements OnInit {
return;
}
this.loading = true;
const user = await this.userService.login(data.username, data.password);
this.loading = false;
if (HasFailed(user)) {
this.logger.error(user.getReason());
this.utilService.showSnackBar(

View file

@ -66,8 +66,14 @@
>
LOGIN
</button>
<button mat-flat-button color="accent" class="mx-2" type="submit">
REGISTER
<button
mat-flat-button
color="accent"
class="mx-2"
type="submit"
[disabled]="loading"
>
{{ loading ? 'LOADING...' : 'REGISTER' }}
</button>
</div>
</form>

View file

@ -19,6 +19,7 @@ export class RegisterComponent implements OnInit {
private readonly logger = new Logger(RegisterComponent.name);
public showLogin = false;
public loading = false;
public readonly model = new RegisterControl();
@ -52,8 +53,11 @@ export class RegisterComponent implements OnInit {
return;
}
this.loading = true;
const user = await this.userService.register(data.username, data.password);
if (HasFailed(user)) {
this.loading = false;
this.logger.error(user.getReason());
this.utilService.showSnackBar(
'Register failed, please try again',
@ -86,6 +90,8 @@ export class RegisterComponent implements OnInit {
);
}
this.loading = false;
this.router.navigate(['/']);
}