Tidy acceleration dashboard, add missing fields

This commit is contained in:
Mononaut
2023-08-30 22:25:33 +09:00
parent f26b630aab
commit 472a76560f
4 changed files with 97 additions and 67 deletions

View File

@@ -46,17 +46,17 @@
</div>
<div *ngIf="widget">
<div class="block-fee-rates" *ngIf="(statsObservable$ | async) as stats; else loadingStats">
<div class="item">
<h5 class="card-title" i18n="mining.avg-block-fee-1m">Avg Block Fee (1m)</h5>
<div class="block-fee-rates">
<div class="item" *ngIf="(hrStatsObservable$ | async) as stats; else loadingHrStats">
<h5 class="card-title" i18n="mining.avg-block-fee-24h">Avg Block Fee (24h)</h5>
<p class="card-text">
<app-fee-rate [fee]="stats.avgMedianRate"></app-fee-rate>
</p>
</div>
<div class="item">
<h5 class="card-title" i18n="block.???">???</h5>
<div class="item" *ngIf="(statsObservable$ | async) as stats; else loadingStats">
<h5 class="card-title" i18n="mining.avg-block-fee-1m">Avg Block Fee (1m)</h5>
<p class="card-text">
???
<app-fee-rate [fee]="stats.avgMedianRate"></app-fee-rate>
</p>
</div>
</div>
@@ -71,19 +71,19 @@
</div>
<ng-template #loadingHrStats>
<div class="item">
<h5 class="card-title" i18n="mining.avg-block-fee-24h">Avg Block Fee (24h)</h5>
<p class="card-text">
<span class="skeleton-loader skeleton-loader-big"></span>
</p>
</div>
</ng-template>
<ng-template #loadingStats>
<div class="block-fee-rates">
<div class="item">
<h5 class="card-title" i18n="mining.avg-block-fee">Avg Block Fee</h5>
<p class="card-text">
<span class="skeleton-loader skeleton-loader-big"></span>
</p>
</div>
<div class="item">
<h5 class="card-title" i18n="block.???">???</h5>
<p class="card-text">
<span class="skeleton-loader skeleton-loader-big"></span>
</p>
</div>
<div class="item">
<h5 class="card-title" i18n="mining.avg-block-fee-1m">Avg Block Fee (1m)</h5>
<p class="card-text">
<span class="skeleton-loader skeleton-loader-big"></span>
</p>
</div>
</ng-template>

View File

@@ -41,6 +41,7 @@ export class BlockFeeRatesGraphComponent implements OnInit {
renderer: 'svg',
};
hrStatsObservable$: Observable<any>;
statsObservable$: Observable<any>;
isLoading = true;
formatNumber = formatNumber;
@@ -85,6 +86,19 @@ export class BlockFeeRatesGraphComponent implements OnInit {
});
}
this.hrStatsObservable$ = combineLatest([
this.apiService.getHistoricalBlockFeeRates$('24h'),
this.stateService.rateUnits$
]).pipe(
map(([response, rateUnits]) => {
return {
blockCount: parseInt(response.headers.get('x-total-count'), 10),
avgMedianRate: response.body.length ? response.body.reduce((acc, rate) => acc + rate.avgFee_50, 0) / response.body.length : 0,
};
}),
share(),
);
this.statsObservable$ = combineLatest([
this.widget ? of(this.miningWindowPreference) : this.radioGroupForm.get('dateSpan').valueChanges.pipe(startWith(this.radioGroupForm.controls.dateSpan.value)),
this.stateService.rateUnits$