diff --git a/modules/ui/src/app/mocks/profile.mock.ts b/modules/ui/src/app/mocks/profile.mock.ts index 34f29098a..22d4d4c0d 100644 --- a/modules/ui/src/app/mocks/profile.mock.ts +++ b/modules/ui/src/app/mocks/profile.mock.ts @@ -54,6 +54,11 @@ export const PROFILE_MOCK_2: Profile = { questions: [], }; +export const PROFILE_MOCK_3: Profile = { + name: 'Third profile name', + questions: [], +}; + export const PROFILE_FORM: ProfileFormat[] = [ { question: 'Email', diff --git a/modules/ui/src/app/pages/risk-assessment/profile-form/profile-form.component.spec.ts b/modules/ui/src/app/pages/risk-assessment/profile-form/profile-form.component.spec.ts index 89b3be2b4..98a0bb585 100644 --- a/modules/ui/src/app/pages/risk-assessment/profile-form/profile-form.component.spec.ts +++ b/modules/ui/src/app/pages/risk-assessment/profile-form/profile-form.component.spec.ts @@ -23,6 +23,7 @@ import { PROFILE_FORM, PROFILE_MOCK, PROFILE_MOCK_2, + PROFILE_MOCK_3, RENAME_PROFILE_MOCK, } from '../../../mocks/profile.mock'; import { FormControlType, ProfileStatus } from '../../../model/profile'; @@ -40,7 +41,7 @@ describe('ProfileFormComponent', () => { fixture = TestBed.createComponent(ProfileFormComponent); component = fixture.componentInstance; component.profileFormat = PROFILE_FORM; - component.profiles = [PROFILE_MOCK, PROFILE_MOCK_2]; + component.profiles = [PROFILE_MOCK, PROFILE_MOCK_2, PROFILE_MOCK_3]; compiled = fixture.nativeElement as HTMLElement; fixture.detectChanges(); @@ -386,6 +387,34 @@ describe('ProfileFormComponent', () => { expect(emitSpy).toHaveBeenCalledWith(RENAME_PROFILE_MOCK); }); + + it('should not have an error when uses the name of removed profile', () => { + component.profiles = [PROFILE_MOCK, PROFILE_MOCK_2, PROFILE_MOCK_3]; + component.nameControl.setValue('Third profile name'); + + expect( + component.nameControl.hasError('has_same_profile_name') + ).toBeTrue(); + + component.profiles = [PROFILE_MOCK, PROFILE_MOCK_2]; + expect( + component.nameControl.hasError('has_same_profile_name') + ).toBeFalse(); + }); + + it('should have an error when uses the name of added profile', () => { + component.profiles = [PROFILE_MOCK, PROFILE_MOCK_2]; + component.nameControl.setValue('Third profile name'); + + expect( + component.nameControl.hasError('has_same_profile_name') + ).toBeFalse(); + + component.profiles = [PROFILE_MOCK, PROFILE_MOCK_2, PROFILE_MOCK_3]; + expect( + component.nameControl.hasError('has_same_profile_name') + ).toBeTrue(); + }); }); describe('with no profile', () => { diff --git a/modules/ui/src/app/pages/risk-assessment/profile-form/profile-form.component.ts b/modules/ui/src/app/pages/risk-assessment/profile-form/profile-form.component.ts index d5a2db753..7e4c99a69 100644 --- a/modules/ui/src/app/pages/risk-assessment/profile-form/profile-form.component.ts +++ b/modules/ui/src/app/pages/risk-assessment/profile-form/profile-form.component.ts @@ -73,19 +73,30 @@ import { ProfileValidators } from './profile.validators'; }) export class ProfileFormComponent implements OnInit { private profile: Profile | null = null; + private profileList!: Profile[]; private injector = inject(Injector); + private nameValidator!: ValidatorFn; public readonly FormControlType = FormControlType; public readonly ProfileStatus = ProfileStatus; profileForm: FormGroup = this.fb.group({}); @ViewChildren(CdkTextareaAutosize) autosize!: QueryList; @Input() profileFormat!: ProfileFormat[]; - @Input() profiles!: Profile[]; + @Input() + set profiles(profiles: Profile[]) { + this.profileList = profiles; + if (this.nameControl) { + this.updateNameValidator(); + } + } + get profiles() { + return this.profileList; + } @Input() set selectedProfile(profile: Profile | null) { this.profile = profile; if (profile && this.nameControl) { - this.profileForm = this.createProfileForm(this.profileFormat); + this.updateNameValidator(); this.fillProfileForm(this.profileFormat, profile); } } @@ -135,10 +146,15 @@ export class ProfileFormComponent implements OnInit { // eslint-disable-next-line @typescript-eslint/no-explicit-any const group: any = {}; + this.nameValidator = this.profileValidators.differentProfileName( + this.profiles, + this.profile + ); + group['name'] = new FormControl('', [ this.profileValidators.textRequired(), this.deviceValidators.deviceStringFormat(), - this.profileValidators.differentProfileName(this.profiles, this.profile), + this.nameValidator, ]); questions.forEach((question, index) => { @@ -271,4 +287,14 @@ export class ProfileFormComponent implements OnInit { } ); } + + private updateNameValidator() { + this.nameControl.removeValidators([this.nameValidator]); + this.nameValidator = this.profileValidators.differentProfileName( + this.profileList, + this.profile + ); + this.nameControl.addValidators(this.nameValidator); + this.nameControl.updateValueAndValidity(); + } }