ajout login fonctionnel

src/app/components/login/login.component.css

@@ -6,3 +6,13 @@
 .form-field {
   width: 100%;
 }
+
+.success-message {
+  color: green;
+  margin-top: 20px;
+}
+
+.error-message {
+  color: red;
+  margin-top: 20px;
+}

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

@@ -38,4 +38,12 @@
     [disabled]="login.invalid || password.invalid">
     Se connecter
   </button>
+
+  <!-- Message de retour de l'inscription -->
+  <div *ngIf="successLogin" class="success-message">
+    {{ successLogin }}
+  </div>
+  <div *ngIf="errorLogin" class="error-message">
+    {{ errorLogin }}
+  </div>
 </div>

src/app/components/login/login.component.ts

@@ -42,6 +42,9 @@ export class LoginComponent {
 
   errorMessage = '';
 
+  successLogin = '';
+  errorLogin = '';
+
   constructor(private userService: UserService) {
     merge(this.email.statusChanges, this.email.valueChanges)
       .pipe(takeUntilDestroyed())
@@ -58,7 +61,46 @@ export class LoginComponent {
     }
   }
 
+  // register() {
+  //   console.log('registering user :', this.login.value);
+
+  //   const form: any = {
+  //     value: {
+  //       login: this.login.value,
+  //       password: this.password.value,
+  //     },
+  //   };
+  //   this.userService.postUser(form).subscribe((response) => {
+  //     console.log('response :', response);
+  //     if ((response as any).success) {
+  //       this.successRegister = 'Votre compte a été créé avec succès.';
+  //       this.errorRegister = '';
+  //     } else {
+  //       this.errorRegister =
+  //         "L'inscription a échoué : un compte avec ce login existe déjà.";
+  //       this.successRegister = '';
+  //     }
+  //   });
+  // }
+
   loginAction() {
-    console.log('logining user :', this.login.value);
+    console.log('login user :', this.login.value);
+
+    const form: any = {
+      value: {
+        login: this.login.value,
+        password: this.password.value,
+      },
+    };
+    this.userService.loginUser(form).subscribe((response) => {
+      console.log('response :', response);
+      if ((response as any).success) {
+        this.successLogin = 'Vous êtes connecté.';
+        this.errorLogin = '';
+      } else {
+        this.errorLogin = "L'authentification a échoué.";
+        this.successLogin = '';
+      }
+    });
   }
 }

src/app/components/register/register.component.ts

@@ -72,7 +72,6 @@ export class RegisterComponent {
         password: this.password.value,
       },
     };
-    // this.userService.postUser(form);
     this.userService.postUser(form).subscribe((response) => {
       console.log('response :', response);
       if ((response as any).success) {

src/app/services/user.service.ts

@@ -27,6 +27,15 @@ export class UserService {
 
     return this.http.post<any>(`${this.API_URL}/users`, body);
   }
+
+  loginUser(form: NgForm): Observable<HttpResponse<Response>> {
+    let body = {
+      login: form.value.login,
+      password: form.value.password,
+    };
+
+    return this.http.post<any>(`${this.API_URL}/users/login`, body);
+  }
 }
 
 type Response = {