Merge pull request #855 from mempool/simon/liquid-dashboard-update

Display mempool graph on the Liquid dashboard
This commit is contained in:
wiz 2021-10-05 20:16:32 +09:00 committed by GitHub
commit 2bac7f9987
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -16,14 +16,14 @@
<div class="col"> <div class="col">
<div class="card"> <div class="card">
<div class="card-body"> <div class="card-body">
<ng-container *ngTemplateOutlet="stateService.network === 'liquid' ? lbtcPegs : mempoolTable; context: { $implicit: mempoolInfoData }"></ng-container> <ng-container *ngTemplateOutlet="mempoolTable; context: { $implicit: mempoolInfoData }"></ng-container>
</div> </div>
</div> </div>
</div> </div>
<div class="col"> <div class="col">
<div class="card"> <div class="card">
<div class="card-body"> <div class="card-body">
<ng-container *ngTemplateOutlet="txPerSecond; context: { $implicit: mempoolInfoData }"></ng-container> <ng-container *ngTemplateOutlet="stateService.network === 'liquid' ? lbtcPegs : txPerSecond; context: { $implicit: mempoolInfoData }"></ng-container>
</div> </div>
</div> </div>
</div> </div>
@ -44,13 +44,9 @@
<div class="card graph-card"> <div class="card graph-card">
<div class="card-body pl-0"> <div class="card-body pl-0">
<div style="padding-left: 1.25rem;"> <div style="padding-left: 1.25rem;">
<ng-container *ngTemplateOutlet="stateService.network === 'liquid' ? lbtcPegs : mempoolTable; context: { $implicit: mempoolInfoData }"></ng-container> <ng-container *ngTemplateOutlet="mempoolTable; context: { $implicit: mempoolInfoData }"></ng-container>
<hr> <hr>
</div> </div>
<div class="mempool-graph" *ngIf="stateService.network === 'liquid'; else mempoolGraph">
<app-lbtc-pegs-graph [data]="liquidPegsMonth$ | async"></app-lbtc-pegs-graph>
</div>
<ng-template #mempoolGraph>
<div class="mempool-graph" *ngIf="(mempoolStats$ | async) as mempoolStats; else loadingSpinner"> <div class="mempool-graph" *ngIf="(mempoolStats$ | async) as mempoolStats; else loadingSpinner">
<app-mempool-graph <app-mempool-graph
[template]="'widget'" [template]="'widget'"
@ -58,22 +54,25 @@
[data]="mempoolStats.mempool" [data]="mempoolStats.mempool"
></app-mempool-graph> ></app-mempool-graph>
</div> </div>
</ng-template>
</div> </div>
</div> </div>
</div> </div>
<div class="col"> <div class="col">
<div class="card graph-card"> <div class="card graph-card">
<div class="card-body"> <div class="card-body">
<ng-container *ngTemplateOutlet="txPerSecond; context: { $implicit: mempoolInfoData }"></ng-container> <ng-container *ngTemplateOutlet="stateService.network === 'liquid' ? lbtcPegs : txPerSecond; context: { $implicit: mempoolInfoData }"></ng-container>
<br>
<hr> <hr>
<div class="mempool-graph" *ngIf="stateService.network === 'liquid'; else mempoolGraph">
<app-lbtc-pegs-graph [data]="liquidPegsMonth$ | async"></app-lbtc-pegs-graph>
</div>
<ng-template #mempoolGraph>
<div class="mempool-graph" *ngIf="(mempoolStats$ | async) as mempoolStats; else loadingSpinner"> <div class="mempool-graph" *ngIf="(mempoolStats$ | async) as mempoolStats; else loadingSpinner">
<app-incoming-transactions-graph <app-incoming-transactions-graph
[left]="50" [left]="50"
[data]="mempoolStats.weightPerSecond" [data]="mempoolStats.weightPerSecond"
></app-incoming-transactions-graph> ></app-incoming-transactions-graph>
</div> </div>
</ng-template>
</div> </div>
</div> </div>
</div> </div>