diff --git a/modules/ui/src/app/mocks/profile.mock.ts b/modules/ui/src/app/mocks/profile.mock.ts
index 34c14ac40..23bf500a4 100644
--- a/modules/ui/src/app/mocks/profile.mock.ts
+++ b/modules/ui/src/app/mocks/profile.mock.ts
@@ -121,6 +121,27 @@ export const NEW_PROFILE_MOCK = {
],
};
+export const NEW_PROFILE_MOCK_DRAFT = {
+ status: ProfileStatus.DRAFT,
+ name: 'New profile',
+ questions: [
+ { question: 'Email', answer: '' },
+ {
+ question: 'What type of device do you need reviewed?',
+ answer: '',
+ },
+ {
+ question: 'Are any of the following statements true about your device?',
+ answer: '',
+ },
+ {
+ question: 'What features does the device have?',
+ answer: [],
+ },
+ { question: 'Comments', answer: '' },
+ ],
+};
+
export const RENAME_PROFILE_MOCK = {
...NEW_PROFILE_MOCK,
name: 'Primary profile',
diff --git a/modules/ui/src/app/pages/risk-assessment/profile-form/profile-form.component.html b/modules/ui/src/app/pages/risk-assessment/profile-form/profile-form.component.html
index 77c078636..17b7d58d5 100644
--- a/modules/ui/src/app/pages/risk-assessment/profile-form/profile-form.component.html
+++ b/modules/ui/src/app/pages/risk-assessment/profile-form/profile-form.component.html
@@ -68,15 +68,14 @@
[disabled]="
!profileForm.valid || (profileForm.valid && profileForm.pristine)
"
- (click)="onSaveClick()">
+ (click)="onSaveClick(ProfileStatus.VALID)">
Save Profile
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 29bec9af3..89b3be2b4 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
@@ -19,12 +19,13 @@ import { ProfileFormComponent } from './profile-form.component';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import {
NEW_PROFILE_MOCK,
+ NEW_PROFILE_MOCK_DRAFT,
PROFILE_FORM,
PROFILE_MOCK,
PROFILE_MOCK_2,
RENAME_PROFILE_MOCK,
} from '../../../mocks/profile.mock';
-import { FormControlType } from '../../../model/profile';
+import { FormControlType, ProfileStatus } from '../../../model/profile';
describe('ProfileFormComponent', () => {
let component: ProfileFormComponent;
@@ -296,12 +297,30 @@ describe('ProfileFormComponent', () => {
});
describe('Draft button', () => {
- it('should be enabled when valid profile name is present', () => {
- const name: HTMLInputElement = compiled.querySelector(
- '.form-name'
- ) as HTMLInputElement;
- name.value = 'name';
- name.dispatchEvent(new Event('input'));
+ it('should be disabled when profile name is empty', () => {
+ component.nameControl.setValue('');
+ fixture.detectChanges();
+ const draftButton = compiled.querySelector(
+ '.save-draft-button'
+ ) as HTMLButtonElement;
+
+ expect(draftButton.disabled).toBeTrue();
+ });
+
+ it('should be disabled when profile name is not empty but other fields in wrong format', () => {
+ component.nameControl.setValue('New profile');
+ component.getControl('0').setValue('test');
+ fixture.detectChanges();
+ const draftButton = compiled.querySelector(
+ '.save-draft-button'
+ ) as HTMLButtonElement;
+
+ expect(draftButton.disabled).toBeTrue();
+ });
+
+ it('should be enabled when profile name is not empty; other fields are empty or in correct format', () => {
+ component.nameControl.setValue('New profile');
+ component.getControl('0').setValue('a@test.te;b@test.te, c@test.te');
fixture.detectChanges();
const draftButton = compiled.querySelector(
'.save-draft-button'
@@ -309,6 +328,20 @@ describe('ProfileFormComponent', () => {
expect(draftButton.disabled).toBeFalse();
});
+
+ it('should emit new profile in draft status', () => {
+ component.nameControl.setValue('New profile');
+ fixture.detectChanges();
+ const emitSpy = spyOn(component.saveProfile, 'emit');
+ const draftButton = compiled.querySelector(
+ '.save-draft-button'
+ ) as HTMLButtonElement;
+ draftButton.click();
+
+ expect(emitSpy).toHaveBeenCalledWith({
+ ...NEW_PROFILE_MOCK_DRAFT,
+ });
+ });
});
describe('Save button', () => {
@@ -349,7 +382,7 @@ describe('ProfileFormComponent', () => {
it('save profile should have rename field', () => {
const emitSpy = spyOn(component.saveProfile, 'emit');
fillForm(component);
- component.onSaveClick();
+ component.onSaveClick(ProfileStatus.VALID);
expect(emitSpy).toHaveBeenCalledWith(RENAME_PROFILE_MOCK);
});
@@ -364,7 +397,7 @@ describe('ProfileFormComponent', () => {
it('save profile should not have rename field', () => {
const emitSpy = spyOn(component.saveProfile, 'emit');
fillForm(component);
- component.onSaveClick();
+ component.onSaveClick(ProfileStatus.VALID);
expect(emitSpy).toHaveBeenCalledWith(NEW_PROFILE_MOCK);
});
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 e8d50c0a6..d5a2db753 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
@@ -75,6 +75,7 @@ export class ProfileFormComponent implements OnInit {
private profile: Profile | null = null;
private injector = inject(Injector);
public readonly FormControlType = FormControlType;
+ public readonly ProfileStatus = ProfileStatus;
profileForm: FormGroup = this.fb.group({});
@ViewChildren(CdkTextareaAutosize)
autosize!: QueryList;
@@ -105,6 +106,23 @@ export class ProfileFormComponent implements OnInit {
}
}
+ get isDraftDisabled(): boolean {
+ return (
+ !this.nameControl.valid ||
+ this.fieldsHasError ||
+ (this.profileForm.valid && this.profileForm.pristine)
+ );
+ }
+
+ private get fieldsHasError(): boolean {
+ return this.profileFormat.some((field, index) => {
+ return (
+ this.getControl(index).hasError('invalid_format') ||
+ this.getControl(index).hasError('maxlength')
+ );
+ });
+ }
+
get nameControl() {
return this.getControl('name');
}
@@ -191,11 +209,11 @@ export class ProfileFormComponent implements OnInit {
this.triggerResize();
}
- onSaveClick() {
+ onSaveClick(status: ProfileStatus) {
const response = this.buildResponseFromForm(
this.profileFormat,
this.profileForm,
- ProfileStatus.VALID,
+ status,
this.selectedProfile
);
this.saveProfile.emit(response);