diff --git a/frontend/src/app/components/block/block.component.ts b/frontend/src/app/components/block/block.component.ts index e815fceed..820cdee81 100644 --- a/frontend/src/app/components/block/block.component.ts +++ b/frontend/src/app/components/block/block.component.ts @@ -1,5 +1,6 @@ import { Component, OnInit, OnDestroy } from '@angular/core'; -import { ActivatedRoute, ParamMap } from '@angular/router'; +import { Location } from '@angular/common'; +import { ActivatedRoute, ParamMap, Router } from '@angular/router'; import { ElectrsApiService } from '../../services/electrs-api.service'; import { switchMap, tap, debounceTime, catchError } from 'rxjs/operators'; import { Block, Transaction, Vout } from '../../interfaces/electrs.interface'; @@ -27,6 +28,8 @@ export class BlockComponent implements OnInit, OnDestroy { constructor( private route: ActivatedRoute, + private location: Location, + private router: Router, private electrsApiService: ElectrsApiService, private stateService: StateService, private seoService: SeoService, @@ -38,6 +41,7 @@ export class BlockComponent implements OnInit, OnDestroy { switchMap((params: ParamMap) => { const blockHash: string = params.get('id') || ''; this.block = undefined; + let isBlockHeight = false; this.error = undefined; this.fees = undefined; @@ -45,7 +49,11 @@ export class BlockComponent implements OnInit, OnDestroy { this.blockHeight = history.state.data.blockHeight; } - this.blockHash = blockHash; + if (/^[0-9]+$/.test(blockHash)) { + isBlockHeight = true; + } else { + this.blockHash = blockHash; + } document.body.scrollTo(0, 0); if (history.state.data && history.state.data.block) { @@ -53,6 +61,19 @@ export class BlockComponent implements OnInit, OnDestroy { return of(history.state.data.block); } else { this.isLoadingBlock = true; + + if (isBlockHeight) { + return this.electrsApiService.getBlockHashFromHeight$(parseInt(blockHash, 10)) + .pipe( + switchMap((hash) => { + this.blockHash = hash; + this.location.replaceState( + this.router.createUrlTree([(this.network ? '/' + this.network : '') + '/block/', hash]).toString() + ); + return this.electrsApiService.getBlock$(hash); + }) + ); + } return this.electrsApiService.getBlock$(blockHash); } }), 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 8b43fa751..8f68a6a64 100644 --- a/frontend/src/app/components/search-form/search-form.component.ts +++ b/frontend/src/app/components/search-form/search-form.component.ts @@ -20,6 +20,7 @@ export class SearchFormComponent implements OnInit { regexAddress = /^([a-km-zA-HJ-NP-Z1-9]{26,35}|[a-km-zA-HJ-NP-Z1-9]{80}|[a-z]{2,5}1[ac-hj-np-z02-9]{8,87})$/; regexBlockhash = /^[0]{8}[a-fA-F0-9]{56}$/; regexTransaction = /^[a-fA-F0-9]{64}$/; + regexBlockheight = /^[0-9]+$/; constructor( private formBuilder: FormBuilder, @@ -48,7 +49,7 @@ export class SearchFormComponent implements OnInit { if (this.regexAddress.test(searchText)) { this.router.navigate([(this.network ? '/' + this.network : '') + '/address/', searchText]); this.searchTriggered.emit(); - } else if (this.regexBlockhash.test(searchText)) { + } else if (this.regexBlockhash.test(searchText) || this.regexBlockheight.test(searchText)) { this.router.navigate([(this.network ? '/' + this.network : '') + '/block/', searchText]); this.searchTriggered.emit(); } else if (this.regexTransaction.test(searchText)) { diff --git a/frontend/src/app/services/electrs-api.service.ts b/frontend/src/app/services/electrs-api.service.ts index 9e72cb2cc..9d42d753c 100644 --- a/frontend/src/app/services/electrs-api.service.ts +++ b/frontend/src/app/services/electrs-api.service.ts @@ -50,6 +50,10 @@ export class ElectrsApiService { return this.httpClient.get(this.apiBaseUrl + '/block/' + hash + '/txs/' + index); } + getBlockHashFromHeight$(height: number): Observable { + return this.httpClient.get(this.apiBaseUrl + '/block-height/' + height, {responseType: 'text'}); + } + getAddress$(address: string): Observable
{ return this.httpClient.get
(this.apiBaseUrl + '/address/' + address); }