From bc18b19b22664b251364c11407a093f50ad4a9b9 Mon Sep 17 00:00:00 2001
From: Volha Mardvilka <mardvilka@google.com>
Date: Mon, 27 Jan 2025 10:45:20 +0000
Subject: [PATCH] 392033964: (fix) [GM3] change cancel to discard on devices

---
 .../simple-dialog.component.html              |  2 +-
 .../simple-dialog/simple-dialog.component.ts  |  1 +
 .../device-qualification-from.component.html  |  6 ++--
 .../device-qualification-from.component.scss  |  5 +++
 ...evice-qualification-from.component.spec.ts |  7 ++--
 .../device-qualification-from.component.ts    | 34 +++++++------------
 .../app/pages/devices/devices.component.ts    |  7 ++--
 7 files changed, 30 insertions(+), 32 deletions(-)

diff --git a/modules/ui/src/app/components/simple-dialog/simple-dialog.component.html b/modules/ui/src/app/components/simple-dialog/simple-dialog.component.html
index 296c030f3..93e1cb845 100644
--- a/modules/ui/src/app/components/simple-dialog/simple-dialog.component.html
+++ b/modules/ui/src/app/components/simple-dialog/simple-dialog.component.html
@@ -35,6 +35,6 @@
     color="primary"
     mat-button
     type="button">
-    Confirm
+    {{ data.confirmName ? data.confirmName : 'Confirm' }}
   </button>
 </mat-dialog-actions>
diff --git a/modules/ui/src/app/components/simple-dialog/simple-dialog.component.ts b/modules/ui/src/app/components/simple-dialog/simple-dialog.component.ts
index 68da3e3d8..55adba66a 100644
--- a/modules/ui/src/app/components/simple-dialog/simple-dialog.component.ts
+++ b/modules/ui/src/app/components/simple-dialog/simple-dialog.component.ts
@@ -28,6 +28,7 @@ import { FocusManagerService } from '../../services/focus-manager.service';
 interface DialogData {
   title?: string;
   content?: string;
+  confirmName?: string;
 }
 
 @Component({
diff --git a/modules/ui/src/app/pages/devices/components/device-qualification-from/device-qualification-from.component.html b/modules/ui/src/app/pages/devices/components/device-qualification-from/device-qualification-from.component.html
index a3f236b60..d5caae35e 100644
--- a/modules/ui/src/app/pages/devices/components/device-qualification-from/device-qualification-from.component.html
+++ b/modules/ui/src/app/pages/devices/components/device-qualification-from/device-qualification-from.component.html
@@ -163,16 +163,16 @@
         Save
       </button>
       <button
-        mat-raised-button
+        mat-flat-button
         [disabled]="deviceHasNoChanges(initialDevice(), createDeviceFromForm())"
         type="button"
         class="close-button"
         (click)="onCancelClicked()">
-        Cancel
+        Discard
       </button>
     </div>
     <button
-      mat-raised-button
+      mat-flat-button
       [disabled]="initialDevice() === null"
       type="button"
       class="delete-button"
diff --git a/modules/ui/src/app/pages/devices/components/device-qualification-from/device-qualification-from.component.scss b/modules/ui/src/app/pages/devices/components/device-qualification-from/device-qualification-from.component.scss
index 38d45aaec..18400ff13 100644
--- a/modules/ui/src/app/pages/devices/components/device-qualification-from/device-qualification-from.component.scss
+++ b/modules/ui/src/app/pages/devices/components/device-qualification-from/device-qualification-from.component.scss
@@ -219,6 +219,11 @@ $form-min-width: 285px;
     background-color: colors.$error;
     color: colors.$on-error;
   }
+
+  .close-button:not(.mat-mdc-button-disabled) {
+    background-color: colors.$secondary-container;
+    color: colors.$on-secondary-container;
+  }
 }
 
 .device-qualification-form-summary-info {
diff --git a/modules/ui/src/app/pages/devices/components/device-qualification-from/device-qualification-from.component.spec.ts b/modules/ui/src/app/pages/devices/components/device-qualification-from/device-qualification-from.component.spec.ts
index 44d9b60aa..c366aec23 100644
--- a/modules/ui/src/app/pages/devices/components/device-qualification-from/device-qualification-from.component.spec.ts
+++ b/modules/ui/src/app/pages/devices/components/device-qualification-from/device-qualification-from.component.spec.ts
@@ -431,10 +431,11 @@ describe('DeviceQualificationFromComponent', () => {
       fixture.detectChanges();
 
       expect(openSpy).toHaveBeenCalledWith(SimpleDialogComponent, {
-        ariaLabel: 'Close the Device menu',
+        ariaLabel: 'Discard the Device changes',
         data: {
-          title: 'Are you sure?',
-          content: `By closing the device profile you will loose any new changes you have made to the device.`,
+          title: 'Discard changes?',
+          content: `You have unsaved changes that would be permanently lost.`,
+          confirmName: 'Discard',
         },
         autoFocus: true,
         hasBackdrop: true,
diff --git a/modules/ui/src/app/pages/devices/components/device-qualification-from/device-qualification-from.component.ts b/modules/ui/src/app/pages/devices/components/device-qualification-from/device-qualification-from.component.ts
index 147b909b2..a75a20e08 100644
--- a/modules/ui/src/app/pages/devices/components/device-qualification-from/device-qualification-from.component.ts
+++ b/modules/ui/src/app/pages/devices/components/device-qualification-from/device-qualification-from.component.ts
@@ -15,7 +15,6 @@
  */
 import {
   Component,
-  OnDestroy,
   OnInit,
   inject,
   input,
@@ -58,7 +57,7 @@ import { MatRadioButton, MatRadioGroup } from '@angular/material/radio';
 import { ProfileValidators } from '../../../risk-assessment/profile-form/profile.validators';
 import { DevicesStore } from '../../devices.store';
 import { DynamicFormComponent } from '../../../../components/dynamic-form/dynamic-form.component';
-import { skip, Subject, takeUntil, timer } from 'rxjs';
+import { skip, timer } from 'rxjs';
 import { Question } from '../../../../model/profile';
 import { FormControlType, QuestionFormat } from '../../../../model/question';
 import { BehaviorSubject } from 'rxjs/internal/BehaviorSubject';
@@ -92,9 +91,7 @@ const MAC_ADDRESS_PATTERN =
   templateUrl: './device-qualification-from.component.html',
   styleUrl: './device-qualification-from.component.scss',
 })
-export class DeviceQualificationFromComponent
-  implements OnInit, OnDestroy, AfterViewInit
-{
+export class DeviceQualificationFromComponent implements OnInit, AfterViewInit {
   readonly TestingType = TestingType;
   readonly DeviceView = DeviceView;
 
@@ -102,7 +99,6 @@ export class DeviceQualificationFromComponent
   private cdr = inject(ChangeDetectorRef);
   private deviceValidators = inject(DeviceValidators);
   private profileValidators = inject(ProfileValidators);
-  private destroy$: Subject<boolean> = new Subject<boolean>();
   private changeDevice = false;
   private macAddressValidator!: ValidatorFn;
 
@@ -192,24 +188,17 @@ export class DeviceQualificationFromComponent
         }
       });
 
-      timer(0)
-        .pipe(takeUntil(this.destroy$))
-        .subscribe(() => {
-          if (this.initialDevice()) {
-            this.fillDeviceForm(this.format, this.initialDevice()!);
-          }
-          this.formIsLoaded$.next(true);
-        });
+      timer(0).subscribe(() => {
+        if (this.initialDevice()) {
+          this.fillDeviceForm(this.format, this.initialDevice()!);
+        }
+        this.formIsLoaded$.next(true);
+      });
     });
 
     this.devicesStore.getQuestionnaireFormat();
   }
 
-  ngOnDestroy() {
-    this.destroy$.next(true);
-    this.destroy$.unsubscribe();
-  }
-
   ngAfterViewInit() {
     this.cdr.detectChanges();
   }
@@ -458,10 +447,11 @@ export class DeviceQualificationFromComponent
 
   private openCloseDialog(device: Device | null) {
     const dialogRef = this.dialog.open(SimpleDialogComponent, {
-      ariaLabel: 'Close the Device menu',
+      ariaLabel: 'Discard the Device changes',
       data: {
-        title: 'Are you sure?',
-        content: `By closing the device profile you will loose any new changes you have made to the device.`,
+        title: 'Discard changes?',
+        content: `You have unsaved changes that would be permanently lost.`,
+        confirmName: 'Discard',
       },
       autoFocus: true,
       hasBackdrop: true,
diff --git a/modules/ui/src/app/pages/devices/devices.component.ts b/modules/ui/src/app/pages/devices/devices.component.ts
index 58388c635..db780738d 100644
--- a/modules/ui/src/app/pages/devices/devices.component.ts
+++ b/modules/ui/src/app/pages/devices/devices.component.ts
@@ -247,10 +247,11 @@ export class DevicesComponent implements OnInit, OnDestroy {
 
   private openCloseDialog() {
     const dialogRef = this.dialog.open(SimpleDialogComponent, {
-      ariaLabel: 'Close the Device menu',
+      ariaLabel: 'Discard the Device changes',
       data: {
-        title: 'Are you sure?',
-        content: `By closing the device profile you will loose any new changes you have made to the device.`,
+        title: 'Discard changes?',
+        content: `You have unsaved changes that would be permanently lost.`,
+        confirmName: 'Discard',
       },
       autoFocus: true,
       hasBackdrop: true,