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

Refactor accelerator dashboard

Browse Source
This commit is contained in:
Mononaut
2023-12-07 08:26:32 +00:00
parent e34ee3a34d
commit 8599876b26
22 changed files with 373 additions and 142 deletions
Download Patch File Download Diff File Expand all files Collapse all files

106
frontend/src/app/components/acceleration/accelerator-dashboard/accelerator-dashboard.component.html Normal file
View File

@@ -0,0 +1,106 @@
<app-indexing-progress></app-indexing-progress>
<div class="container-xl dashboard-container">
<div class="row row-cols-1 row-cols-md-2">
<!-- pending stats -->
<div class="col">
<div class="main-title">
<span [attr.data-cy]="'pending-accelerations'" i18n="accelerator.pending-accelerations">Pending accelerations</span>
</div>
<div class="card-wrapper">
<div class="card">
<div class="card-body more-padding">
<app-pending-stats></app-pending-stats>
</div>
</div>
</div>
</div>
<!-- 1w stats -->
<div class="col">
<div class="main-title">
<span [attr.data-cy]="'acceleration-stats'" i18n="accelerator.acceleration-stats">Acceleration stats</span>&nbsp;
<span style="font-size: xx-small" i18n="mining.144-blocks">(1008 blocks)</span>
</div>
<div class="card-wrapper">
<div class="card">
<div class="card-body more-padding">
<app-acceleration-stats timespan="1w" [accelerations$]="accelerations$"></app-acceleration-stats>
</div>
</div>
</div>
</div>
<!-- acceleration fees graph -->
<div class="col" style="margin-bottom: 1.47rem">
<div class="card graph-card">
<div class="card-body pl-2 pr-2">
<app-acceleration-fees-graph [attr.data-cy]="'acceleration-fees'" [widget]=true [accelerations$]="accelerations$"></app-acceleration-fees-graph>
<div class="mt-1"><a [attr.data-cy]="'acceleration-fees-view-more'" [routerLink]="['/graphs/acceleration/fees' | relativeUrl]" i18n="dashboard.view-more">View more &raquo;</a></div>
</div>
</div>
</div>
<!-- Block fee rates -->
<div class="col" style="margin-bottom: 1.47rem">
<div class="card">
<div class="card-body pl-lg-3 pr-lg-3 pl-2 pr-2">
<app-block-fee-rates-graph [attr.data-cy]="'hashrate-graph'" [widget]="true"></app-block-fee-rates-graph>
<div class="mt-1"><a [routerLink]="['/graphs/mining/block-fee-rates' | relativeUrl]" fragment="1m" i18n="dashboard.view-more">View more &raquo;</a></div>
</div>
</div>
</div>
<!-- Recent accelerations -->
<div class="col">
<div class="card">
<div class="card-body">
<a class="title-link" href="" [routerLink]="['/acceleration-list' | relativeUrl]">
<h5 class="card-title d-inline" i18n="dashboard.recent-accelerations">Recent Accelerations</h5>
<span>&nbsp;</span>
<fa-icon [icon]="['fas', 'external-link-alt']" [fixedWidth]="true" style="vertical-align: 'text-top'; font-size: 13px; color: #4a68b9"></fa-icon>
</a>
<app-accelerations-list [attr.data-cy]="'recent-accelerations'" [widget]=true [accelerations$]="accelerations$"></app-accelerations-list>
</div>
</div>
</div>
<!-- Recent blocks -->
<div class="col">
<div class="card">
<div class="card-body">
<a class="title-link" href="" [routerLink]="['/blocks' | relativeUrl]">
<h5 class="card-title d-inline" i18n="dashboard.recent-blocks">Recent Blocks</h5>
<span>&nbsp;</span>
<fa-icon [icon]="['fas', 'external-link-alt']" [fixedWidth]="true" style="vertical-align: 'text-top'; font-size: 13px; color: #4a68b9"></fa-icon>
</a>
<table class="table lastest-blocks-table">
<thead>
<th class="table-cell-height" i18n="dashboard.latest-blocks.height">Height</th>
<th class="table-cell-pool" i18n="mining.pool-name">Pool</th>
<th class="table-cell-fee" i18n="block.median-fee">Median fee</th>
<th class="table-cell-acceleration-count" i18n="accelerator.transaction-count">Accelerations</th>
</thead>
<tbody>
<tr *ngFor="let block of blocks$ | async; let i = index">
<td class="table-cell-height" ><a [routerLink]="['/block' | relativeUrl, block.id]" [state]="{ data: { block: block } }">{{ block.height }}</a></td>
<td class="table-cell-pool">
<a class="clear-link" [routerLink]="[('/mining/pool/' + block.extras.pool.slug) | relativeUrl]">
<img width="22" height="22" src="{{ block.extras.pool['logo'] }}"
onError="this.src = '/resources/mining-pools/default.svg'">
<span class="pool-name">{{ block.extras.pool.name }}</span>
</a>
</td>
<td class="table-cell-fee" ><app-fee-rate [fee]="block?.extras?.medianFee" rounding="1.0-0"></app-fee-rate></td>
<td class="table-cell-acceleration-count">{{ block.accelerationCount | number }}</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>