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

display block health as badge

Browse Source
This commit is contained in:
Mononaut
2022-12-19 19:02:50 -06:00
parent cf60f00ba8
commit 4746c67a5d
4 changed files with 49 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
frontend/src/app/components/block/block.component.html
View File

@@ -57,8 +57,21 @@
<tr *ngIf="auditEnabled">
<td i18n="block.health">Block health</td>
<td>
<span *ngIf="blockAudit?.matchRate != null">{{ blockAudit.matchRate }}%</span>
<span *ngIf="blockAudit?.matchRate === null" i18n="unknown">Unknown</span>
<span
class="health-badge badge"
[class.badge-success]="blockAudit?.matchRate >= 99"
[class.badge-warning]="blockAudit?.matchRate >= 75 && blockAudit?.matchRate < 99"
[class.badge-danger]="blockAudit?.matchRate < 75"
*ngIf="blockAudit?.matchRate != null; else nullHealth"
>{{ blockAudit?.matchRate }}%</span>
<ng-template #nullHealth>
<ng-container *ngIf="!isLoadingAudit; else loadingHealth">
<span class="health-badge badge badge-secondary" i18n="unknown">Unknown</span>
</ng-container>
</ng-template>
<ng-template #loadingHealth>
<span class="skeleton-loader" style="max-width: 60px"></span>
</ng-template>
</td>
</tr>
<ng-container *ngIf="webGlEnabled && (auditDataMissing || !indexingAvailable)">

22
frontend/src/app/components/block/block.component.ts
View File

@@ -43,6 +43,7 @@ export class BlockComponent implements OnInit, OnDestroy {
strippedTransactions: TransactionStripped[];
overviewTransitionDirection: string;
isLoadingOverview = true;
isLoadingAudit = true;
error: any;
blockSubsidy: number;
fees: number;
@@ -297,13 +298,18 @@ export class BlockComponent implements OnInit, OnDestroy {
this.auditSubscription = block$.pipe(
startWith(null),
pairwise(),
switchMap(([prevBlock, block]) => this.apiService.getBlockAudit$(block.id)
.pipe(
catchError((err) => {
this.overviewError = err;
return of([]);
})
)
switchMap(([prevBlock, block]) => {
this.isLoadingAudit = true;
this.blockAudit = null;
return this.apiService.getBlockAudit$(block.id)
.pipe(
catchError((err) => {
this.overviewError = err;
this.isLoadingAudit = false;
return of([]);
})
);
}
),
filter((response) => response != null),
map((response) => {
@@ -375,12 +381,14 @@ export class BlockComponent implements OnInit, OnDestroy {
console.log(err);
this.error = err;
this.isLoadingOverview = false;
this.isLoadingAudit = false;
return of(null);
}),
).subscribe((blockAudit) => {
this.blockAudit = blockAudit;
this.setupBlockGraphs();
this.isLoadingOverview = false;
this.isLoadingAudit = false;
});
}