refactor: rename LoadingDialogComponent to LoginLoaderComponent and adjust functionality

src/app/components/login/loading-dialog/loading-dialog.component.spec.ts

@@ -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<LoadingDialogComponent>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      imports: [LoadingDialogComponent]
-    })
-    .compileComponents();
-    
-    fixture = TestBed.createComponent(LoadingDialogComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

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

@@ -1,4 +1,5 @@
-@if (isButtonDisabled()) {
+<!-- Show loading indicator and text only if the button is deactivated -->
+@if (isLoginButtonDisabled()) {
 <div class="loading-dialog">
   <div id="loading" class="loader"></div>
   <div id="loadingText" class="loading-text">

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<LoginLoaderComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      imports: [LoginLoaderComponent],
+    }).compileComponents();
+
+    fixture = TestBed.createComponent(LoginLoaderComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

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',
+  templateUrl: './login-loader.component.html',
-  styleUrl: './loading-dialog.component.scss',
+  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;
   }
 }

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

@@ -98,17 +98,6 @@
           }}</a>
         </div>
       </div>
-      <!--       
-      <div class="google-button">
-        <app-form-btn
-          [class]="'btn-google'"
-          [type]="'button'"
-          [value]="'login.google' | translate"
-          [disabled]="sharedService.isBtnDisabled"
-          (click)="googleLogin()"
-        ></app-form-btn>
-      </div> 
-      -->
       <div class="form-buttons">
         <app-form-btn
           [class]="'btn-login'"
@@ -135,4 +124,4 @@
   </form>
   <app-footer></app-footer>
 </section>
-<app-loading-dialog></app-loading-dialog>
+<app-login-loader></app-login-loader>

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)) {

src/app/components/login/register/register.component.html

@@ -196,4 +196,4 @@
   </form>
   <app-footer></app-footer>
 </section>
-<app-loading-dialog></app-loading-dialog>
+<app-login-loader></app-login-loader>

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',