From ec52547c4c3fbee5c79fe5de6530bf9d4db52a90 Mon Sep 17 00:00:00 2001
From: Hugo SUBTIL <ext.sopra.husubtil@grandlyon.com>
Date: Mon, 7 Dec 2020 15:21:55 +0100
Subject: [PATCH] feat(auth): add email verification page
---
src/app/app-routing.module.ts | 5 +++
src/app/app.module.ts | 2 +
src/app/services/auth.service.ts | 6 +++
.../user-verification.component.html | 13 +++++++
.../user-verification.component.scss | 0
.../user-verification.component.spec.ts | 25 +++++++++++++
.../user-verification.component.ts | 37 +++++++++++++++++++
7 files changed, 88 insertions(+)
create mode 100644 src/app/user-verification/user-verification.component.html
create mode 100644 src/app/user-verification/user-verification.component.scss
create mode 100644 src/app/user-verification/user-verification.component.spec.ts
create mode 100644 src/app/user-verification/user-verification.component.ts
diff --git a/src/app/app-routing.module.ts b/src/app/app-routing.module.ts
index 52a961c6c..cc9f16a25 100644
--- a/src/app/app-routing.module.ts
+++ b/src/app/app-routing.module.ts
@@ -5,6 +5,7 @@ import { HomeComponent } from './home/home.component';
import { LegalNoticeComponent } from './legal-notice/legal-notice.component';
import { StructureDetailsComponent } from './structure-list/components/structure-details/structure-details.component';
import { StructureListComponent } from './structure-list/structure-list.component';
+import { UserVerificationComponent } from './user-verification/user-verification.component';
const routes: Routes = [
{ path: 'print', outlet: 'print', children: [{ path: 'structure', component: StructureDetailsComponent }] },
@@ -36,6 +37,10 @@ const routes: Routes = [
path: 'about',
component: AboutComponent,
},
+ {
+ path: 'users/verify/:id',
+ component: UserVerificationComponent,
+ },
{
path: '**',
redirectTo: 'home',
diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index e951cd68b..02649bb09 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -22,6 +22,7 @@ import { ModalFilterComponent } from './structure-list/components/modal-filter/m
import { LegalNoticeComponent } from './legal-notice/legal-notice.component';
import { AboutComponent } from './about/about.component';
import { MenuPhoneComponent } from './menu-phone/menu-phone.component';
+import { UserVerificationComponent } from './user-verification/user-verification.component';
@NgModule({
declarations: [
@@ -38,6 +39,7 @@ import { MenuPhoneComponent } from './menu-phone/menu-phone.component';
LegalNoticeComponent,
AboutComponent,
MenuPhoneComponent,
+ UserVerificationComponent,
],
imports: [
BrowserModule,
diff --git a/src/app/services/auth.service.ts b/src/app/services/auth.service.ts
index 1341f4aa3..0a4e3810b 100644
--- a/src/app/services/auth.service.ts
+++ b/src/app/services/auth.service.ts
@@ -32,4 +32,10 @@ export class AuthService {
public register(user: User): Observable<any> {
return this.http.post('api/users', user);
}
+
+ public verifyUser(userId: string, token: string): Observable<any> {
+ return this.http.post(`api/users/verify/${userId}`, null, {
+ params: { token },
+ });
+ }
}
diff --git a/src/app/user-verification/user-verification.component.html b/src/app/user-verification/user-verification.component.html
new file mode 100644
index 000000000..acb513c81
--- /dev/null
+++ b/src/app/user-verification/user-verification.component.html
@@ -0,0 +1,13 @@
+<div fxLayout="column" class="content-container">
+ <h1 style="display: none">Vérification du mail utilisateur</h1>
+ <div class="section-container" fxLayout="colum" fxLayoutAlign="center center">
+ <p *ngIf="!verificationSuccess && !verificationIssue">Votre email est en cours de vérification ...</p>
+ <p *ngIf="verificationSuccess">
+ Vous avez correctement validé l'email associé a votre compte. Vous pouvez dès maintenant vous connecter au site.
+ </p>
+ <p *ngIf="verificationIssue">
+ Une erreur est survenue lors de la validation de votre email... Veuillez envoyer un mail au support.
+ </p>
+ <div></div>
+ </div>
+</div>
diff --git a/src/app/user-verification/user-verification.component.scss b/src/app/user-verification/user-verification.component.scss
new file mode 100644
index 000000000..e69de29bb
diff --git a/src/app/user-verification/user-verification.component.spec.ts b/src/app/user-verification/user-verification.component.spec.ts
new file mode 100644
index 000000000..241a7b6ad
--- /dev/null
+++ b/src/app/user-verification/user-verification.component.spec.ts
@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { UserVerificationComponent } from './user-verification.component';
+
+describe('UserVerificationComponent', () => {
+ let component: UserVerificationComponent;
+ let fixture: ComponentFixture<UserVerificationComponent>;
+
+ beforeEach(async () => {
+ await TestBed.configureTestingModule({
+ declarations: [ UserVerificationComponent ]
+ })
+ .compileComponents();
+ });
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(UserVerificationComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/app/user-verification/user-verification.component.ts b/src/app/user-verification/user-verification.component.ts
new file mode 100644
index 000000000..e5c0e4e79
--- /dev/null
+++ b/src/app/user-verification/user-verification.component.ts
@@ -0,0 +1,37 @@
+import { Component, OnInit } from '@angular/core';
+import { ActivatedRoute } from '@angular/router';
+import { AuthService } from '../services/auth.service';
+
+@Component({
+ selector: 'app-user-verification',
+ templateUrl: './user-verification.component.html',
+ styleUrls: ['./user-verification.component.scss'],
+})
+export class UserVerificationComponent implements OnInit {
+ public userId: string;
+ public token: string;
+ public verificationSuccess = false;
+ public verificationIssue = false;
+
+ constructor(private activatedRoute: ActivatedRoute, private authService: AuthService) {
+ this.activatedRoute.queryParams.subscribe((params) => {
+ this.token = params['token'];
+ });
+ }
+
+ ngOnInit(): void {
+ this.userId = this.activatedRoute.snapshot.paramMap.get('id');
+ this.sendVerification();
+ }
+
+ private sendVerification(): void {
+ this.authService.verifyUser(this.userId, this.token).subscribe(
+ () => {
+ this.verificationSuccess = true;
+ },
+ () => {
+ this.verificationIssue = true;
+ }
+ );
+ }
+}
--
GitLab