From d7adf79a016fb7d0980125142b17f342d267f544 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Th=C3=A9ophile=20HUSS?= <theophile.huss@gmail.com>
Date: Fri, 6 Dec 2024 01:29:49 +0100
Subject: [PATCH] feat: Add logout button with API route
---
.../profile-info/profile-info.component.html | 23 ++++++++++---------
.../profile-info/profile-info.component.ts | 7 +++++-
src/app/services/user.service.ts | 4 ++++
3 files changed, 22 insertions(+), 12 deletions(-)
diff --git a/src/app/modules/profile/profile-info/profile-info.component.html b/src/app/modules/profile/profile-info/profile-info.component.html
index c05549a..9f0a467 100644
--- a/src/app/modules/profile/profile-info/profile-info.component.html
+++ b/src/app/modules/profile/profile-info/profile-info.component.html
@@ -1,33 +1,34 @@
<div class="question-marks">
+ <mat-icon *ngIf="isLogged" (click)="logOut()">logout</mat-icon>
<h1>Your profile</h1>
<div class="content">
<h3>Your stats</h3>
<div class="container">
<div class="grid-profile">
<div class="profile_info">
- <img src="https://cdn.pixabay.com/photo/2015/10/05/22/37/blank-profile-picture-973460_1280.png"
- alt="profile picture" />
+ <img
+ src="https://cdn.pixabay.com/photo/2015/10/05/22/37/blank-profile-picture-973460_1280.png"
+ alt="profile picture"
+ />
<h3>User Name</h3>
</div>
<hr />
<div class="profile_stats">
- <img src="https://img.uxcel.com/tags/key-performance-indicator-kpi-1698250709411-2x.jpg"
- alt="stats" />
+ <img
+ src="https://img.uxcel.com/tags/key-performance-indicator-kpi-1698250709411-2x.jpg"
+ alt="stats"
+ />
</div>
</div>
</div>
- <h3>Not logged in</h3>
- <div class="grid">
- <app-sign *ngIf="!isLogged"></app-sign>
- </div>
+ <app-sign *ngIf="!isLogged"></app-sign>
<div *ngIf="isLogged">
<h3>Your quizzes</h3>
<div class="grid">
<!-- <form [formGroup]="form" (ngSubmit)="submitForm()"> -->
<form>
<div class="form-group">
- <input type="text" class="inputRecherche" placeholder="Search a quiz..."
- formControlName="quizName" />
+ <input type="text" class="inputRecherche" placeholder="Search a quiz..." />
</div>
</form>
<div class="container">
@@ -41,4 +42,4 @@
</div>
</div>
</div>
-</div>
\ No newline at end of file
+</div>
diff --git a/src/app/modules/profile/profile-info/profile-info.component.ts b/src/app/modules/profile/profile-info/profile-info.component.ts
index 851e215..c721207 100644
--- a/src/app/modules/profile/profile-info/profile-info.component.ts
+++ b/src/app/modules/profile/profile-info/profile-info.component.ts
@@ -37,6 +37,11 @@ export class ProfileInfoComponent implements OnInit {
}
newQuiz() {
- this.router.navigate(['/create-custom-quiz']);
+ this.router.navigate(['/profile/create-custom-quiz']);
+ }
+
+ logOut() {
+ this.userSerivce.logout().subscribe();
+ this.router.navigate(['/']);
}
}
diff --git a/src/app/services/user.service.ts b/src/app/services/user.service.ts
index 1dfdc80..8116f41 100644
--- a/src/app/services/user.service.ts
+++ b/src/app/services/user.service.ts
@@ -23,4 +23,8 @@ export class UserService {
public getMe() {
return this.http.get(`${this.apiUrl}/user/me`, { withCredentials: true });
}
+
+ public logout() {
+ return this.http.post(`${this.apiUrl}/auth/logout`, {}, { withCredentials: true });
+ }
}
--
GitLab