{{t('invalid-email-warning')}}
+ }
}
diff --git a/UI/Web/src/app/admin/edit-user/edit-user.component.ts b/UI/Web/src/app/admin/edit-user/edit-user.component.ts
index 4de2e5205..4d787c4f0 100644
--- a/UI/Web/src/app/admin/edit-user/edit-user.component.ts
+++ b/UI/Web/src/app/admin/edit-user/edit-user.component.ts
@@ -1,4 +1,4 @@
-import {ChangeDetectionStrategy, ChangeDetectorRef, Component, inject, Input, OnInit} from '@angular/core';
+import {ChangeDetectionStrategy, ChangeDetectorRef, Component, DestroyRef, inject, Input, OnInit} from '@angular/core';
import {FormControl, FormGroup, ReactiveFormsModule, Validators} from '@angular/forms';
import {NgbActiveModal} from '@ng-bootstrap/ng-bootstrap';
import {AgeRestriction} from 'src/app/_models/metadata/age-restriction';
@@ -9,23 +9,28 @@ import {SentenceCasePipe} from '../../_pipes/sentence-case.pipe';
import {RestrictionSelectorComponent} from '../../user-settings/restriction-selector/restriction-selector.component';
import {LibrarySelectorComponent} from '../library-selector/library-selector.component';
import {RoleSelectorComponent} from '../role-selector/role-selector.component';
-import {NgIf} from '@angular/common';
+import {AsyncPipe, NgIf} from '@angular/common';
import {TranslocoDirective} from "@jsverse/transloco";
+import {debounceTime, distinctUntilChanged, Observable, startWith, switchMap, tap} from "rxjs";
+import {map} from "rxjs/operators";
+import {takeUntilDestroyed} from "@angular/core/rxjs-interop";
const AllowedUsernameCharacters = /^[\sa-zA-Z0-9\-._@+/\s]*$/;
+const EmailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
@Component({
selector: 'app-edit-user',
templateUrl: './edit-user.component.html',
styleUrls: ['./edit-user.component.scss'],
standalone: true,
- imports: [ReactiveFormsModule, NgIf, RoleSelectorComponent, LibrarySelectorComponent, RestrictionSelectorComponent, SentenceCasePipe, TranslocoDirective],
+ imports: [ReactiveFormsModule, RoleSelectorComponent, LibrarySelectorComponent, RestrictionSelectorComponent, SentenceCasePipe, TranslocoDirective, AsyncPipe],
changeDetection: ChangeDetectionStrategy.OnPush
})
export class EditUserComponent implements OnInit {
private readonly accountService = inject(AccountService);
private readonly cdRef = inject(ChangeDetectorRef);
+ private readonly destroyRef = inject(DestroyRef);
protected readonly modal = inject(NgbActiveModal);
@Input({required: true}) member!: Member;
@@ -36,6 +41,7 @@ export class EditUserComponent implements OnInit {
isSaving: boolean = false;
userForm: FormGroup = new FormGroup({});
+ isEmailInvalid$!: Observable