Implementation of login and logout mechanisms.

sportshub-gui/src/app/components/login/login.component.ts

@@ -3,6 +3,7 @@ import {FormBuilder, FormControl, FormGroup, Validators} from "@angular/forms";
 import {UserRestService} from "../../core/rest-services/user.rest-service";
 import {LoginRequest} from "../../core/model/login-request";
 import {MatSnackBar} from "@angular/material/snack-bar";
+import {LoginService} from "./login.service";
 
 @Component({
   selector: 'app-login',
@@ -15,6 +16,7 @@ export class LoginComponent {
 
   constructor(
     private formBuilder: FormBuilder,
+    private loginService: LoginService,
     private matSnackBar: MatSnackBar,
     private userRestService: UserRestService
   ) {
@@ -25,14 +27,7 @@ export class LoginComponent {
   }
 
   onSubmit(): void {
-    this.isLoginPending = true;
     const loginRequest: LoginRequest = this.loginForm.value;
-    this.userRestService.login(loginRequest)
-      .then(loginResponse => {
-        this.matSnackBar.open('Login success!', 'Close', { duration: 5000 });
-      })
-      .catch(error => {
-        this.matSnackBar.open('An error occured while login.', 'Close', { duration: 5000 });
-      });
+    this.loginService.login(loginRequest);
   }
 }

sportshub-gui/src/app/components/login/login.module.ts

@@ -4,6 +4,7 @@ import {CoreModule} from "../../core/core.module";
 import {MatSnackBarModule} from "@angular/material/snack-bar";
 import {RouterModule} from "@angular/router";
 import {HttpClientModule} from "@angular/common/http";
+import {LoginService} from "./login.service";
 
 const routes = [
   {
@@ -16,6 +17,9 @@ const routes = [
   declarations: [
     LoginComponent
   ],
+  providers: [
+    LoginService
+  ],
   imports: [
     CoreModule,
     RouterModule.forChild(routes),

sportshub-gui/src/app/components/login/login.service.ts

@@ -0,0 +1,37 @@
+import {Injectable} from "@angular/core";
+import {UserRestService} from "../../core/rest-services/user.rest-service";
+import {LoginRequest} from "../../core/model/login-request";
+import {Subject} from "rxjs";
+import {MessageService} from "../../core/services/message.service";
+import {AuthenticationService} from "../../core/services/authentication.service";
+import {Router} from "@angular/router";
+
+@Injectable()
+export class LoginService {
+  private isLoginPending: Subject<boolean> = new Subject<boolean>();
+
+  constructor(
+    private authenticationService: AuthenticationService,
+    private messageService: MessageService,
+    private router: Router,
+    private userRestService: UserRestService
+  ) {}
+
+  login(loginRequest: LoginRequest): void {
+    this.isLoginPending.next(true);
+
+    this.userRestService.login(loginRequest)
+      .then(loginResponse => {
+        this.messageService.display('Login success!');
+        this.authenticationService.setAuthenticated(loginResponse);
+        this.router.navigate(['/']);
+      })
+      .catch(error => {
+        if (error.status === 400) {
+          this.messageService.display('Login or password incorrect.')
+        } else {
+          this.messageService.display('An error occured while login.')
+        }
+      });
+  }
+}

sportshub-gui/src/app/components/logout/logout.component.html

@@ -0,0 +1,2 @@
+<h1>Disconnection...</h1>
+<mat-spinner></mat-spinner>

sportshub-gui/src/app/components/logout/logout.component.scss

@@ -0,0 +1,6 @@
+:host {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+}

sportshub-gui/src/app/components/logout/logout.component.ts

@@ -0,0 +1,15 @@
+import {Component, inject, OnInit} from "@angular/core";
+import {LogoutService} from "./logout.service";
+
+@Component({
+  selector: 'app-logout',
+  templateUrl: './logout.component.html',
+  styleUrls: ['./logout.component.scss']
+})
+export class LogoutComponent implements OnInit {
+  private logoutService = inject(LogoutService);
+
+  ngOnInit(): void {
+    this.logoutService.logout();
+  }
+}

sportshub-gui/src/app/components/logout/logout.module.ts

@@ -0,0 +1,29 @@
+import {NgModule} from "@angular/core";
+import {RouterModule} from "@angular/router";
+import {LogoutComponent} from "./logout.component";
+import {MatProgressSpinnerModule} from "@angular/material/progress-spinner";
+import {LogoutService} from "./logout.service";
+
+const routes = [
+  {
+    path: '',
+    component: LogoutComponent
+  }
+];
+
+@NgModule({
+  declarations: [
+    LogoutComponent
+  ],
+  providers: [
+    LogoutService
+  ],
+  imports: [
+    RouterModule.forChild(routes),
+    MatProgressSpinnerModule
+  ],
+  exports: [
+    LogoutComponent
+  ]
+})
+export class LogoutModule {}

sportshub-gui/src/app/components/logout/logout.service.ts

@@ -0,0 +1,16 @@
+import {Injectable} from "@angular/core";
+import {AuthenticationService} from "../../core/services/authentication.service";
+import {Router} from "@angular/router";
+
+@Injectable()
+export class LogoutService {
+  constructor(
+    private authenticationService: AuthenticationService,
+    private router: Router
+  ) {}
+
+  logout(): void {
+    this.authenticationService.setAnonymous();
+    this.router.navigate(['/']);
+  }
+}