Allow searching for and viewing assets not in the asset registry.

fixes #111

frontend/src/app/components/asset/asset.component.html

@@ -24,7 +24,7 @@
                 <td>Precision</td>
                 <td>{{ assetContract[3] }}</td>
               </tr>
-              <tr *ngIf="!isNativeAsset">
+              <tr *ngIf="!isNativeAsset && assetContract[0]">
                 <td>Issuer</td>
                 <td><a target="_blank" href="{{ 'http://' + assetContract[0] }}">{{ assetContract[0] }}</a></td>
               </tr>

frontend/src/app/components/asset/asset.component.ts

@@ -98,6 +98,9 @@ export class AssetComponent implements OnInit, OnDestroy {
         switchMap(([asset, assetsData]) => {
           this.asset = asset;
           this.assetContract = assetsData[this.asset.asset_id];
+          if (!this.assetContract) {
+            this.assetContract = [null, '?', 'Unknown', 0];
+          }
           this.isNativeAsset = asset.asset_id === this.nativeAssetId;
           this.updateChainStats();
           this.websocketService.startTrackAsset(asset.asset_id);

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

@@ -4,7 +4,7 @@
       <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="TXID, block height, hash or address">
     </div>
     <div>
-      <button type="submit" class="btn btn-block btn-primary"><fa-icon [icon]="['fas', 'search']" [fixedWidth]="true" title="Search"></fa-icon></button>
+      <button [disabled]="isSearching" type="submit" class="btn btn-block btn-primary"><fa-icon [icon]="['fas', 'search']" [fixedWidth]="true" title="Search"></fa-icon></button>
     </div>
   </div>
 </form>

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

@@ -17,6 +17,7 @@ import { NgbTypeahead } from '@ng-bootstrap/ng-bootstrap';
 export class SearchFormComponent implements OnInit {
   network = '';
   assets: object = {};
+  isSearching = false;
 
   searchForm: FormGroup;
   @Output() searchTriggered = new EventEmitter();
@@ -74,25 +75,36 @@ export class SearchFormComponent implements OnInit {
   search() {
     const searchText = this.searchForm.value.searchText.trim();
     if (searchText) {
+      this.isSearching = true;
       if (this.regexAddress.test(searchText)) {
-        this.router.navigate([(this.network ? '/' + this.network : '') + '/address/', searchText]);
+        this.navigate('/address/', searchText);
-        this.searchTriggered.emit();
       } else if (this.regexBlockhash.test(searchText) || this.regexBlockheight.test(searchText)) {
-        this.router.navigate([(this.network ? '/' + this.network : '') + '/block/', searchText]);
+        this.navigate('/block/', searchText);
-        this.searchTriggered.emit();
       } else if (this.regexTransaction.test(searchText)) {
-        if (this.network === 'liquid' && this.assets[searchText]) {
+        if (this.network === 'liquid') {
-          this.router.navigate([(this.network ? '/' + this.network : '') + '/asset/', searchText]);
+          if (this.assets[searchText]) {
+            this.navigate('/asset/', searchText);
+          }
+          this.electrsApiService.getAsset$(searchText)
+            .subscribe(
+              () => { this.navigate('/asset/', searchText); },
+              () => { this.navigate('/tx/', searchText); }
+            );
         } else {
-          this.router.navigate([(this.network ? '/' + this.network : '') + '/tx/', searchText]);
+          this.navigate('/tx/', searchText);
         }
-        this.searchTriggered.emit();
       } else {
-        return;
+        this.isSearching = false;
       }
-      this.searchForm.setValue({
-        searchText: '',
-      });
     }
   }
+
+  navigate(url: string, searchText: string) {
+    this.router.navigate([(this.network ? '/' + this.network : '') + url, searchText]);
+    this.searchTriggered.emit();
+    this.searchForm.setValue({
+      searchText: '',
+    });
+    this.isSearching = false;
+  }
 }

frontend/src/app/components/transactions-list/transactions-list.component.html

@@ -129,7 +129,7 @@
                     </ng-template>
                     <ng-template #defaultscriptpubkey_type>
                       <ng-template [ngIf]="vout.scriptpubkey_type === 'op_return'" [ngIfElse]="otherPubkeyType">
-                        <a placement="bottom" [ngbTooltip]="vout.scriptpubkey | hex2ascii">OP_RETURN</a>&nbsp;<span class="badge badge-secondary scriptmessage">{{ vout.scriptpubkey_asm | hex2ascii }}</span>
+                        <a placement="bottom" [ngbTooltip]="vout.scriptpubkey | hex2ascii">OP_RETURN</a>&nbsp;<span *ngIf="vout.scriptpubkey_asm !== 'OP_RETURN'" class="badge badge-secondary scriptmessage">{{ vout.scriptpubkey_asm | hex2ascii }}</span>
                       </ng-template>
                       <ng-template #otherPubkeyType>{{ vout.scriptpubkey_type | scriptpubkeyType }}</ng-template>
                     </ng-template>