diff --git a/src/app/app.component.html b/src/app/app.component.html
index 2802773..e0fb758 100644
--- a/src/app/app.component.html
+++ b/src/app/app.component.html
@@ -1,5 +1,6 @@
@if (this.isLoggedIn === undefined) {
+
} @else {
{
+ if (params['id'] && params['id'] === 'pw-send') {
+ this.overlayService.setOverlayData('dialog', 'pw-send');
+ }
+ if (params['id'] && params['id'] === 'pw-change') {
+ this.overlayService.setOverlayData('dialog', 'pw-change');
+ }
+ });
+ }
+
onSubmit(ngForm: NgForm) {
this.sharedService.isBtnDisabled = true;
if (ngForm.submitted && ngForm.form.valid) {
diff --git a/src/app/services/login.service.ts b/src/app/services/login.service.ts
index 3746bb7..d48c7a4 100644
--- a/src/app/services/login.service.ts
+++ b/src/app/services/login.service.ts
@@ -212,7 +212,7 @@ export class LoginService {
const auth = getAuth();
sendPasswordResetEmail(auth, email)
.then(() => {
- this.router.navigate(['/login']);
+ this.router.navigate(['/login/pw-send']);
this.sharedService.isBtnDisabled = false;
})
.catch((error) => {
diff --git a/src/app/shared/components/overlay/dialog-overlay/dialog-overlay.component.html b/src/app/shared/components/overlay/dialog-overlay/dialog-overlay.component.html
new file mode 100644
index 0000000..b67ed1c
--- /dev/null
+++ b/src/app/shared/components/overlay/dialog-overlay/dialog-overlay.component.html
@@ -0,0 +1,12 @@
+
+
+
+ @if (overlayData === "pw-send") { {{ "msgDialog.pwSend" | translate }} }
+
+
+ @if (overlayData === "pw-change") { {{ "msgDialog.pwChange" | translate }} }
+
+
diff --git a/src/app/shared/components/overlay/dialog-overlay/dialog-overlay.component.scss b/src/app/shared/components/overlay/dialog-overlay/dialog-overlay.component.scss
new file mode 100644
index 0000000..013a0c3
--- /dev/null
+++ b/src/app/shared/components/overlay/dialog-overlay/dialog-overlay.component.scss
@@ -0,0 +1,41 @@
+section {
+ width: 500px;
+ height: fit-content;
+ padding: 24px;
+ border-radius: 24px;
+ background-color: var(--white);
+ box-shadow: 4px 4px 4px 0px rgba(0, 0, 0, 0.1);
+ p {
+ text-align: center;
+ font-size: 21px;
+ font-weight: 500;
+ padding-bottom: 12px;
+ }
+}
+
+.header {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ padding-bottom: 18px;
+ .headline {
+ font-size: 24px;
+ font-weight: 700;
+ }
+}
+
+/*------------- RESPONSIVE -------------*/
+
+@media screen and (max-width: 600px) {
+ section {
+ width: calc(100vw - 96px);
+ }
+}
+
+@media screen and (max-width: 450px) {
+ section {
+ p {
+ font-size: 18px;
+ }
+ }
+}
diff --git a/src/app/shared/components/overlay/dialog-overlay/dialog-overlay.component.spec.ts b/src/app/shared/components/overlay/dialog-overlay/dialog-overlay.component.spec.ts
new file mode 100644
index 0000000..00cbc7b
--- /dev/null
+++ b/src/app/shared/components/overlay/dialog-overlay/dialog-overlay.component.spec.ts
@@ -0,0 +1,23 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { DialogOverlayComponent } from './dialog-overlay.component';
+
+describe('DialogOverlayComponent', () => {
+ let component: DialogOverlayComponent;
+ let fixture: ComponentFixture
;
+
+ beforeEach(async () => {
+ await TestBed.configureTestingModule({
+ imports: [DialogOverlayComponent]
+ })
+ .compileComponents();
+
+ fixture = TestBed.createComponent(DialogOverlayComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/app/shared/components/overlay/dialog-overlay/dialog-overlay.component.ts b/src/app/shared/components/overlay/dialog-overlay/dialog-overlay.component.ts
new file mode 100644
index 0000000..186a71c
--- /dev/null
+++ b/src/app/shared/components/overlay/dialog-overlay/dialog-overlay.component.ts
@@ -0,0 +1,25 @@
+import { Component, EventEmitter, Input, Output } from '@angular/core';
+import { SharedService } from '../../../../services/shared.service';
+import { BtnCloseComponent } from '../../buttons/btn-close/btn-close.component';
+import { Router } from '@angular/router';
+import { TranslateModule } from '@ngx-translate/core';
+
+@Component({
+ selector: 'app-dialog-overlay',
+ standalone: true,
+ imports: [BtnCloseComponent, TranslateModule],
+ templateUrl: './dialog-overlay.component.html',
+ styleUrl: './dialog-overlay.component.scss',
+})
+export class DialogOverlayComponent {
+ @Input() overlayData: string = '';
+ @Input() overlayType: string = '';
+ @Output() closeDialogEmitter = new EventEmitter();
+
+ constructor(public sharedService: SharedService, private router: Router) {}
+
+ closeOverlay() {
+ this.router.navigate(['/login']);
+ this.closeDialogEmitter.emit('');
+ }
+}
diff --git a/src/app/shared/components/overlay/overlay.component.html b/src/app/shared/components/overlay/overlay.component.html
index 65b57a7..bdd368d 100644
--- a/src/app/shared/components/overlay/overlay.component.html
+++ b/src/app/shared/components/overlay/overlay.component.html
@@ -18,6 +18,12 @@
[overlayType]="overlayType"
(closeDialogEmitter)="onCloseOverlay($event)"
>
+ }@if (overlayType === "dialog") {
+
}
diff --git a/src/app/shared/components/overlay/overlay.component.ts b/src/app/shared/components/overlay/overlay.component.ts
index b3d085b..c72ac8d 100644
--- a/src/app/shared/components/overlay/overlay.component.ts
+++ b/src/app/shared/components/overlay/overlay.component.ts
@@ -13,8 +13,10 @@ import { CommonModule } from '@angular/common';
import { TaskOverlayComponent } from './task-overlay/task-overlay.component';
import { FirebaseService } from '../../../services/firebase.service';
import { TaskEditOverlayComponent } from './task-edit-overlay/task-edit-overlay.component';
-import { ActivatedRoute } from '@angular/router';
+import { ActivatedRoute, Router } from '@angular/router';
import { AddTaskComponent } from '../../../components/add-task/add-task.component';
+import { DialogOverlayComponent } from './dialog-overlay/dialog-overlay.component';
+import { SharedService } from '../../../services/shared.service';
@Component({
selector: 'app-overlay',
@@ -23,6 +25,7 @@ import { AddTaskComponent } from '../../../components/add-task/add-task.componen
CommonModule,
TaskOverlayComponent,
TaskEditOverlayComponent,
+ DialogOverlayComponent,
AddTaskComponent,
],
templateUrl: './overlay.component.html',
@@ -34,7 +37,9 @@ export class OverlayComponent implements OnInit {
constructor(
private overlayService: OverlayService,
- private route: ActivatedRoute
+ private sharedService: SharedService,
+ private route: ActivatedRoute,
+ private router: Router
) {}
ngOnInit(): void {
@@ -51,6 +56,7 @@ export class OverlayComponent implements OnInit {
}
onCloseOverlay(emitter: string) {
+ this.overlayType === 'dialog' && this.router.navigate(['/login']);
this.overlayData = emitter;
}
diff --git a/src/assets/i18n/de.json b/src/assets/i18n/de.json
index e919201..def2665 100644
--- a/src/assets/i18n/de.json
+++ b/src/assets/i18n/de.json
@@ -20,6 +20,11 @@
"pwChange": "Passwort ändern",
"notice": "Wir senden Ihnen eine E-Mail, über die Sie Ihr Passwort ändern können"
},
+ "msgDialog": {
+ "noticeHeadline": "Hinweis",
+ "pwSend": "Eine E-Mail mit Anweisungen zum Zurücksetzen Ihres Passworts wurde an Sie gesendet.",
+ "pwChange": "Ihr Passwort wurde erfolgreich geändert. Sie können sich jetzt einloggen."
+ },
"register": {
"signup": "Registrieren",
"name": "Name",
diff --git a/src/assets/i18n/en.json b/src/assets/i18n/en.json
index 1f43d4c..ddddbb4 100644
--- a/src/assets/i18n/en.json
+++ b/src/assets/i18n/en.json
@@ -20,6 +20,11 @@
"pwChange": "Change Password",
"notice": "We will send you an email to change your password."
},
+ "msgDialog": {
+ "noticeHeadline": "Notice",
+ "pwSend": "An email with instructions on how to reset your password has been sent to you.",
+ "pwChange": "Your password has been successfully changed. You can now log in."
+ },
"register": {
"signup": "Sign up",
"name": "Name",