Node and Channel pages improvements

frontend/src/app/components/search-form/search-form.component.ts

@@ -66,9 +66,9 @@ export class SearchFormComponent implements OnInit {
           if (this.network === 'bisq' && text.match(/^(b)[^c]/i)) {
             return text.substr(1);
           }
-          return text;
+          return text.trim();
         }),
-        debounceTime(300),
+        debounceTime(250),
         distinctUntilChanged(),
         switchMap((text) => {
           if (!text.length) {
@@ -82,7 +82,10 @@ export class SearchFormComponent implements OnInit {
           }
           return zip(
             this.electrsApiService.getAddressesByPrefix$(text).pipe(catchError(() => of([]))),
-            this.apiService.lightningSearch$(text),
+            this.apiService.lightningSearch$(text).pipe(catchError(() => of({
+              nodes: [],
+              channels: [],
+            }))),
           );
         }),
         map((result: any[]) => {

frontend/src/app/components/search-form/search-results/search-results.component.html

@@ -17,8 +17,8 @@
   </ng-template>
   <ng-template [ngIf]="results.channels.length">
     <div class="card-title">Lightning Channels</div>
-    <ng-template [class.active]="results.addresses.length + results.nodes.length + i === activeIdx" ngFor [ngForOf]="results.channels" let-channel let-i="index">
-      <button (click)="clickItem(results.addresses.length + results.nodes.length + i)" type="button" role="option" class="dropdown-item">
+    <ng-template ngFor [ngForOf]="results.channels" let-channel let-i="index">
+      <button (click)="clickItem(results.addresses.length + results.nodes.length + i)" [class.active]="results.addresses.length + results.nodes.length + i === activeIdx" type="button" role="option" class="dropdown-item">
         <ngb-highlight [result]="channel.short_id" [term]="searchTerm"></ngb-highlight> &nbsp;<span class="symbol">{{ channel.id }}</span>
       </button>
     </ng-template>