From eeb8372af1c40726b2e1b2ea14bcc26d3978ed6a Mon Sep 17 00:00:00 2001
From: Urmi Kataria <urmi.kataria@gov.bc.ca>
Date: Wed, 6 Mar 2024 15:41:57 -0800
Subject: [PATCH] Public search scroll to result

---
 .../public/search/public-search.component.html      |  4 ++--
 .../public/search/public-search.component.ts        | 13 +++++++++++--
 2 files changed, 13 insertions(+), 4 deletions(-)

diff --git a/portal-frontend/src/app/features/public/search/public-search.component.html b/portal-frontend/src/app/features/public/search/public-search.component.html
index 7db89e1d2d..341a983c1b 100644
--- a/portal-frontend/src/app/features/public/search/public-search.component.html
+++ b/portal-frontend/src/app/features/public/search/public-search.component.html
@@ -127,7 +127,7 @@ <h3>Search by one or more of the following fields:</h3>
 
     <div class="button-controls">
       <button type="button" mat-stroked-button color="accent" (click)="onClear()">Clear</button>
-      <button type="submit" mat-flat-button color="primary" [disabled]="formEmpty || !searchForm.valid">Search</button>
+      <button type="submit" mat-flat-button color="primary" [disabled]="formEmpty || !searchForm.valid || isLoading">Search</button>
     </div>
   </form>
 
@@ -135,7 +135,7 @@ <h3>Search by one or more of the following fields:</h3>
     <mat-spinner></mat-spinner>
   </div>
   <div class="search-fields-wrapper search-result-wrapper" *ngIf="!searchResultsHidden">
-    <h3 class="search-title">Search Results</h3>
+    <h3 class="search-title" id="searchResults">Search Results</h3>
     <div *ngIf="isLoading && !searchResultsHidden" class="center">
       <mat-spinner></mat-spinner>
     </div>
diff --git a/portal-frontend/src/app/features/public/search/public-search.component.ts b/portal-frontend/src/app/features/public/search/public-search.component.ts
index 0c83cc7057..e18626f5d2 100644
--- a/portal-frontend/src/app/features/public/search/public-search.component.ts
+++ b/portal-frontend/src/app/features/public/search/public-search.component.ts
@@ -1,4 +1,4 @@
-import { Component, HostListener, OnDestroy, OnInit, ViewChild } from '@angular/core';
+import { Component, ElementRef, HostListener, OnDestroy, OnInit, ViewChild } from '@angular/core';
 import { FormControl, FormGroup } from '@angular/forms';
 import { MatAutocompleteSelectedEvent } from '@angular/material/autocomplete';
 import { MatPaginator } from '@angular/material/paginator';
@@ -128,7 +128,8 @@ export class PublicSearchComponent implements OnInit, OnDestroy {
     private codeService: CodeService,
     private statusService: StatusService,
     private toastService: ToastService,
-    private titleService: Title
+    private titleService: Title,
+    private elementRef: ElementRef,
   ) {
     this.titleService.setTitle('ALC Portal | Public Search');
   }
@@ -193,6 +194,14 @@ export class PublicSearchComponent implements OnInit, OnDestroy {
     sessionStorage.setItem(SEARCH_SESSION_STORAGE_KEY, searchDto);
 
     this.isLoading = true;
+    const element = this.elementRef.nativeElement.querySelector(`#${CSS.escape('searchResults')}`);
+    if (element) {
+      element.scrollIntoView({
+        behavior: 'smooth',
+        block: 'start',
+        inline: 'start',
+      });
+    }
     const result = await this.searchService.search(searchParams);
     this.searchResultsHidden = false;
     this.isLoading = false;