Merge pull request #1415 from mempool/simon/miner-dashboard-websocket-push-fix

Subscribe to blocks and mempool updates in the mining dashboard
This commit is contained in:
wiz 2022-03-19 20:38:21 +00:00 committed by GitHub
commit 6123f94785
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 14 additions and 9 deletions

View File

@ -34,7 +34,9 @@ export class BlocksList implements OnInit {
} }
ngOnInit(): void { ngOnInit(): void {
if (!this.widget) {
this.websocketService.want(['blocks']); this.websocketService.want(['blocks']);
}
this.skeletonLines = this.widget === true ? [...Array(5).keys()] : [...Array(15).keys()]; this.skeletonLines = this.widget === true ? [...Array(5).keys()] : [...Array(15).keys()];
this.paginationMaxSize = window.matchMedia('(max-width: 670px)').matches ? 3 : 5; this.paginationMaxSize = window.matchMedia('(max-width: 670px)').matches ? 3 : 5;

View File

@ -1,9 +1,9 @@
import { ChangeDetectionStrategy, Component, Inject, LOCALE_ID, OnInit } from '@angular/core'; import { ChangeDetectionStrategy, Component, OnInit } from '@angular/core';
import { map } from 'rxjs/operators'; import { map } from 'rxjs/operators';
import { SeoService } from 'src/app/services/seo.service'; import { SeoService } from 'src/app/services/seo.service';
import { StateService } from 'src/app/services/state.service'; import { StateService } from 'src/app/services/state.service';
import { formatNumber } from '@angular/common';
import { Observable } from 'rxjs'; import { Observable } from 'rxjs';
import { WebsocketService } from 'src/app/services/websocket.service';
@Component({ @Component({
selector: 'app-mining-dashboard', selector: 'app-mining-dashboard',
@ -19,27 +19,30 @@ export class MiningDashboardComponent implements OnInit {
public rewardPerTx = '~'; public rewardPerTx = '~';
public feePerTx = '~'; public feePerTx = '~';
constructor(private seoService: SeoService, constructor(
private seoService: SeoService,
public stateService: StateService, public stateService: StateService,
@Inject(LOCALE_ID) private locale: string, private websocketService: WebsocketService,
) { ) {
this.seoService.setTitle($localize`:@@mining.mining-dashboard:Mining Dashboard`); this.seoService.setTitle($localize`:@@mining.mining-dashboard:Mining Dashboard`);
} }
ngOnInit(): void { ngOnInit(): void {
this.websocketService.want(['blocks', 'mempool-blocks']);
this.$rewardStats = this.stateService.blocks$.pipe( this.$rewardStats = this.stateService.blocks$.pipe(
map(([block]) => { map(([block]) => {
this.blocks.unshift(block); this.blocks.unshift(block);
this.blocks = this.blocks.slice(0, 8); this.blocks = this.blocks.slice(0, 8);
const totalTx = this.blocks.reduce((acc, block) => acc + block.tx_count, 0); const totalTx = this.blocks.reduce((acc, b) => acc + b.tx_count, 0);
const totalFee = this.blocks.reduce((acc, block) => acc + block.extras?.totalFees ?? 0, 0); const totalFee = this.blocks.reduce((acc, b) => acc + b.extras?.totalFees ?? 0, 0);
const totalReward = this.blocks.reduce((acc, block) => acc + block.extras?.reward ?? 0, 0); const totalReward = this.blocks.reduce((acc, b) => acc + b.extras?.reward ?? 0, 0);
return { return {
'totalReward': totalReward, 'totalReward': totalReward,
'rewardPerTx': Math.round(totalReward / totalTx), 'rewardPerTx': Math.round(totalReward / totalTx),
'feePerTx': Math.round(totalFee / totalTx), 'feePerTx': Math.round(totalFee / totalTx),
} };
}) })
); );
} }