From b081bfe4a1683cf5cb81a07a215c588aa13400e6 Mon Sep 17 00:00:00 2001
From: e560704 <janik.endtner@sbb.ch>
Date: Fri, 12 Apr 2024 13:48:39 +0200
Subject: [PATCH] #790 improve email validation

unique-mail validator
- filter empty strings
- update added mails every time form changes

added general email validation
---
 .../invite-user-dialog/invite-user-dialog.component.ts | 10 ++++++++--
 .../team-management/new-user/new-user.component.html   |  2 +-
 2 files changed, 9 insertions(+), 3 deletions(-)

diff --git a/frontend/src/app/team-management/invite-user-dialog/invite-user-dialog.component.ts b/frontend/src/app/team-management/invite-user-dialog/invite-user-dialog.component.ts
index 0d50297c80..36b8d1ac15 100644
--- a/frontend/src/app/team-management/invite-user-dialog/invite-user-dialog.component.ts
+++ b/frontend/src/app/team-management/invite-user-dialog/invite-user-dialog.component.ts
@@ -5,6 +5,7 @@ import { UserService } from '../../services/user.service';
 import { DialogRef } from '@angular/cdk/dialog';
 import { NewUserForm } from '../../shared/types/model/NewUserForm';
 import { UniqueEmailValidator } from '../new-user/unique-mail.validator';
+import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
 
 @Component({
   selector: 'app-invite-user-dialog',
@@ -22,6 +23,9 @@ export class InviteUserDialogComponent {
     private readonly uniqueMailValidator: UniqueEmailValidator,
   ) {
     this.form = this.formBuilder.array([this.createUserFormGroup()]);
+    this.form.valueChanges
+      .pipe(takeUntilDestroyed())
+      .subscribe(() => this.uniqueMailValidator.setAddedMails(this.extractAddedMails()));
   }
 
   registerUsers() {
@@ -45,13 +49,13 @@ export class InviteUserDialogComponent {
   }
 
   private createUserFormGroup() {
-    this.uniqueMailValidator.setAddedMails(this.extractAddedMails());
     return this.formBuilder.group({
       firstname: this.formBuilder.control('', [Validators.required, Validators.minLength(1)]),
       lastname: this.formBuilder.control('', [Validators.required, Validators.minLength(1)]),
       email: this.formBuilder.control('', [
         Validators.required,
         Validators.minLength(1),
+        Validators.email,
         this.uniqueMailValidator.validate.bind(this.uniqueMailValidator),
       ]),
     });
@@ -61,6 +65,8 @@ export class InviteUserDialogComponent {
     if (!this.form) {
       return [];
     }
-    return this.extractFormValue().map((u) => u.email);
+    return this.extractFormValue()
+      .map((u) => u.email)
+      .filter((mail) => !!mail);
   }
 }
diff --git a/frontend/src/app/team-management/new-user/new-user.component.html b/frontend/src/app/team-management/new-user/new-user.component.html
index dab4fd004d..cd53093d0f 100644
--- a/frontend/src/app/team-management/new-user/new-user.component.html
+++ b/frontend/src/app/team-management/new-user/new-user.component.html
@@ -55,7 +55,7 @@
           <span>Angabe benötigt</span>
         } @else if (email.errors?.["notUniqueMail"]) {
           <span>E-Mail existiert bereits</span>
-        } @else if (email.errors?.["email"]) {
+        } @else if (email.errors?.["email"] && triedToSubmit) {
           <span>E-Mail ungültig</span>
         }
       </mat-error>