Ajout des sources

2023-09-12 21:46:56 +02:00
parent fa2288b8ed
commit 747948a422
235 changed files with 45064 additions and 0 deletions
@@ -0,0 +1,157 @@
+import { Component, OnInit, OnDestroy } from '@angular/core';
+import { NgIf } from '@angular/common';
+import { UntypedFormBuilder, UntypedFormGroup, AbstractControl, Validators, ValidatorFn, ValidationErrors, FormsModule, ReactiveFormsModule } from '@angular/forms';
+import { Title } from '@angular/platform-browser';
+import { ActivatedRoute, Router, RouterLink } from '@angular/router';
+import { MatButtonModule } from '@angular/material/button';
+import { MatInputModule } from '@angular/material/input';
+import { MatFormFieldModule } from '@angular/material/form-field';
+
+import { Observable, Observer, Subscription } from 'rxjs';
+import { take } from 'rxjs/operators';
+
+import { Errors } from 'src/app/core/models';
+import { UserService } from 'src/app/core/services';
+import { ListErrorsComponent, ShowAuthedDirective } from 'src/app/components/shared';
+
+@Component({
+    standalone: true,
+    imports: [
+        NgIf, RouterLink, FormsModule, ReactiveFormsModule,
+        MatFormFieldModule, MatInputModule, MatButtonModule,
+        ListErrorsComponent, ShowAuthedDirective
+    ],
+    selector: 'huapp-auth',
+    templateUrl: './auth.component.html',
+    styleUrls: ['./auth.component.scss']
+})
+export class AuthComponent implements OnInit, OnDestroy {
+    private _url: Subscription = new Subscription();
+    private _user: Subscription = new Subscription();
+    authType = '';
+    title = '';
+    btnTitle = '';
+    errors!: Errors;
+    isSubmitting = false;
+    authForm!: UntypedFormGroup;
+
+    constructor(
+        private route: ActivatedRoute,
+        private router: Router,
+        private titleService: Title,
+        private userService: UserService,
+        private fb: UntypedFormBuilder
+    ) {
+        this._resetErrors();
+        // use FormBuilder to create a form group
+        this.authForm = this.fb.group({
+            email: ['', [Validators.required, Validators.email]],
+            username: '',
+            firstname: '',
+            lastname: '',
+            phone: '',
+            password: ['', Validators.required],
+            confirmPassword: ''
+        }, { validators: this.checkPasswords });
+    }
+
+    ngOnInit() {
+        // you would normally unsubscribe from this observable subscription
+        // the active route observables are exemptions from unsubribe always rule
+        // see notes on: https://angular.io/guide/router#observable-parammap-and-component-reuse
+        this.route.url.pipe(take(1))
+        .subscribe(data => {
+            // Get the last piece of the URL (it's either 'login' or 'register')
+            this.authType = data[data.length - 1].path;
+            // Set a title for the page accordingly
+            if (this.authType === 'register') {
+                this.title = 'Création de compte';
+                this.btnTitle = 'Créer le compte';
+                this.titleService.setTitle(`Head Up - Créer un compte`);
+            } else {
+                this.title = 'Se connecter';
+                this.btnTitle = 'Se connecter';
+                this.titleService.setTitle(`Head Up - Connexion`);
+            }
+            // add form control for username if this is the register page
+            if (this.authType === 'register') {
+                this.authForm.controls["firstname"].setValidators([Validators.required]);
+                this.authForm.controls["lastname"].setValidators([Validators.required]);
+                this.authForm.controls["phone"].setValidators([Validators.required]);
+                this.authForm.controls["confirmPassword"].setValidators([Validators.minLength(8), Validators.required]);
+            }
+        });
+    }
+
+    ngOnDestroy() {
+        this._user.unsubscribe();
+        //this._url.unsubscribe();
+    }
+
+    submitForm() {
+        this.isSubmitting = true;
+
+        if (this.authForm.valid) {
+            this._resetErrors();
+            const credentials = this.authForm.value;
+            const user$ = this.userService.attemptAuth(this.authType, credentials).pipe(take(1));
+            this._user = user$.subscribe({
+                    next: () => this.router.navigateByUrl('/'),
+                    error: (err) => {
+                        this.errors = err;
+                        this.isSubmitting = false;
+                    }
+                });
+        }
+    }
+
+    getErrorMessage(name: string) {
+        switch (name) {
+            case 'email':
+                if (this.authForm.controls['email'].errors !== null) {
+                    return 'Indiquez votre adresse email';
+                }
+                break;
+            case 'firstname':
+                if (this.authForm.controls['firstname'].errors !== null) {
+                    return 'Vous devez indiquer votre prénnom';
+                }
+                break;
+            case 'lastname':
+                if (this.authForm.controls['lastname'].errors !== null) {
+                    return 'Vous devez indiquer votre nom';
+                }
+                break;
+            case 'phone':
+                if (this.authForm.controls['phone'].errors !== null) {
+                    return 'Vous devez indiquer votre numéro de téléphone';
+                }
+                break;
+            case 'password':
+                if (this.authForm.controls['password'].errors !== null) {
+                    return 'Un mot de passe est obligatoire';
+                }
+                break;
+            case 'confirmPassword':
+                if (this.authForm.controls['confirmPassword'].errors !== null) {
+                    return 'Une confirmation du mot de passe est obligatoire';
+                }
+                break;
+        }
+        return '';
+    }
+
+    checkPasswords: ValidatorFn = (group: AbstractControl): ValidationErrors | null => {
+        if (this.authType !== 'register') {
+            return null;
+        }
+        const pass = group.get('password')!.value;
+        const confirmPass = group.get('confirmPassword')!.value
+        return (pass === confirmPass && pass !== '') ? null : { notSame: true }
+    }
+
+    private _resetErrors(): void {
+        this.errors = { errors: {} };
+    }
+
+}