From b2162130d9354d2125677f2b76e9955b5fb29c1d Mon Sep 17 00:00:00 2001
From: nymkappa <1612910616@pm.me>
Date: Tue, 21 Feb 2023 18:09:41 +0900
Subject: [PATCH] Keep block alignment if fee/fee-range is missing

---
 .../blockchain-blocks.component.html           | 18 ++++++++++++------
 1 file changed, 12 insertions(+), 6 deletions(-)

diff --git a/frontend/src/app/components/blockchain-blocks/blockchain-blocks.component.html b/frontend/src/app/components/blockchain-blocks/blockchain-blocks.component.html
index d943c7ef5..400016d02 100644
--- a/frontend/src/app/components/blockchain-blocks/blockchain-blocks.component.html
+++ b/frontend/src/app/components/blockchain-blocks/blockchain-blocks.component.html
@@ -14,20 +14,26 @@
             }}</a>
         </div>
         <div class="block-body">
-          <div *ngIf="block?.extras" [attr.data-cy]="'bitcoin-block-offset=' + offset + '-index-' + i + '-fees'" class="fees">
+          <div *ngIf="block?.extras; else emptyfees" [attr.data-cy]="'bitcoin-block-offset=' + offset + '-index-' + i + '-fees'" class="fees">
             ~{{ block?.extras?.medianFee | number:feeRounding }} <ng-container
               i18n="shared.sat-vbyte|sat/vB">sat/vB</ng-container>
           </div>
+          <ng-template #emptyfees>
+            <div [attr.data-cy]="'bitcoin-block-offset=' + offset + '-index-' + i + '-fees'" class="fees">
+              &nbsp;
+            </div>
+          </ng-template>
           <div [attr.data-cy]="'bitcoin-block-' + offset + '-index-' + i + '-fee-span'" class="fee-span"
-            *ngIf="block?.extras?.feeRange">
+            *ngIf="block?.extras?.feeRange; else emptyfeespan">
             {{ block?.extras?.feeRange?.[1] | number:feeRounding }} - {{
             block?.extras?.feeRange[block?.extras?.feeRange?.length - 1] | number:feeRounding }} <ng-container
               i18n="shared.sat-vbyte|sat/vB">sat/vB</ng-container>
           </div>
-          <div [attr.data-cy]="'bitcoin-block-' + offset + '-index-' + i + '-fee-span'" class="fee-span"
-            *ngIf="!block?.extras?.feeRange">
-            &nbsp;
-          </div>
+          <ng-template #emptyfeespan>
+            <div [attr.data-cy]="'bitcoin-block-offset=' + offset + '-index-' + i + '-fees'" class="fee-span">
+              &nbsp;
+            </div>
+          </ng-template>
           <div [attr.data-cy]="'bitcoin-block-' + offset + '-index-' + i + '-total-fees'" *ngIf="showMiningInfo"
             class="block-size">
             <app-amount [satoshis]="block.extras?.totalFees ?? 0" digitsInfo="1.2-3" [noFiat]="true"></app-amount>