Convert observables to signals.

frontend/src/app/pages/signin/signin.component.ts

@@ -1,26 +1,26 @@
-import { Component, OnDestroy, OnInit, inject } from '@angular/core';
-import { FormBuilder, FormControl, FormGroup, ReactiveFormsModule, Validators } from '@angular/forms';
-import { MatIconModule } from '@angular/material/icon';
-import { RouterModule } from '@angular/router';
-import { Subscription, debounceTime, distinctUntilChanged, map } from 'rxjs';
-import { SigninService } from './signin.service';
-import { LoginService } from '../login/login.service';
-import { FormError } from '../../core/model/FormError';
-import { SubmitButtonComponent } from "../../components/submit-button/submit-button.component";
-import { MatRippleModule } from '@angular/material/core';
+import {Component, inject, OnDestroy, OnInit} from '@angular/core';
+import {FormBuilder, FormControl, FormGroup, ReactiveFormsModule, Validators} from '@angular/forms';
+import {MatIconModule} from '@angular/material/icon';
+import {RouterModule} from '@angular/router';
+import {debounceTime, distinctUntilChanged, map, Subscription} from 'rxjs';
+import {SigninService} from './signin.service';
+import {LoginService} from '../login/login.service';
+import {FormError} from '../../core/model/FormError';
+import {SubmitButtonComponent} from "../../components/submit-button/submit-button.component";
+import {MatRippleModule} from '@angular/material/core';
 
 @Component({
-    selector: 'app-signin',
-    templateUrl: './signin.component.html',
-    styleUrl: './signin.component.scss',
-    imports: [
-        MatIconModule,
-        MatRippleModule,
-        ReactiveFormsModule,
-        RouterModule,
-        SubmitButtonComponent
-    ],
-    providers: [SigninService, LoginService]
+  selector: 'app-signin',
+  templateUrl: './signin.component.html',
+  styleUrl: './signin.component.scss',
+  imports: [
+    MatIconModule,
+    MatRippleModule,
+    ReactiveFormsModule,
+    RouterModule,
+    SubmitButtonComponent
+  ],
+  providers: [SigninService, LoginService]
 })
 export class SigninComponent implements OnInit, OnDestroy {
   private signinService = inject(SigninService);
@@ -38,63 +38,63 @@ export class SigninComponent implements OnInit, OnDestroy {
 
   ngOnInit(): void {
     const pseudoSubscription = this.signinForm.controls['pseudo'].valueChanges
-        .pipe(
-          debounceTime(300),
-          distinctUntilChanged(),
-          map(value => value?.length ? value as string : '')
-        )
-        .subscribe(pseudo => {
-          this.signinService.editPseudo(pseudo);
-        });
+      .pipe(
+        debounceTime(300),
+        distinctUntilChanged(),
+        map(value => value?.length ? value as string : '')
+      )
+      .subscribe(pseudo => {
+        this.signinService.editPseudo(pseudo);
+      });
     this.subscriptions.push(pseudoSubscription);
 
     const emailSubscription = this.signinForm.controls['email'].valueChanges
-        .pipe(
-          debounceTime(300),
-          distinctUntilChanged(),
-          map(value => value?.length ? value as string : '')
-        )
-        .subscribe(email => {
-          this.signinService.editEmail(email);
-        });
+      .pipe(
+        debounceTime(300),
+        distinctUntilChanged(),
+        map(value => value?.length ? value as string : '')
+      )
+      .subscribe(email => {
+        this.signinService.editEmail(email);
+      });
     this.subscriptions.push(emailSubscription);
 
     const passwordSubscription = this.signinForm.controls['password'].valueChanges
-        .pipe(
-          debounceTime(300),
-          distinctUntilChanged(),
-          map(value => value?.length ? value as string : '')
-        )
-        .subscribe(password => {
-          this.signinService.editPassword(password);
-        });
+      .pipe(
+        debounceTime(300),
+        distinctUntilChanged(),
+        map(value => value?.length ? value as string : '')
+      )
+      .subscribe(password => {
+        this.signinService.editPassword(password);
+      });
     this.subscriptions.push(passwordSubscription);
 
     const confirmPasswordSubscription = this.signinForm.controls['confirmPassword'].valueChanges
-        .pipe(
-          debounceTime(300),
-          distinctUntilChanged(),
-          map(value => value?.length ? value as string : '')
-        )
-        .subscribe(confirmPassword => {
-          this.signinService.editConfirmPassword(confirmPassword);
-        });
+      .pipe(
+        debounceTime(300),
+        distinctUntilChanged(),
+        map(value => value?.length ? value as string : '')
+      )
+      .subscribe(confirmPassword => {
+        this.signinService.editConfirmPassword(confirmPassword);
+      });
     this.subscriptions.push(confirmPasswordSubscription);
 
     const stateSubscription = this.signinService.state$
-        .subscribe(state => {
-          this.signinForm.controls['pseudo'].setValue(state.request.pseudo, { emitEvent: false });
-          this.signinForm.controls['email'].setValue(state.request.email, { emitEvent: false });
-          this.signinForm.controls['password'].setValue(state.request.password, { emitEvent: false });
-          this.signinForm.controls['confirmPassword'].setValue(state.confirmPassword, { emitEvent: false });
-        });
+      .subscribe(state => {
+        this.signinForm.controls['pseudo'].setValue(state.request.pseudo, {emitEvent: false});
+        this.signinForm.controls['email'].setValue(state.request.email, {emitEvent: false});
+        this.signinForm.controls['password'].setValue(state.request.password, {emitEvent: false});
+        this.signinForm.controls['confirmPassword'].setValue(state.confirmPassword, {emitEvent: false});
+      });
     this.subscriptions.push(stateSubscription);
   }
 
   ngOnDestroy(): void {
     this.subscriptions.forEach(subscription => subscription.unsubscribe());
   }
-  
+
   performSignin(): void {
     if (this.signinForm.valid) {
       this.signinService.performSignin();