From 99be4759607de368fd083197e5aef9557eb973bd Mon Sep 17 00:00:00 2001
From: kurilova <sonnycactus@gmail.com>
Date: Fri, 7 Jun 2024 12:42:27 +0000
Subject: [PATCH 1/2] Changes aria-label for Download Anyway button; Fix
 keyboard navigation for Download zip component

---
 .../download-report-zip.component.ts          |  7 ++++++
 .../download-zip-modal.component.html         |  3 ++-
 .../app/pages/reports/reports.component.html  | 12 +++++-----
 .../app/pages/reports/reports.component.scss  |  5 +++++
 .../download-options.component.html           | 18 +++++++++------
 .../download-options.component.ts             | 22 ++++++++++++++++++-
 6 files changed, 53 insertions(+), 14 deletions(-)

diff --git a/modules/ui/src/app/components/download-report-zip/download-report-zip.component.ts b/modules/ui/src/app/components/download-report-zip/download-report-zip.component.ts
index 2dbae7d9a..370c997ef 100644
--- a/modules/ui/src/app/components/download-report-zip/download-report-zip.component.ts
+++ b/modules/ui/src/app/components/download-report-zip/download-report-zip.component.ts
@@ -16,6 +16,7 @@
 import {
   ChangeDetectionStrategy,
   Component,
+  HostBinding,
   HostListener,
   Input,
   OnDestroy,
@@ -44,7 +45,10 @@ export class DownloadReportZipComponent implements OnDestroy {
   @Input() url: string | null | undefined = null;
 
   @HostListener('click', ['$event.target'])
+  @HostListener('keydown.enter', ['$event'])
+  @HostListener('keydown.space', ['$event'])
   onClick() {
+    console.log('123');
     const dialogRef = this.dialog.open(DownloadZipModalComponent, {
       ariaLabel: 'Download zip',
       data: {
@@ -77,6 +81,9 @@ export class DownloadReportZipComponent implements OnDestroy {
       });
   }
 
+  @HostBinding('tabIndex')
+  readonly tabIndex = 0;
+
   ngOnDestroy() {
     this.destroy$.next(true);
     this.destroy$.unsubscribe();
diff --git a/modules/ui/src/app/components/download-zip-modal/download-zip-modal.component.html b/modules/ui/src/app/components/download-zip-modal/download-zip-modal.component.html
index 8f76133d6..abbbee77b 100644
--- a/modules/ui/src/app/components/download-zip-modal/download-zip-modal.component.html
+++ b/modules/ui/src/app/components/download-zip-modal/download-zip-modal.component.html
@@ -54,6 +54,7 @@
       class="download-button"
       color="primary"
       mat-flat-button
+      aria-label="Download"
       type="button">
       Download
     </button>
@@ -69,7 +70,7 @@
     color="primary"
     mat-button
     type="button"
-    m
+    aria-label="Download ZIP file without Risk Assessment"
     class="download-button">
     Download Anyway
   </button>
diff --git a/modules/ui/src/app/pages/reports/reports.component.html b/modules/ui/src/app/pages/reports/reports.component.html
index c649478a5..e35728c6b 100644
--- a/modules/ui/src/app/pages/reports/reports.component.html
+++ b/modules/ui/src/app/pages/reports/reports.component.html
@@ -155,11 +155,13 @@ <h2 class="title">Reports</h2>
                 [url]="data.report"
                 [hasProfiles]="vm.hasProfiles"
                 [profiles]="vm.profiles">
-                <mat-icon
-                  class="download-report-icon"
-                  fontSet="material-symbols-outlined">
-                  archive
-                </mat-icon>
+                <span class="download-report-zip-icon-container">
+                  <mat-icon
+                    class="download-report-icon"
+                    fontSet="material-symbols-outlined">
+                    archive
+                  </mat-icon>
+                </span>
               </app-download-report-zip>
               <app-delete-report
                 *ngIf="data?.device"
diff --git a/modules/ui/src/app/pages/reports/reports.component.scss b/modules/ui/src/app/pages/reports/reports.component.scss
index bd6098940..d0b204a1c 100644
--- a/modules/ui/src/app/pages/reports/reports.component.scss
+++ b/modules/ui/src/app/pages/reports/reports.component.scss
@@ -169,3 +169,8 @@
   line-height: 20px;
   font-size: 14px;
 }
+
+.download-report-zip-icon-container {
+  display: inline-block;
+  padding-top: 5px;
+}
diff --git a/modules/ui/src/app/pages/testrun/components/download-options/download-options.component.html b/modules/ui/src/app/pages/testrun/components/download-options/download-options.component.html
index b1d58ae73..ea6a75ab2 100644
--- a/modules/ui/src/app/pages/testrun/components/download-options/download-options.component.html
+++ b/modules/ui/src/app/pages/testrun/components/download-options/download-options.component.html
@@ -29,18 +29,22 @@
       </mat-icon>
       <span>{{ DownloadOption.PDF }}</span>
     </mat-option>
-    <mat-option class="download-option zip">
-      <app-download-report-zip
-        [url]="data.report"
-        [hasProfiles]="hasProfiles"
-        [profiles]="profiles">
+    <app-download-report-zip
+      id="downloadReportZip"
+      class="download-option zip"
+      [url]="data.report"
+      [hasProfiles]="hasProfiles"
+      [profiles]="profiles">
+      <mat-option
+        (onSelectionChange)="onZipSelected($event)"
+        (click)="$event.stopPropagation()">
         <mat-icon
           class="download-report-icon"
           fontSet="material-symbols-outlined">
           archive
         </mat-icon>
         <span>{{ DownloadOption.ZIP }}</span>
-      </app-download-report-zip>
-    </mat-option>
+      </mat-option>
+    </app-download-report-zip>
   </mat-select>
 </mat-form-field>
diff --git a/modules/ui/src/app/pages/testrun/components/download-options/download-options.component.ts b/modules/ui/src/app/pages/testrun/components/download-options/download-options.component.ts
index 76cd8d66f..f4f5ac44c 100644
--- a/modules/ui/src/app/pages/testrun/components/download-options/download-options.component.ts
+++ b/modules/ui/src/app/pages/testrun/components/download-options/download-options.component.ts
@@ -13,7 +13,13 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-import { ChangeDetectionStrategy, Component, Input } from '@angular/core';
+import {
+  ChangeDetectionStrategy,
+  Component,
+  ElementRef,
+  Input,
+  ViewChild,
+} from '@angular/core';
 import { FormsModule } from '@angular/forms';
 import { MatFormFieldModule } from '@angular/material/form-field';
 import { MatSelectModule } from '@angular/material/select';
@@ -48,6 +54,7 @@ export enum DownloadOption {
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class DownloadOptionsComponent {
+  @ViewChild('downloadReportZip') downloadReportZip!: ElementRef;
   @Input() hasProfiles: boolean = false;
   @Input() profiles: Profile[] = [];
   @Input() data!: TestrunStatus;
@@ -65,6 +72,19 @@ export class DownloadOptionsComponent {
     }
   }
 
+  onZipSelected(event: MatOptionSelectionChange) {
+    console.log(event);
+    /*    console.log(event);
+    event.preventDefault();
+    event.stopPropagation();*/
+    if (event.isUserInput) {
+      const uploadCertificatesButton = document.querySelector(
+        '#downloadReportZip'
+      ) as HTMLElement;
+      uploadCertificatesButton.dispatchEvent(new MouseEvent('click'));
+    }
+  }
+
   createLink(data: TestrunStatus, type: string) {
     if (!data.report) {
       return;

From 00263aa2e12e2e2f6f3a34d63ccc83fc795a0a5b Mon Sep 17 00:00:00 2001
From: kurilova <sonnycactus@gmail.com>
Date: Fri, 7 Jun 2024 12:48:02 +0000
Subject: [PATCH 2/2] Remove console logs

---
 .../download-report-zip/download-report-zip.component.ts      | 1 -
 .../components/download-options/download-options.component.ts | 4 ----
 2 files changed, 5 deletions(-)

diff --git a/modules/ui/src/app/components/download-report-zip/download-report-zip.component.ts b/modules/ui/src/app/components/download-report-zip/download-report-zip.component.ts
index 370c997ef..f773d87d9 100644
--- a/modules/ui/src/app/components/download-report-zip/download-report-zip.component.ts
+++ b/modules/ui/src/app/components/download-report-zip/download-report-zip.component.ts
@@ -48,7 +48,6 @@ export class DownloadReportZipComponent implements OnDestroy {
   @HostListener('keydown.enter', ['$event'])
   @HostListener('keydown.space', ['$event'])
   onClick() {
-    console.log('123');
     const dialogRef = this.dialog.open(DownloadZipModalComponent, {
       ariaLabel: 'Download zip',
       data: {
diff --git a/modules/ui/src/app/pages/testrun/components/download-options/download-options.component.ts b/modules/ui/src/app/pages/testrun/components/download-options/download-options.component.ts
index f4f5ac44c..943616d5b 100644
--- a/modules/ui/src/app/pages/testrun/components/download-options/download-options.component.ts
+++ b/modules/ui/src/app/pages/testrun/components/download-options/download-options.component.ts
@@ -73,10 +73,6 @@ export class DownloadOptionsComponent {
   }
 
   onZipSelected(event: MatOptionSelectionChange) {
-    console.log(event);
-    /*    console.log(event);
-    event.preventDefault();
-    event.stopPropagation();*/
     if (event.isUserInput) {
       const uploadCertificatesButton = document.querySelector(
         '#downloadReportZip'