diff --git a/frontend/src/app/dashboard/dashboard.component.html b/frontend/src/app/dashboard/dashboard.component.html index b21c5f720..7977b1848 100644 --- a/frontend/src/app/dashboard/dashboard.component.html +++ b/frontend/src/app/dashboard/dashboard.component.html @@ -22,7 +22,7 @@
-
+
@@ -50,8 +50,8 @@
-
-
+
+
Tx weight per second
@@ -112,14 +112,14 @@
- + - + diff --git a/frontend/src/app/dashboard/dashboard.component.scss b/frontend/src/app/dashboard/dashboard.component.scss index 34eb07a6b..931483668 100644 --- a/frontend/src/app/dashboard/dashboard.component.scss +++ b/frontend/src/app/dashboard/dashboard.component.scss @@ -30,3 +30,7 @@ .more-padding { padding: 1.25rem 2rem 1.25rem 2rem; } + +.graph-card { + height: 385px; +} diff --git a/frontend/src/app/dashboard/dashboard.component.ts b/frontend/src/app/dashboard/dashboard.component.ts index d0e1eed08..b7a2736e5 100644 --- a/frontend/src/app/dashboard/dashboard.component.ts +++ b/frontend/src/app/dashboard/dashboard.component.ts @@ -1,6 +1,6 @@ import { ChangeDetectionStrategy, Component, Inject, LOCALE_ID, OnInit } from '@angular/core'; import { combineLatest, merge, Observable, of } from 'rxjs'; -import { map, scan, share, switchMap, tap } from 'rxjs/operators'; +import { filter, map, scan, share, switchMap, tap } from 'rxjs/operators'; import { Block } from '../interfaces/electrs.interface'; import { OptimizedMempoolStats } from '../interfaces/node-api.interface'; import { MempoolInfo, TransactionStripped } from '../interfaces/websocket.interface'; @@ -158,29 +158,30 @@ export class DashboardComponent implements OnInit { map((txs) => txs.slice(0, 6)), ); - this.mempoolStats$ = this.apiService.list2HStatistics$() - .pipe( - switchMap((mempoolStats) => { - return merge( - this.stateService.live2Chart$ - .pipe( - scan((acc, stats) => { - acc.unshift(stats); - acc = acc.slice(0, acc.length - 1); - return acc; - }, mempoolStats) - ), - of(mempoolStats) - ); - }), - map((mempoolStats) => { - return { - mempool: mempoolStats, - weightPerSecond: this.handleNewMempoolData(mempoolStats.concat([])), - }; - }), - share(), - ); + this.mempoolStats$ = this.stateService.connectionState$.pipe( + filter((state) => state === 2), + switchMap(() => this.apiService.list2HStatistics$()), + switchMap((mempoolStats) => { + return merge( + this.stateService.live2Chart$ + .pipe( + scan((acc, stats) => { + acc.unshift(stats); + acc = acc.slice(0, acc.length - 1); + return acc; + }, mempoolStats) + ), + of(mempoolStats) + ); + }), + map((mempoolStats) => { + return { + mempool: mempoolStats, + weightPerSecond: this.handleNewMempoolData(mempoolStats.concat([])), + }; + }), + share(), + ); this.transactionsWeightPerSecondOptions = { showArea: false,
TXID AmountUSDUSD Fee
{{ transaction.txid | shortenString : 10 }} {{ transaction.fee / (transaction.weight / 4) | number : '1.1-1' }} sat/vB