diff --git a/frontend/src/app/components/address/address.component.html b/frontend/src/app/components/address/address.component.html index a28cb13b2..39ed2e22d 100644 --- a/frontend/src/app/components/address/address.component.html +++ b/frontend/src/app/components/address/address.component.html @@ -18,15 +18,15 @@ Total received - + Total sent - + Balance - () + () diff --git a/frontend/src/app/components/mempool-block/mempool-block.component.html b/frontend/src/app/components/mempool-block/mempool-block.component.html index 13893ccc8..bb2ea60e2 100644 --- a/frontend/src/app/components/mempool-block/mempool-block.component.html +++ b/frontend/src/app/components/mempool-block/mempool-block.component.html @@ -22,7 +22,7 @@ Total fees - () + () Transactions diff --git a/frontend/src/app/components/mempool-block/mempool-block.component.ts b/frontend/src/app/components/mempool-block/mempool-block.component.ts index 1e78145ff..a2d452bbf 100644 --- a/frontend/src/app/components/mempool-block/mempool-block.component.ts +++ b/frontend/src/app/components/mempool-block/mempool-block.component.ts @@ -31,6 +31,12 @@ export class MempoolBlockComponent implements OnInit, OnDestroy { this.mempoolBlockIndex = parseInt(params.get('id'), 10) || 0; return this.stateService.mempoolBlocks$ .pipe( + map((blocks) => { + if (!blocks.length) { + return [{ index: 0, blockSize: 0, blockVSize: 0, feeRange: [0, 0], medianFee: 0, nTx: 0, totalFees: 0 }]; + } + return blocks; + }), filter((mempoolBlocks) => mempoolBlocks.length > 0), map((mempoolBlocks) => { while (!mempoolBlocks[this.mempoolBlockIndex]) { diff --git a/frontend/src/app/components/mempool-blocks/mempool-blocks.component.ts b/frontend/src/app/components/mempool-blocks/mempool-blocks.component.ts index 4f0cf0780..320ac6a9d 100644 --- a/frontend/src/app/components/mempool-blocks/mempool-blocks.component.ts +++ b/frontend/src/app/components/mempool-blocks/mempool-blocks.component.ts @@ -1,9 +1,9 @@ import { Component, OnInit, OnDestroy, HostListener } from '@angular/core'; -import { Subscription } from 'rxjs'; +import { Subscription, pipe } from 'rxjs'; import { MempoolBlock } from 'src/app/interfaces/websocket.interface'; import { StateService } from 'src/app/services/state.service'; import { Router } from '@angular/router'; -import { take } from 'rxjs/operators'; +import { take, map } from 'rxjs/operators'; import { feeLevels, mempoolFeeColors } from 'src/app/app.constants'; @Component({ @@ -42,6 +42,14 @@ export class MempoolBlocksComponent implements OnInit, OnDestroy { this.stateService.isTabHidden$.subscribe((tabHidden) => this.tabHidden = tabHidden); this.mempoolBlocksSubscription = this.stateService.mempoolBlocks$ + .pipe( + map((blocks) => { + if (!blocks.length) { + return [{ index: 0, blockSize: 0, blockVSize: 0, feeRange: [0, 0], medianFee: 0, nTx: 0, totalFees: 0 }]; + } + return blocks; + }), + ) .subscribe((blocks) => { blocks.forEach((block, i) => { block.index = this.blockIndex + i; diff --git a/frontend/src/app/services/state.service.ts b/frontend/src/app/services/state.service.ts index 360d17d4f..c8836eaa2 100644 --- a/frontend/src/app/services/state.service.ts +++ b/frontend/src/app/services/state.service.ts @@ -25,14 +25,7 @@ export class StateService { conversions$ = new ReplaySubject(1); bsqPrice$ = new ReplaySubject(1); mempoolStats$ = new ReplaySubject(1); - mempoolBlocks$ = new ReplaySubject(1).pipe( - map((blocks) => { - if (!blocks.length) { - return [{ blockSize: 0, blockVSize: 0, feeRange: [0, 0], medianFee: 0, nTx: 0, totalFees: 0 }]; - } - return blocks; - }) - ); + mempoolBlocks$ = new ReplaySubject(1); txReplaced$ = new Subject(); mempoolTransactions$ = new Subject(); blockTransactions$ = new Subject();