GlcoinCore/mempool
1
0
Fork 0
mirror of https://github.com/mempool/mempool.git synced 2026-08-13 12:33:11 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions 3

fix: bumpy UI when loading accelerationInfo

Browse source
This commit is contained in:
rodribp 2026-02-27 12:29:57 -06:00
parent e8074be25d
commit ba97e6e733
No known key found for this signature in database
GPG key ID: CC349739DA92EE20
1 changed files with 21 additions and 7 deletions
Download patch file Download diff file Expand all files Collapse all files

28
frontend/src/app/components/transaction/transaction-details/transaction-details.component.html
View file

@ -46,7 +46,7 @@
<ng-template #detailsRight>
<ng-container *ngTemplateOutlet="feeRow"></ng-container>
<ng-container *ngTemplateOutlet="feeRateRow"></ng-container>
@if (!isLoadingTx && !tx?.status?.confirmed && isAcceleration && ((cpfpInfo && hasEffectiveFeeRate) || accelerationInfo)) {
@if (!isLoadingTx && !tx?.status?.confirmed && isAcceleration) {
<ng-container *ngTemplateOutlet="acceleratingRow"></ng-container>
} @else {
<ng-container *ngTemplateOutlet="effectiveRateRow"></ng-container>
@ -275,12 +275,26 @@
</ng-template>
<ng-template #acceleratingRow>
<tr>
<td rowspan="2" colspan="2" style="padding: 0;">
<app-active-acceleration-box [acceleratedBy]="tx.acceleratedBy" [effectiveFeeRate]="tx.effectiveFeePerVsize" [accelerationInfo]="accelerationInfo" [miningStats]="miningStats" [hasCpfp]="hasCpfp" (toggleCpfp)="toggleCpfp()" [chartPositionLeft]="isMobile"></app-active-acceleration-box>
</td>
</tr>
<tr></tr>
@if (accelerationInfo) {
<tr>
<td rowspan="2" colspan="2" style="padding: 0;">
<app-active-acceleration-box [acceleratedBy]="tx.acceleratedBy" [effectiveFeeRate]="tx.effectiveFeePerVsize" [accelerationInfo]="accelerationInfo" [miningStats]="miningStats" [hasCpfp]="hasCpfp" (toggleCpfp)="toggleCpfp()" [chartPositionLeft]="isMobile"></app-active-acceleration-box>
</td>
</tr>
<tr></tr>
} @else {
<tr>
<td rowspan="2" colspan="2" style="padding: 0;">
<table style="width: 100%;">
<tbody>
<tr><td><span class="skeleton-loader"></span></td></tr>
<tr><td><span class="skeleton-loader"></span></td></tr>
</tbody>
</table>
</td>
</tr>
<tr></tr>
}
</ng-template>
<ng-template #minerRow>