machankura/mempool
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update accelerating pie chart in real time

Browse Source
This commit is contained in:
Mononaut 2024-09-22 18:06:55 +00:00
parent 07a0850f99
commit e144e139b7
No known key found for this signature in database
GPG Key ID: A3F058E41374C04E
3 changed files with 11 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
frontend/src/app/components/acceleration/active-acceleration-box/active-acceleration-box.component.html
View File

@ -10,10 +10,10 @@
</td> </td>
<td class="field-value" [class]="chartPositionLeft ? 'chart-left' : ''"> <td class="field-value" [class]="chartPositionLeft ? 'chart-left' : ''">
<div class="effective-fee-container"> <div class="effective-fee-container">
@if (accelerationInfo?.acceleratedFeeRate && (!tx.effectiveFeePerVsize || accelerationInfo.acceleratedFeeRate >= tx.effectiveFeePerVsize)) { @if (accelerationInfo?.acceleratedFeeRate && (!effectiveFeeRate || accelerationInfo.acceleratedFeeRate >= effectiveFeeRate)) {
<app-fee-rate class="oobFees" [fee]="accelerationInfo.acceleratedFeeRate"></app-fee-rate> <app-fee-rate class="oobFees" [fee]="accelerationInfo.acceleratedFeeRate"></app-fee-rate>
} @else { } @else {
<app-fee-rate class="oobFees" [fee]="tx.effectiveFeePerVsize"></app-fee-rate> <app-fee-rate class="oobFees" [fee]="effectiveFeeRate"></app-fee-rate>
} }
</div> </div>
</td> </td>

12
frontend/src/app/components/acceleration/active-acceleration-box/active-acceleration-box.component.ts
View File

@ -1,4 +1,4 @@
import { Component, ChangeDetectionStrategy, Input, Output, OnChanges, SimpleChanges, EventEmitter } from '@angular/core'; import { Component, ChangeDetectionStrategy, Input, Output, OnChanges, SimpleChanges, EventEmitter, ChangeDetectorRef } from '@angular/core';
import { Transaction } from '../../../interfaces/electrs.interface'; import { Transaction } from '../../../interfaces/electrs.interface';
import { Acceleration, SinglePoolStats } from '../../../interfaces/node-api.interface'; import { Acceleration, SinglePoolStats } from '../../../interfaces/node-api.interface';
import { EChartsOption, PieSeriesOption } from '../../../graphs/echarts'; import { EChartsOption, PieSeriesOption } from '../../../graphs/echarts';
@ -23,7 +23,8 @@ function toRGB({r,g,b}): string {
changeDetection: ChangeDetectionStrategy.OnPush, changeDetection: ChangeDetectionStrategy.OnPush,
}) })
export class ActiveAccelerationBox implements OnChanges { export class ActiveAccelerationBox implements OnChanges {
@Input() tx: Transaction; @Input() acceleratedBy?: number[];
@Input() effectiveFeeRate?: number;
@Input() accelerationInfo: Acceleration; @Input() accelerationInfo: Acceleration;
@Input() miningStats: MiningStats; @Input() miningStats: MiningStats;
@Input() pools: number[]; @Input() pools: number[];
@ -41,10 +42,12 @@ export class ActiveAccelerationBox implements OnChanges {
timespan = ''; timespan = '';
chartInstance: any = undefined; chartInstance: any = undefined;
constructor() {} constructor(
private cd: ChangeDetectorRef,
) {}
ngOnChanges(changes: SimpleChanges): void { ngOnChanges(changes: SimpleChanges): void {
const pools = this.pools || this.accelerationInfo?.pools || this.tx.acceleratedBy; const pools = this.pools || this.accelerationInfo?.pools || this.acceleratedBy;
if (pools && this.miningStats) { if (pools && this.miningStats) {
this.prepareChartOptions(pools); this.prepareChartOptions(pools);
} }
@ -132,6 +135,7 @@ export class ActiveAccelerationBox implements OnChanges {
} }
] ]
}; };
this.cd.markForCheck();
} }
onChartInit(ec) { onChartInit(ec) {

2
frontend/src/app/components/transaction/transaction.component.html
View File

@ -670,7 +670,7 @@
<ng-template #acceleratingRow> <ng-template #acceleratingRow>
<tr> <tr>
<td rowspan="2" colspan="2" style="padding: 0;"> <td rowspan="2" colspan="2" style="padding: 0;">
<app-active-acceleration-box [tx]="tx" [accelerationInfo]="accelerationInfo" [miningStats]="miningStats" [hasCpfp]="hasCpfp" (toggleCpfp)="showCpfpDetails = !showCpfpDetails" [chartPositionLeft]="isMobile"></app-active-acceleration-box> <app-active-acceleration-box [acceleratedBy]="tx.acceleratedBy" [effectiveFeeRate]="tx.effectiveFeePerVsize" [accelerationInfo]="accelerationInfo" [miningStats]="miningStats" [hasCpfp]="hasCpfp" (toggleCpfp)="showCpfpDetails = !showCpfpDetails" [chartPositionLeft]="isMobile"></app-active-acceleration-box>
</td> </td>
</tr> </tr>
<tr></tr> <tr></tr>