From 5e403bd570ac33cb5d30fbd70d33ca0ccd823d3c Mon Sep 17 00:00:00 2001
From: softsimon <softsimon@protonmail.com>
Date: Sat, 25 Jul 2020 17:52:41 +0700
Subject: [PATCH] Address suggestion fixes: Added ellipsis on long addresses.
 Search on item select.

---
 .../app/components/search-form/search-form.component.html   | 2 +-
 .../app/components/search-form/search-form.component.scss   | 6 ++++++
 .../src/app/components/search-form/search-form.component.ts | 4 ++++
 3 files changed, 11 insertions(+), 1 deletion(-)

diff --git a/frontend/src/app/components/search-form/search-form.component.html b/frontend/src/app/components/search-form/search-form.component.html
index 30aa9f58a..9f5e850dc 100644
--- a/frontend/src/app/components/search-form/search-form.component.html
+++ b/frontend/src/app/components/search-form/search-form.component.html
@@ -1,7 +1,7 @@
 <form [formGroup]="searchForm" (submit)="searchForm.valid && search()" class="mr-4" novalidate>
   <div class="form-row">
     <div style="width: 350px;" class="mr-2">
-      <input #instance="ngbTypeahead" [ngbTypeahead]="typeaheadSearch" (focus)="focus$.next($any($event).target.value)" (click)="click$.next($any($event).target.value)" formControlName="searchText" type="text" class="form-control" placeholder="Transaction, block height, hash or address">
+      <input #instance="ngbTypeahead" [ngbTypeahead]="typeaheadSearch" (selectItem)="itemSelected()" (focus)="focus$.next($any($event).target.value)" (click)="click$.next($any($event).target.value)" formControlName="searchText" type="text" class="form-control" placeholder="Transaction, block height, hash or address">
     </div>
     <div>
       <button type="submit" class="btn btn-block btn-primary">Search</button>
diff --git a/frontend/src/app/components/search-form/search-form.component.scss b/frontend/src/app/components/search-form/search-form.component.scss
index e69de29bb..40dc41c1d 100644
--- a/frontend/src/app/components/search-form/search-form.component.scss
+++ b/frontend/src/app/components/search-form/search-form.component.scss
@@ -0,0 +1,6 @@
+:host ::ng-deep .dropdown-item {
+  white-space: nowrap;
+  overflow: hidden;
+  width: 375px;
+  text-overflow: ellipsis;
+}
\ No newline at end of file
diff --git a/frontend/src/app/components/search-form/search-form.component.ts b/frontend/src/app/components/search-form/search-form.component.ts
index 229ac4316..3f499da71 100644
--- a/frontend/src/app/components/search-form/search-form.component.ts
+++ b/frontend/src/app/components/search-form/search-form.component.ts
@@ -66,6 +66,10 @@ export class SearchFormComponent implements OnInit {
     }
   }
 
+  itemSelected() {
+    setTimeout(() => this.search());
+  }
+
   search() {
     const searchText = this.searchForm.value.searchText.trim();
     if (searchText) {