diff --git a/frontend/src/app/components/auth/verify-email/verify-email.component.html b/frontend/src/app/components/auth/verify-email/verify-email.component.html
index e17938b..3690b4c 100644
--- a/frontend/src/app/components/auth/verify-email/verify-email.component.html
+++ b/frontend/src/app/components/auth/verify-email/verify-email.component.html
@@ -2,13 +2,13 @@
Verify Email
- @if (verified) {
+ @if (verificationSuccess) {
Your email has been successfully verified! You can now log in.
To the login
} @else {
- There was an issue verifying your email.
Please try again or
- contact support for assistance.
+ There was an issue verifying your data.
Please try again or contact
+ support for assistance.
}
diff --git a/frontend/src/app/components/auth/verify-email/verify-email.component.ts b/frontend/src/app/components/auth/verify-email/verify-email.component.ts
index d006562..228140d 100644
--- a/frontend/src/app/components/auth/verify-email/verify-email.component.ts
+++ b/frontend/src/app/components/auth/verify-email/verify-email.component.ts
@@ -1,8 +1,9 @@
-import { Component } from '@angular/core';
+import { Component, OnInit } from '@angular/core';
import { ActivatedRoute, Params, RouterLink } from '@angular/router';
import { AuthService } from '../../../services/auth.service';
import { ErrorService } from '../../../services/error.service';
import { CommonModule } from '@angular/common';
+import { firstValueFrom } from 'rxjs';
@Component({
selector: 'app-verify-email',
@@ -11,13 +12,12 @@ import { CommonModule } from '@angular/common';
templateUrl: './verify-email.component.html',
styleUrl: './verify-email.component.scss',
})
-export class VerifyEmailComponent {
- verified: boolean = false;
+export class VerifyEmailComponent implements OnInit {
+ verificationSuccess: boolean = false;
- authData = {
+ verificationParams: { email: string; token: string } = {
email: '',
token: '',
- send: false,
};
/**
@@ -26,56 +26,64 @@ export class VerifyEmailComponent {
constructor(
private route: ActivatedRoute,
private authService: AuthService,
- public errorService: ErrorService
+ private errorService: ErrorService
) {}
/**
- * Lifecycle hook that is called after data-bound properties are initialized.
- * Subscribes to query parameters and triggers email verification.
+ * Initializes the component and triggers the email verification process.
*/
- ngOnInit(): void {
- this.handleQueryParams();
+ async ngOnInit(): Promise
{
+ await this.initVerification();
}
/**
- * Subscribes to the query parameters from the route and extracts authentication data.
- * Then triggers the email verification process.
+ * Coordinates the overall email verification process by handling query parameters
+ * and calling the verification API if valid data is present.
*/
- private handleQueryParams(): void {
- this.route.queryParams.subscribe((params) => {
- this.extractAuthParams(params);
- this.verifyEmail();
- });
+ private async initVerification(): Promise {
+ await this.handleQueryParams();
+ if (this.verificationParams.email && this.verificationParams.token) {
+ await this.verifyEmail();
+ }
}
/**
- * Extracts the 'email' and 'token' parameters from the query and assigns them to authData.
+ * Retrieves and processes query parameters from the current route.
+ * Extracts the necessary authentication data for email verification.
+ */
+ private async handleQueryParams(): Promise {
+ const params = await firstValueFrom(this.route.queryParams);
+ this.extractAuthParams(params);
+ }
+
+ /**
+ * Extracts the 'email' and 'token' values from the given query parameters
+ * and stores them in the verifyData object.
*
- * @param params The query parameters from the route.
+ * @param params The query parameters from the current route.
*/
private extractAuthParams(params: Params): void {
- this.authData.email = params['email'] || '';
- this.authData.token = params['token'] || '';
+ this.verificationParams = {
+ email: params['email'] || '',
+ token: params['token'] || '',
+ };
}
/**
- * Sends a request to verify the user's email using the extracted authentication data.
- * Sets the appropriate flags based on the result and handles errors if any occur.
+ * Calls the AuthService to verify the user's email using the provided credentials.
+ * Updates the verification status and delegates error handling if the request fails.
*/
private async verifyEmail(): Promise {
- const body = {
- email: this.authData.email.toLowerCase(),
- token: this.authData.token,
+ const body: { email: string; token: string } = {
+ email: this.verificationParams.email.toLowerCase(),
+ token: this.verificationParams.token,
};
- this.authData.send = true;
try {
await this.authService.verifyEmail(body);
- this.verified = true;
- this.errorService.clearError();
+ this.verificationSuccess = true;
} catch (error) {
- this.authData.send = false;
- this.verified = false;
+ this.verificationSuccess = false;
this.errorService.handleError(error);
}
}