diff --git a/src/app/components/login/register/register.component.html b/src/app/components/login/register/register.component.html index f65fcc0..9a0d55f 100644 --- a/src/app/components/login/register/register.component.html +++ b/src/app/components/login/register/register.component.html @@ -47,17 +47,17 @@ }} - @if(!registerData.mail) { + @if(!registerData.email) { @if(!mail.valid && mail.touched && - !checkIfUserEmailIsValid(registerData.mail.toLowerCase()) && + !isEmailValid(registerData.email.toLowerCase()) && !isButtonDisabled()) {

{{ "register.errorMail0" | translate }}

} @else { @if (mail.touched && - !checkIfUserEmailIsValid(registerData.mail.toLowerCase()) && + !isEmailValid(registerData.email.toLowerCase()) && !isButtonDisabled()) {

{{ "register.errorMail1" | translate }}

- } @else { @if (existEmailOnServer(registerData.mail.toLowerCase()) && + } @else { @if (errorHttpMessage === 'Email already exists' && !isButtonDisabled()) {

{{ "register.errorMail2" | translate }}

} } } @@ -109,7 +109,7 @@
@if (!password.valid && password.touched && !isButtonDisabled()) {

{{ "register.errorPassword0" | translate }}

- } @else { @if (registerData.password.length < 6 && password.touched && + } @else { @if (registerData.password.length < 8 && password.touched && !isButtonDisabled()) {

{{ "register.errorPassword1" | translate }}

} } @@ -181,14 +181,14 @@ [value]="'register.signup' | translate" [disabled]=" mail.invalid || - !registerData.mail || + !registerData.email || password.invalid || !registerData.password || !checkbox.valid || isButtonDisabled() || registerData.password.length < 6 || registerData.password !== registerData.passwordConfirm || - !checkIfUserEmailIsValid(registerData.mail) + !isEmailValid(registerData.email) " >
diff --git a/src/app/components/login/register/register.component.ts b/src/app/components/login/register/register.component.ts index 7406316..527f746 100644 --- a/src/app/components/login/register/register.component.ts +++ b/src/app/components/login/register/register.component.ts @@ -10,6 +10,7 @@ import { RouterModule } from '@angular/router'; import { TranslateModule, TranslateService } from '@ngx-translate/core'; import { ButtonStateService } from '../../../services/button-state.service'; import { LoginLoaderComponent } from '../login-loader/login-loader.component'; +import { AuthService } from '../../../services/auth.service'; @Component({ selector: 'app-register', @@ -29,11 +30,13 @@ import { LoginLoaderComponent } from '../login-loader/login-loader.component'; styleUrl: './register.component.scss', }) export class RegisterComponent { + errorHttpMessage: string = ''; + registerData = { name: '', firstName: '', lastName: '', - mail: '', + email: '', password: '', passwordConfirm: '', checkboxState: '', @@ -42,14 +45,23 @@ export class RegisterComponent { constructor( public loginService: LoginService, public translateService: TranslateService, + private authService: AuthService, private buttonStateService: ButtonStateService ) {} - onSubmit(ngForm: NgForm) { - this.buttonStateService.enableButton(); + async onSubmit(ngForm: NgForm) { + this.buttonStateService.disableButton(); if (ngForm.submitted && ngForm.form.valid) { - this.splitName(); - this.loginService.register(this.registerData); + this.extractFirstAndLastName(); + try { + await this.authService.register(this.registerData); + this.buttonStateService.enableButton(); + } catch (error: any) { + this.errorHttpMessage = error.message; + this.buttonStateService.enableButton(); + } + } else { + this.buttonStateService.enableButton(); } } @@ -57,17 +69,13 @@ export class RegisterComponent { return this.buttonStateService.isButtonDisabled; } - splitName() { + extractFirstAndLastName() { const names = this.registerData.name.split(' '); this.registerData.firstName = names[0]; this.registerData.lastName = names.slice(1).join(' '); } - existEmailOnServer(mail: string) { - return false; //TODO - } - - checkIfUserEmailIsValid(emailValue: string) { + isEmailValid(emailValue: string) { const emailRegex = /^[\w.%+-]+@[\w.-]+\.[a-zA-Z]{2,}$/; if (emailRegex.test(emailValue)) { return true; diff --git a/src/app/services/auth.service.ts b/src/app/services/auth.service.ts index 3963428..83edad5 100755 --- a/src/app/services/auth.service.ts +++ b/src/app/services/auth.service.ts @@ -60,6 +60,19 @@ export class AuthService { } } + async register(credentials: any): Promise { + try { + await lastValueFrom( + this.apiService.request('POST', `/auth/register/`, credentials) + ); + this.router.navigate(['/login']); + this.toastNotificationService.registerSuccessToast(); + } catch (error: any) { + console.error('Registration failed:', error); + throw new Error(error?.error?.error); + } + } + checkAuthUser(): Observable { return this.apiService.request('GET', `/auth/`).pipe( map(() => true), diff --git a/src/app/services/error-notification.service.ts b/src/app/services/error-notification.service.ts index 06d8a80..38be159 100755 --- a/src/app/services/error-notification.service.ts +++ b/src/app/services/error-notification.service.ts @@ -37,6 +37,10 @@ export class ErrorNotificationService { errorMessage = 'The request timed out. Please check your connection and try again later.'; break; + case 409: + errorMessage = + 'The email is already in use. Please choose a different email or log in if you already have an account.'; + break; case 500: errorMessage = 'There was a problem on the server. Please try again later or contact support if the issue persists.'; diff --git a/src/app/services/toast-notification.service.ts b/src/app/services/toast-notification.service.ts index f5e8bf2..5080a7f 100755 --- a/src/app/services/toast-notification.service.ts +++ b/src/app/services/toast-notification.service.ts @@ -22,6 +22,13 @@ export class ToastNotificationService { ); } + registerSuccessToast(): void { + this.createSuccessToast( + 'You have successfully registered. Please log in.', + 'Registration Successful' + ); + } + showSessionExpiredMessage(): void { this.createInfoToast( 'Your session has expired, please log in again.', diff --git a/src/assets/i18n/de.json b/src/assets/i18n/de.json index 1709c5a..3ab72dd 100644 --- a/src/assets/i18n/de.json +++ b/src/assets/i18n/de.json @@ -35,16 +35,16 @@ "passwordConfirm": "Passwort bestätigen", "privacyPolicy0": "Ich akzeptiere die", "privacyPolicy1": "Datenschutzerklärung", - "privacyPolicyError": "Sie müssen die Datenschutzbestimmungen akzeptieren!", - "errorPattern": "Bitte nur Buchstaben und Leerzeichen verwenden!", - "errorName": "Sie müssen einen Namen eingeben!", - "errorMail0": "Sie müssen eine E-Mail Adresse eingeben!", - "errorMail1": "Dies ist kein gültiges E-Mail-Format!", - "errorMail2": "Diese E-Mail existiert bereits!", - "errorMail3": "Diese E-Mail existiert nicht!", - "errorPassword0": "Sie müssen ein Passwort eingeben!", - "errorPassword1": "Das Passwort muss aus mindestens 6 Zeichen bestehen!", - "errorPassword2": "Die Passwörter stimmen nicht überein!" + "privacyPolicyError": "Sie müssen die Datenschutzbestimmungen akzeptieren", + "errorPattern": "Bitte nur Buchstaben und Leerzeichen verwenden", + "errorName": "Sie müssen einen Namen eingeben", + "errorMail0": "Sie müssen eine E-Mail Adresse eingeben", + "errorMail1": "Dies ist kein gültiges E-Mail-Format", + "errorMail2": "Diese E-Mail existiert bereits", + "errorMail3": "Diese E-Mail existiert nicht", + "errorPassword0": "Sie müssen ein Passwort eingeben", + "errorPassword1": "Das Passwort muss aus mindestens 8 Zeichen bestehen", + "errorPassword2": "Die Passwörter stimmen nicht überein" }, "loginHeader": { "notAUser": "Kein Join Nutzer?", diff --git a/src/assets/i18n/en.json b/src/assets/i18n/en.json index 9b8e566..0e43199 100644 --- a/src/assets/i18n/en.json +++ b/src/assets/i18n/en.json @@ -35,16 +35,16 @@ "passwordConfirm": "Confirm Password", "privacyPolicy0": "I accept the", "privacyPolicy1": "Privacy policy", - "privacyPolicyError": "You must accept the privacy policy!", - "errorPattern": "Please use only letters and spaces!", - "errorName": "You must enter a name!", - "errorMail0": "You must enter a mail!", - "errorMail1": "This is not a valid email format!", - "errorMail2": "This email already exists!", - "errorMail3": "This email does not exist!", - "errorPassword0": "You must enter a password!", - "errorPassword1": "The password must consist of at least 6 characters!", - "errorPassword2": "The passwords don't match!" + "privacyPolicyError": "You must accept the privacy policy", + "errorPattern": "Please use only letters and spaces", + "errorName": "You must enter a name", + "errorMail0": "You must enter a mail", + "errorMail1": "This is not a valid email format", + "errorMail2": "This email already exists", + "errorMail3": "This email does not exist", + "errorPassword0": "You must enter a password", + "errorPassword1": "The password must consist of at least 8 characters", + "errorPassword2": "The passwords don't match" }, "loginHeader": { "notAUser": "Not a Join user?",