Feature/discard profile

modules/ui/src/app/pages/risk-assessment/profile-form/profile-form.component.html

@@ -76,6 +76,13 @@
     (click)="onSaveClick(ProfileStatus.DRAFT)">
     Save Draft
   </button>
+  <button
+    mat-button
+    class="discard-button"
+    [disabled]="profileForm.pristine"
+    (click)="onDiscardClick()">
+    Discard
+  </button>
 </div>
 
 <ng-template

modules/ui/src/app/pages/risk-assessment/profile-form/profile-form.component.scss

@@ -61,7 +61,8 @@
   padding: 8px 24px 24px 24px;
 }
 
-.save-draft-button:not(.mat-mdc-button-disabled) {
+.save-draft-button:not(.mat-mdc-button-disabled),
+.discard-button:not(.mat-mdc-button-disabled) {
   color: $primary;
 }
 

modules/ui/src/app/pages/risk-assessment/profile-form/profile-form.component.spec.ts

@@ -388,6 +388,31 @@ describe('ProfileFormComponent', () => {
         });
       });
     });
+
+    describe('Discard button', () => {
+      beforeEach(() => {
+        fillForm(component);
+        fixture.detectChanges();
+      });
+
+      it('should be enabled when form is filled', () => {
+        const discardButton = compiled.querySelector(
+          '.discard-button'
+        ) as HTMLButtonElement;
+
+        expect(discardButton.disabled).toBeFalse();
+      });
+
+      it('should emit discard', () => {
+        const emitSpy = spyOn(component.discard, 'emit');
+        const discardButton = compiled.querySelector(
+          '.discard-button'
+        ) as HTMLButtonElement;
+        discardButton.click();
+
+        expect(emitSpy).toHaveBeenCalled();
+      });
+    });
   });
 
   describe('Class tests', () => {

modules/ui/src/app/pages/risk-assessment/profile-form/profile-form.component.ts

@@ -105,6 +105,7 @@ export class ProfileFormComponent implements OnInit {
   }
 
   @Output() saveProfile = new EventEmitter<Profile>();
+  @Output() discard = new EventEmitter();
   constructor(
     private deviceValidators: DeviceValidators,
     private profileValidators: ProfileValidators,
@@ -241,6 +242,10 @@ export class ProfileFormComponent implements OnInit {
     }
   }
 
+  onDiscardClick() {
+    this.discard.emit();
+  }
+
   private buildResponseFromForm(
     initialQuestions: ProfileFormat[],
     profileForm: FormGroup,

modules/ui/src/app/pages/risk-assessment/risk-assessment.component.html

@@ -25,9 +25,8 @@ <h2 class="title" tabindex="-1">Risk assessment</h2>
             [selectedProfile]="vm.selectedProfile"
             [profiles]="vm.profiles"
             [profileFormat]="vm.profileFormat"
-            (saveProfile)="
-              saveProfileClicked($event, vm.selectedProfile)
-            "></app-profile-form>
+            (saveProfile)="saveProfileClicked($event, vm.selectedProfile)"
+            (discard)="discard()"></app-profile-form>
         </div>
       </mat-drawer-content>
     </mat-drawer-container>

modules/ui/src/app/pages/risk-assessment/risk-assessment.component.spec.ts

@@ -284,6 +284,28 @@ describe('RiskAssessmentComponent', () => {
         }));
       });
     });
+
+    describe('#discard', () => {
+      beforeEach(() => {
+        component.discard();
+      });
+
+      it('should call setFocusOnCreateButton', () => {
+        expect(
+          mockRiskAssessmentStore.setFocusOnCreateButton
+        ).toHaveBeenCalled();
+      });
+
+      it('should close the form', () => {
+        expect(component.isOpenProfileForm).toBeFalse();
+      });
+
+      it('should update selected profile', () => {
+        expect(
+          mockRiskAssessmentStore.updateSelectedProfile
+        ).toHaveBeenCalledWith(null);
+      });
+    });
   });
 });
 

modules/ui/src/app/pages/risk-assessment/risk-assessment.component.ts

@@ -105,6 +105,12 @@ export class RiskAssessmentComponent implements OnInit, OnDestroy {
     }
   }
 
+  discard() {
+    this.isOpenProfileForm = false;
+    this.store.updateSelectedProfile(null);
+    this.store.setFocusOnCreateButton();
+  }
+
   trackByIndex = (index: number): number => {
     return index;
   };