From b02ebe78ba2f44530ddfbbdf64497f59f911cd74 Mon Sep 17 00:00:00 2001 From: Chneemann Date: Sat, 5 Apr 2025 14:14:30 +0200 Subject: [PATCH] refactor: rename LoadingDialogComponent to LoginLoaderComponent and adjust functionality --- .../loading-dialog.component.spec.ts | 23 ------------------- .../login-loader.component.html} | 3 ++- .../login-loader.component.scss} | 0 .../login-loader.component.spec.ts | 22 ++++++++++++++++++ .../login-loader.component.ts} | 14 +++++++---- src/app/components/login/login.component.html | 13 +---------- src/app/components/login/login.component.ts | 18 ++++----------- .../login/register/register.component.html | 2 +- .../login/register/register.component.ts | 4 ++-- 9 files changed, 42 insertions(+), 57 deletions(-) delete mode 100644 src/app/components/login/loading-dialog/loading-dialog.component.spec.ts rename src/app/components/login/{loading-dialog/loading-dialog.component.html => login-loader/login-loader.component.html} (70%) rename src/app/components/login/{loading-dialog/loading-dialog.component.scss => login-loader/login-loader.component.scss} (100%) create mode 100644 src/app/components/login/login-loader/login-loader.component.spec.ts rename src/app/components/login/{loading-dialog/loading-dialog.component.ts => login-loader/login-loader.component.ts} (53%) diff --git a/src/app/components/login/loading-dialog/loading-dialog.component.spec.ts b/src/app/components/login/loading-dialog/loading-dialog.component.spec.ts deleted file mode 100644 index eb04690..0000000 --- a/src/app/components/login/loading-dialog/loading-dialog.component.spec.ts +++ /dev/null @@ -1,23 +0,0 @@ -import { ComponentFixture, TestBed } from '@angular/core/testing'; - -import { LoadingDialogComponent } from './loading-dialog.component'; - -describe('LoadingDialogComponent', () => { - let component: LoadingDialogComponent; - let fixture: ComponentFixture; - - beforeEach(async () => { - await TestBed.configureTestingModule({ - imports: [LoadingDialogComponent] - }) - .compileComponents(); - - fixture = TestBed.createComponent(LoadingDialogComponent); - component = fixture.componentInstance; - fixture.detectChanges(); - }); - - it('should create', () => { - expect(component).toBeTruthy(); - }); -}); diff --git a/src/app/components/login/loading-dialog/loading-dialog.component.html b/src/app/components/login/login-loader/login-loader.component.html similarity index 70% rename from src/app/components/login/loading-dialog/loading-dialog.component.html rename to src/app/components/login/login-loader/login-loader.component.html index 8a65c3d..e32daf4 100644 --- a/src/app/components/login/loading-dialog/loading-dialog.component.html +++ b/src/app/components/login/login-loader/login-loader.component.html @@ -1,4 +1,5 @@ -@if (isButtonDisabled()) { + +@if (isLoginButtonDisabled()) {
diff --git a/src/app/components/login/loading-dialog/loading-dialog.component.scss b/src/app/components/login/login-loader/login-loader.component.scss similarity index 100% rename from src/app/components/login/loading-dialog/loading-dialog.component.scss rename to src/app/components/login/login-loader/login-loader.component.scss diff --git a/src/app/components/login/login-loader/login-loader.component.spec.ts b/src/app/components/login/login-loader/login-loader.component.spec.ts new file mode 100644 index 0000000..2f336c6 --- /dev/null +++ b/src/app/components/login/login-loader/login-loader.component.spec.ts @@ -0,0 +1,22 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { LoginLoaderComponent } from './login-loader.component'; + +describe('LoginLoaderComponent', () => { + let component: LoginLoaderComponent; + let fixture: ComponentFixture; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + imports: [LoginLoaderComponent], + }).compileComponents(); + + fixture = TestBed.createComponent(LoginLoaderComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/components/login/loading-dialog/loading-dialog.component.ts b/src/app/components/login/login-loader/login-loader.component.ts similarity index 53% rename from src/app/components/login/loading-dialog/loading-dialog.component.ts rename to src/app/components/login/login-loader/login-loader.component.ts index d149931..e0ab6aa 100644 --- a/src/app/components/login/loading-dialog/loading-dialog.component.ts +++ b/src/app/components/login/login-loader/login-loader.component.ts @@ -3,16 +3,20 @@ import { TranslateModule } from '@ngx-translate/core'; import { ButtonStateService } from '../../../services/button-state.service'; @Component({ - selector: 'app-loading-dialog', + selector: 'app-login-loader', standalone: true, imports: [TranslateModule], - templateUrl: './loading-dialog.component.html', - styleUrl: './loading-dialog.component.scss', + templateUrl: './login-loader.component.html', + styleUrl: './login-loader.component.scss', }) -export class LoadingDialogComponent { +export class LoginLoaderComponent { constructor(private buttonStateService: ButtonStateService) {} - isButtonDisabled() { + /** + * Checks if the button is disabled (i.e., loading is in progress) + * @returns whether the button is disabled + */ + isLoginButtonDisabled(): boolean { return this.buttonStateService.isButtonDisabled; } } diff --git a/src/app/components/login/login.component.html b/src/app/components/login/login.component.html index 41057b7..d8d396c 100644 --- a/src/app/components/login/login.component.html +++ b/src/app/components/login/login.component.html @@ -98,17 +98,6 @@ }}
-
- + diff --git a/src/app/components/login/login.component.ts b/src/app/components/login/login.component.ts index f4cad55..ad6072d 100644 --- a/src/app/components/login/login.component.ts +++ b/src/app/components/login/login.component.ts @@ -7,7 +7,7 @@ import { LoginService } from '../../services/login.service'; import { FooterComponent } from './footer/footer.component'; import { HeaderComponent } from './header/header.component'; import { TranslateModule } from '@ngx-translate/core'; -import { LoadingDialogComponent } from './loading-dialog/loading-dialog.component'; +import { LoginLoaderComponent } from './login-loader/login-loader.component'; import { OverlayService } from '../../services/overlay.service'; import { AuthService } from '../../services/auth.service'; import { TokenService } from '../../services/token.service'; @@ -23,7 +23,7 @@ import { ButtonStateService } from '../../services/button-state.service'; FooterComponent, HeaderComponent, TranslateModule, - LoadingDialogComponent, + LoginLoaderComponent, RouterLink, ], templateUrl: './login.component.html', @@ -74,33 +74,25 @@ export class LoginComponent { } async onSubmit(ngForm: NgForm) { - this.buttonStateService.enableButton(); + this.buttonStateService.disableButton(); if (ngForm.submitted && ngForm.form.valid) { try { await this.authService.login(this.loginData, this.checkboxRememberMe); this.router.navigate(['/summary']); - this.buttonStateService.disableButton(); + this.buttonStateService.enableButton(); } catch (error) { - this.buttonStateService.disableButton(); + this.buttonStateService.enableButton(); } } } guestLogin() { - this.buttonStateService.enableButton(); this.loginData.email = 'guest@guestaccount.com'; this.loginData.password = 'guest@guestaccount.com'; this.isPasswordIconVisible = !this.isPasswordIconVisible; this.onSubmit({ submitted: true, form: { valid: true } } as NgForm); } - /* - googleLogin() { - this.sharedService.isBtnDisabled = true; - this.loginService.googleLogin(); - } - */ - checkIfUserEmailIsValid(emailValue: string) { const emailRegex = /^[\w.%+-]+@[\w.-]+\.[a-zA-Z]{2,}$/; if (emailRegex.test(emailValue)) { diff --git a/src/app/components/login/register/register.component.html b/src/app/components/login/register/register.component.html index cf6131b..f65fcc0 100644 --- a/src/app/components/login/register/register.component.html +++ b/src/app/components/login/register/register.component.html @@ -196,4 +196,4 @@ - + diff --git a/src/app/components/login/register/register.component.ts b/src/app/components/login/register/register.component.ts index 39db1a4..7406316 100644 --- a/src/app/components/login/register/register.component.ts +++ b/src/app/components/login/register/register.component.ts @@ -8,8 +8,8 @@ import { LoginService } from '../../../services/login.service'; import { BtnBackComponent } from '../../../shared/components/buttons/btn-back/btn-back.component'; import { RouterModule } from '@angular/router'; import { TranslateModule, TranslateService } from '@ngx-translate/core'; -import { LoadingDialogComponent } from '../loading-dialog/loading-dialog.component'; import { ButtonStateService } from '../../../services/button-state.service'; +import { LoginLoaderComponent } from '../login-loader/login-loader.component'; @Component({ selector: 'app-register', @@ -23,7 +23,7 @@ import { ButtonStateService } from '../../../services/button-state.service'; CommonModule, RouterModule, TranslateModule, - LoadingDialogComponent, + LoginLoaderComponent, ], templateUrl: './register.component.html', styleUrl: './register.component.scss',