From 48b82329cb8becafaeeb54bdb3e0cdd052b51b90 Mon Sep 17 00:00:00 2001
From: Mononaut <github@monospace.live>
Date: Sat, 23 Mar 2024 06:40:46 +0000
Subject: [PATCH] Adjust transaction details table layout

---
 .../transaction/transaction.component.html    | 20 +++++++++++++------
 1 file changed, 14 insertions(+), 6 deletions(-)

diff --git a/frontend/src/app/components/transaction/transaction.component.html b/frontend/src/app/components/transaction/transaction.component.html
index 277ab5a4b..1e204f6be 100644
--- a/frontend/src/app/components/transaction/transaction.component.html
+++ b/frontend/src/app/components/transaction/transaction.component.html
@@ -71,19 +71,15 @@
                   </td>
                 </tr>
                 <tr *ngIf="network === ''">
-                  <td class="td-width" i18n="transaction.mining">Mining</td>
+                  <td class="td-width" i18n="transaction.audit">Audit</td>
                   <td *ngIf="pool" class="wrap-cell">
-                    <a placement="bottom" [routerLink]="['/mining/pool' | relativeUrl, pool.slug]" class="badge mr-1"
-                      [class]="pool.name === 'Unknown' ? 'badge-secondary' : 'badge-primary'">
-                      {{ pool.name }}
-                    </a>
                     <ng-container *ngIf="auditStatus">
                       <span *ngIf="auditStatus.coinbase; else accelerated" class="badge badge-primary mr-1" i18n="tx-features.tag.coinbase|Coinbase">Coinbase</span>
                       <ng-template #accelerated><span *ngIf="auditStatus.accelerated || accelerationInfo || (tx && tx.acceleration) ; else expected" class="badge badge-accelerated mr-1" i18n="transaction.audit.accelerated">Accelerated</span></ng-template>
                       <ng-template #expected><span *ngIf="auditStatus.expected; else seen" class="badge badge-success mr-1" i18n-ngbTooltip="Expected in block tooltip" ngbTooltip="This transaction was projected to be included in the block" placement="bottom" i18n="tx-features.tag.expected|Expected in Block">Expected in Block</span></ng-template>
                       <ng-template #seen><span *ngIf="auditStatus.seen; else notSeen" class="badge badge-success mr-1" i18n-ngbTooltip="Seen in mempool tooltip" ngbTooltip="This transaction was seen in the mempool prior to mining" placement="bottom" i18n="tx-features.tag.seen|Seen in Mempool">Seen in Mempool</span></ng-template>
                       <ng-template #notSeen><span class="badge badge-warning mr-1" i18n-ngbTooltip="Not seen in mempool tooltip" ngbTooltip="This transaction was missing from our mempool prior to mining" placement="bottom" i18n="tx-features.tag.not-seen|Not seen in Mempool">Not seen in Mempool</span></ng-template>
-                      <span *ngIf="auditStatus.added" class="badge badge-primary mr-1" i18n-ngbTooltip="Added transaction tooltip" ngbTooltip="This transaction may have been added or prioritized out-of-band" placement="bottom" i18n="tx-features.tag.added|Added">Added</span>
+                      <span *ngIf="auditStatus.added" class="badge badge-warning mr-1" i18n-ngbTooltip="Added transaction tooltip" ngbTooltip="This transaction may have been added or prioritized out-of-band" placement="bottom" i18n="tx-features.tag.added|Added">Added</span>
                       <span *ngIf="auditStatus.conflict" class="badge badge-warning mr-1" i18n-ngbTooltip="Conflict in mempool tooltip" ngbTooltip="This transaction conflicted with another version in our mempool" placement="bottom" i18n="tx-features.tag.conflict|Conflict">Conflict</span>
                     </ng-container>
                   </td>
@@ -562,6 +558,18 @@
           <button *ngIf="cpfpInfo?.bestDescendant || cpfpInfo?.descendants?.length || cpfpInfo?.ancestors?.length" type="button" class="btn btn-outline-info btn-sm btn-small-height float-right" (click)="showCpfpDetails = !showCpfpDetails">CPFP <fa-icon [icon]="['fas', 'info-circle']" [fixedWidth]="true"></fa-icon></button>
         </td>
       </tr>
+      <tr *ngIf="network === '' && tx?.status?.confirmed">
+        <td class="td-width" i18n="block.miner">Miner</td>
+        <td *ngIf="pool" class="wrap-cell">
+          <a placement="bottom" [routerLink]="['/mining/pool' | relativeUrl, pool.slug]" class="badge mr-1"
+            [class]="pool.name === 'Unknown' ? 'badge-secondary' : 'badge-primary'">
+            {{ pool.name }}
+          </a>
+        </td>
+        <td *ngIf="!pool">
+          <span class="skeleton-loader"></span>
+        </td>
+      </tr>
     </tbody>
   </table>
 </ng-template>