Improve search typeahead performance and use native events

1 files changed, 4 insertions, 10 deletions

diff --git a/client/src/app/header/suggestions.component.ts b/client/src/app/header/suggestions.component.ts
index fac7fe2f9..ee3ef73c2 100644
--- a/client/src/app/header/suggestions.component.ts
+++ b/client/src/app/header/suggestions.component.ts
@@ -1,16 +1,10 @@
-import { Input, QueryList, Component, Output, AfterViewInit, EventEmitter, ViewChildren } from '@angular/core'
+import { Input, QueryList, Component, Output, AfterViewInit, EventEmitter, ViewChildren, ChangeDetectionStrategy } from '@angular/core'
 import { SuggestionComponent } from './suggestion.component'
 
 @Component({
   selector: 'my-suggestions',
-  template: `
-    <ul role="listbox" class="p-0 m-0">
-      <li *ngFor="let result of results; let i = index" class="d-flex flex-justify-start flex-items-center p-0 f5"
-          role="option" aria-selected="true" (mouseenter)="hoverItem(i)">
-        <my-suggestion [result]="result" [highlight]="highlight"></my-suggestion>
-      </li>
-    </ul>
-  `
+  templateUrl: './suggestions.component.html',
+  changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class SuggestionsComponent implements AfterViewInit {
   @Input() results: any[]
@@ -20,7 +14,7 @@ export class SuggestionsComponent implements AfterViewInit {
 
   ngAfterViewInit () {
     this.listItems.changes.subscribe(
-      val => this.init.emit({ items: this.listItems })
+      _ => this.init.emit({ items: this.listItems })
     )
   }