[GM3] Testing page: text and design for the Stop testrun popup should be changed

modules/ui/src/app/components/simple-dialog/simple-dialog.component.html

@@ -13,6 +13,11 @@
 See the License for the specific language governing permissions and
 limitations under the License.
 -->
+<span *ngIf="data.icon" class="simple-dialog-icon"
+  ><mat-icon fontSet="material-symbols-outlined">{{
+    data.icon
+  }}</mat-icon></span
+>
 <span class="simple-dialog-title">{{ data.title }}</span>
 <p class="simple-dialog-content">
   {{ data.content }}

modules/ui/src/app/components/simple-dialog/simple-dialog.component.scss

@@ -27,6 +27,10 @@
   gap: 10px;
 }
 
+.simple-dialog-icon {
+  text-align: center;
+}
+
 .simple-dialog-title {
   @include mixins.headline-small();
   padding: 0;

modules/ui/src/app/components/simple-dialog/simple-dialog.component.spec.ts

@@ -48,6 +48,7 @@ describe('DeleteFormComponent', () => {
     fixture = TestBed.createComponent(SimpleDialogComponent);
     component = fixture.componentInstance;
     component.data = {
+      icon: 'favorite',
       title: 'title?',
       content: 'content',
     };
@@ -59,6 +60,12 @@ describe('DeleteFormComponent', () => {
     expect(component).toBeTruthy();
   });
 
+  it('should has icon', () => {
+    const title = compiled.querySelector('mat-icon') as HTMLElement;
+
+    expect(title.innerHTML).toEqual('favorite');
+  });
+
   it('should has title', () => {
     const title = compiled.querySelector('.simple-dialog-title') as HTMLElement;
 

modules/ui/src/app/components/simple-dialog/simple-dialog.component.ts

@@ -24,8 +24,11 @@ import { EscapableDialogComponent } from '../escapable-dialog/escapable-dialog.c
 import { ComponentWithAnnouncement } from '../component-with-announcement';
 import { LiveAnnouncer } from '@angular/cdk/a11y';
 import { FocusManagerService } from '../../services/focus-manager.service';
+import { MatIconModule } from '@angular/material/icon';
+import { CommonModule } from '@angular/common';
 
 interface DialogData {
+  icon?: string;
   title?: string;
   content?: string;
   confirmName?: string;
@@ -36,7 +39,7 @@ interface DialogData {
   templateUrl: './simple-dialog.component.html',
   styleUrls: ['./simple-dialog.component.scss'],
 
-  imports: [MatDialogModule, MatButtonModule],
+  imports: [MatDialogModule, MatButtonModule, MatIconModule, CommonModule],
 })
 export class SimpleDialogComponent extends ComponentWithAnnouncement(
   EscapableDialogComponent

modules/ui/src/app/pages/testrun/testrun.component.html

@@ -67,7 +67,7 @@
       </section>
       <button
         *ngIf="isTestrunInProgress(data.status)"
-        (click)="openStopTestrunDialog(vm.systemStatus)"
+        (click)="openStopTestrunDialog()"
         class="stop-button"
         aria-label="Stop testrun"
         mat-flat-button>

modules/ui/src/app/pages/testrun/testrun.component.spec.ts

@@ -225,7 +225,7 @@ describe('TestrunComponent', () => {
         afterClosed: () => of(true),
       } as MatDialogRef<typeof SimpleDialogComponent>);
 
-      component.openStopTestrunDialog(MOCK_PROGRESS_DATA_CANCELLING);
+      component.openStopTestrunDialog();
 
       expect(stopTestrunSpy).toHaveBeenCalled();
     });

modules/ui/src/app/pages/testrun/testrun.component.ts

@@ -106,13 +106,14 @@ export class TestrunComponent implements OnInit, OnDestroy {
     return this.testRunService.testrunInProgress(status);
   }
 
-  public openStopTestrunDialog(systemStatus: TestrunStatus) {
+  public openStopTestrunDialog() {
     const dialogRef = this.dialog.open(SimpleDialogComponent, {
-      ariaLabel: `Stop testrun ${this.getTestRunName(systemStatus)}`,
+      ariaLabel: `Stop Testrun`,
       data: {
-        title: `Stop testrun ${this.getTestRunName(systemStatus)}?`,
+        icon: 'stop_circle',
+        title: `Stop Testrun?`,
         content:
-          'Are you sure you would like to stop testrun without a report generation?',
+          'Testrun will be stopped without any track records and report generation.',
         confirmName: 'Stop',
       },
       autoFocus: true,