- @if (verifyStatus() === true) {
- @if (showRedirectMessage()) {
-
Es geht gleich los!
-
- Danke für das bestätigen der E-Mail - Wir leiten dich zum Login
- weiter!
-
+
+
+
+
+ @if (verifyStatus() === true) {
+ @if (showRedirectMessage()) {
+
+
Your email is verified!
+
+ Your email {{ email() }} has been successfully verified. will
+
+ You be automatically redirected in to the login page to access
+ the application shortly.
+
+
+ Go to the App
+
+
+ }
+ } @else if (verifyStatus() === false) {
+
+
+ Oops, something went wrong! :(
+
+
We couldn't verify your email.
+
+ } @else {
+
+
+
}
- } @else if (verifyStatus() === false) {
-
Oops, da ist etwas schief gelaufen!
-
Der Link ist nicht mehr gültig
- } @else {
-
Verifizierung wird durchgeführt...
- }
+
diff --git a/frontend/src/app/pages/email-verify-root/email-verify-root.component.scss b/frontend/src/app/pages/email-verify-root/email-verify-root.component.scss
index eae00e9..e69de29 100644
--- a/frontend/src/app/pages/email-verify-root/email-verify-root.component.scss
+++ b/frontend/src/app/pages/email-verify-root/email-verify-root.component.scss
@@ -1,28 +0,0 @@
-#background {
- display: flex;
- height: 100%;
-}
-
-.wrapper {
- flex: 1;
- background-color: lightsalmon;
- display: flex;
-
- .content{
- flex-direction: column;
- display: flex;
- align-items: flex-start;
- justify-content: center;
- h1 {
- font-size: 4rem;
- margin-left: 3rem;
- line-height: 1rem;
- }
- h2 {
- margin-left: 3rem;
- }
- p {
- margin-left: 3rem;
- }
- }
-}
diff --git a/frontend/src/app/pages/email-verify-root/email-verify-root.component.ts b/frontend/src/app/pages/email-verify-root/email-verify-root.component.ts
index 135d8bc..c5336f2 100644
--- a/frontend/src/app/pages/email-verify-root/email-verify-root.component.ts
+++ b/frontend/src/app/pages/email-verify-root/email-verify-root.component.ts
@@ -1,6 +1,8 @@
+import { CommonModule } from '@angular/common';
import {
ChangeDetectionStrategy,
Component,
+ ElementRef,
InputSignal,
OnInit,
WritableSignal,
@@ -12,11 +14,12 @@ import { Router } from '@angular/router';
import { delay, filter, tap } from 'rxjs';
import { VerifyApiService } from '../../api';
+import { BackgroundPatternService } from '../../shared/service';
@Component({
selector: 'app-email-verify-root',
standalone: true,
- imports: [],
+ imports: [CommonModule],
providers: [],
templateUrl: './email-verify-root.component.html',
styleUrl: './email-verify-root.component.scss',
@@ -24,6 +27,8 @@ import { VerifyApiService } from '../../api';
})
export class EmailVerifyRootComponent implements OnInit {
public token: InputSignal
= input('');
+ public email: WritableSignal = signal('');
+ public backgroundStyle: { 'background-image': string } | null = null;
public verifyStatus: WritableSignal = signal(
null
);
@@ -31,19 +36,56 @@ export class EmailVerifyRootComponent implements OnInit {
public constructor(
private readonly api: VerifyApiService,
- private readonly router: Router
+ private readonly router: Router,
+ private readonly el: ElementRef,
+ private readonly backgroundPatternService: BackgroundPatternService
) {}
public ngOnInit(): void {
this.verifyEmail();
+ this.setBackground();
+ }
+
+ public setBackground(): void {
+ const color = getComputedStyle(this.el.nativeElement).getPropertyValue(
+ '--p'
+ );
+
+ const svgUrl = this.backgroundPatternService.getBubblesPattern(color, 0.1);
+
+ this.backgroundStyle = { 'background-image': `url("${svgUrl}")` };
+ }
+
+ public navigateToSignup(): void {
+ const email: string = this.extractEmail();
+
+ this.router.navigate(['/signup'], {
+ queryParams: { verified: true, email: email },
+ });
+ }
+
+ private extractVerifyToken(): string {
+ const [verifyToken]: string[] = this.token().split('|');
+
+ return verifyToken;
+ }
+
+ private extractEmail(): string {
+ const [, email]: string[] = this.token().split('|');
+
+ return email;
}
private verifyEmail(): void {
- const [verifyToken, email]: string[] = this.token().split('|');
+ const verifyToken: string = this.extractVerifyToken();
+ const email: string = this.extractEmail();
+
+ this.email.set(decodeURIComponent(atob(email)));
this.api
.verifyControllerVerifyEmail(verifyToken)
.pipe(
+ delay(1500),
tap((isVerified: boolean) => {
this.verifyStatus.set(isVerified);
}),
@@ -51,12 +93,10 @@ export class EmailVerifyRootComponent implements OnInit {
tap(() => {
this.showRedirectMessage.set(true);
}),
- delay(5000)
+ delay(10000)
)
.subscribe(() => {
- this.router.navigate(['/signup'], {
- queryParams: { verified: true, email: email },
- });
+ this.navigateToSignup();
});
}
}
diff --git a/frontend/src/app/pages/register-root/register-root.component.html b/frontend/src/app/pages/register-root/register-root.component.html
index e2695f8..e7add21 100644
--- a/frontend/src/app/pages/register-root/register-root.component.html
+++ b/frontend/src/app/pages/register-root/register-root.component.html
@@ -281,6 +281,7 @@