Fix: Enable search history by default for Search Box

projects/components/src/search-box/search-box.component.ts

@@ -21,7 +21,7 @@ import {
   TypedSimpleChanges,
 } from '@hypertrace/common';
 import { combineLatest, Observable, Subject, timer } from 'rxjs';
-import { debounce, map } from 'rxjs/operators';
+import { debounce, debounceTime, map } from 'rxjs/operators';
 import { IconSize } from '../icon/icon-size';
 import { PopoverService } from '../popover/popover.service';
 import { PopoverRef } from '../popover/popover-ref';
@@ -111,11 +111,14 @@ export class SearchBoxComponent implements OnInit, OnChanges {
   public searchMode: SearchBoxEmitMode = SearchBoxEmitMode.Incremental;
 
   @Input()
-  public enableSearchHistory: boolean = false; // Experimental
+  public enableSearchHistory: boolean = true; 
 
   @Input()
   public collapsable: boolean = false;
 
+  @Input()
+  public searchHistoryDebounceTime: number | undefined;
+
   @Output()
   public readonly valueChange: EventEmitter<string> = new EventEmitter();
 
@@ -222,7 +225,7 @@ export class SearchBoxComponent implements OnInit, OnChanges {
     this.subscriptionLifecycle.unsubscribe();
     this.subscriptionLifecycle.add(
       combineLatest([this.debouncedValueSubject, this.getDebounceTime()])
-        .pipe(debounce(([_, debounceTime]) => timer(debounceTime)))
+        .pipe(debounce(([_, valueDebounceTime]) => timer(valueDebounceTime)))
         .subscribe(([value, _]) => this.valueChange.emit(value)),
     );
   }
@@ -261,11 +264,22 @@ export class SearchBoxComponent implements OnInit, OnChanges {
     );
 
     this.subscriptionLifecycle.add(
-      this.valueChange.asObservable().subscribe(emittedValue => {
-        if (!isEmpty(emittedValue)) {
-          this.lastEmittedValues = [emittedValue, ...this.lastEmittedValues];
-        }
-      }),
+      this.debounceTime && this.debounceTime > 0 ?
+      this.valueChange
+        .asObservable()
+        .subscribe(emittedValue => {
+          if (!isEmpty(emittedValue)) {
+            this.lastEmittedValues = [emittedValue, ...this.lastEmittedValues];
+          }
+        }) : 
+      this.valueChange
+        .asObservable()
+        .pipe(debounceTime(400))
+        .subscribe(emittedValue => {
+          if (!isEmpty(emittedValue)) {
+            this.lastEmittedValues = [emittedValue, ...this.lastEmittedValues];
+          }
+        }),
     );
   }
 
@@ -296,7 +310,7 @@ export class SearchBoxComponent implements OnInit, OnChanges {
   }
 
   private handleSearchHistoryOnInputBlur(): void {
-    this.searchHistory = [...uniq(this.lastEmittedValues), ...this.searchHistory];
+    this.searchHistory = uniq([...this.lastEmittedValues, ...this.searchHistory]);
     this.filteredSearchHistory = [...this.searchHistory];
     this.lastEmittedValues = [];
   }