diff --git a/frontend/src/app/components/block/block.component.ts b/frontend/src/app/components/block/block.component.ts index 3ded44e0d..9df6b5605 100644 --- a/frontend/src/app/components/block/block.component.ts +++ b/frontend/src/app/components/block/block.component.ts @@ -65,8 +65,20 @@ export class BlockComponent implements OnInit, OnDestroy { map((indicators) => indicators['blocktxs-' + this.blockHash] !== undefined ? indicators['blocktxs-' + this.blockHash] : 0) ); - this.subscription = this.route.paramMap - .pipe( + this.blocksSubscription = this.stateService.blocks$ + .subscribe(([block]) => { + this.latestBlock = block; + this.latestBlocks.unshift(block); + this.latestBlocks = this.latestBlocks.slice(0, this.stateService.env.KEEP_BLOCKS_AMOUNT); + this.setNextAndPreviousBlockLink(); + + if (block.id === this.blockHash) { + this.block = block; + this.fees = block.reward / 100000000 - this.blockSubsidy; + } + }); + + this.subscription = this.route.paramMap.pipe( switchMap((params: ParamMap) => { const blockHash: string = params.get('id') || ''; this.block = undefined; @@ -94,7 +106,12 @@ export class BlockComponent implements OnInit, OnDestroy { } else { this.isLoadingBlock = true; + let blockInCache: Block; if (isBlockHeight) { + blockInCache = this.latestBlocks.find((block) => block.height === parseInt(blockHash, 10)); + if (blockInCache) { + return of(blockInCache); + } return this.electrsApiService.getBlockHashFromHeight$(parseInt(blockHash, 10)) .pipe( switchMap((hash) => { @@ -107,12 +124,11 @@ export class BlockComponent implements OnInit, OnDestroy { ); } - this.stateService.blocks$.subscribe(([block]) => { - if (block.id === blockHash) { - this.block = block; - } - }); - + blockInCache = this.latestBlocks.find((block) => block.id === this.blockHash); + if (blockInCache) { + return of(blockInCache); + } + return this.electrsApiService.getBlock$(blockHash); } }), @@ -159,14 +175,6 @@ export class BlockComponent implements OnInit, OnDestroy { this.isLoadingBlock = false; }); - this.blocksSubscription = this.stateService.blocks$ - .subscribe(([block]) => { - this.latestBlock = block; - this.latestBlocks.unshift(block); - this.latestBlocks = this.latestBlocks.slice(0, this.stateService.env.KEEP_BLOCKS_AMOUNT); - this.setNextAndPreviousBlockLink(); - }); - this.networkChangedSubscription = this.stateService.networkChanged$ .subscribe((network) => this.network = network); @@ -269,12 +277,14 @@ export class BlockComponent implements OnInit, OnDestroy { return; } const block = this.latestBlocks.find((b) => b.height === this.nextBlockHeight - 2); - this.router.navigate([(this.network && this.stateService.env.BASE_MODULE === 'mempool' ? '/' + this.network : '') + '/block/', block ? block.id : this.block.previousblockhash], { state: { data: { block, blockHeight: this.nextBlockHeight - 2 } } }); + this.router.navigate([(this.network && this.stateService.env.BASE_MODULE === 'mempool' ? '/' + this.network : '') + '/block/', + block ? block.id : this.block.previousblockhash], { state: { data: { block, blockHeight: this.nextBlockHeight - 2 } } }); } navigateToNextBlock() { const block = this.latestBlocks.find((b) => b.height === this.nextBlockHeight); - this.router.navigate([(this.network && this.stateService.env.BASE_MODULE === 'mempool' ? '/' + this.network : '') + '/block/', block ? block.id : this.nextBlockHeight], { state: { data: { block, blockHeight: this.nextBlockHeight } } }); + this.router.navigate([(this.network && this.stateService.env.BASE_MODULE === 'mempool' ? '/' + this.network : '') + '/block/', + block ? block.id : this.nextBlockHeight], { state: { data: { block, blockHeight: this.nextBlockHeight } } }); } setNextAndPreviousBlockLink(){ diff --git a/frontend/tslint.json b/frontend/tslint.json index 7ffbacd58..4b0e69b15 100644 --- a/frontend/tslint.json +++ b/frontend/tslint.json @@ -12,6 +12,7 @@ "arrow-parens": false, "arrow-return-shorthand": true, "curly": true, + "no-bitwise": false, "deprecation": { "severity": "warning" },