on chain UTXOs page layout

src/app/lnd/on-chain/utxo-tables/utxos/utxos.component.html

@@ -20,7 +20,7 @@
         <ng-container matColumnDef="tx_id">
           <th mat-header-cell *matHeaderCellDef mat-sort-header> Transaction ID </th>
           <td mat-cell *matCellDef="let utxo">
-            <span fxLayout="row" class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '12rem' : '25rem'}">
+            <span fxLayout="row" class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}">
               <span class="ellipsis-child">{{utxo.outpoint.txid_str}}</span>
             </span>
           </td>
@@ -34,8 +34,24 @@
         <ng-container matColumnDef="label">
           <th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> Label </th>
           <td mat-cell *matCellDef="let utxo" class="pl-1">
-            <span fxLayout="row" class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '12rem' : '25rem'}">
-              <span class="ellipsis-child">{{utxo?.label}}</span>
+            <span fxLayout="row" class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}">
+              <span class="ellipsis-child">{{utxo.label}}</span>
+            </span>            
+          </td>
+        </ng-container>
+        <ng-container matColumnDef="address_type">
+          <th mat-header-cell *matHeaderCellDef mat-sort-header> Address Type </th>
+          <td mat-cell *matCellDef="let utxo">
+            <div fxLayout="row" fxLayoutAlign="start center">
+              {{addressType[utxo.address_type].name}} 
+            </div>
+          </td>
+        </ng-container>
+        <ng-container matColumnDef="address">
+          <th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> Address </th>
+          <td mat-cell *matCellDef="let utxo" class="pl-1">
+            <span fxLayout="row" class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}">
+              <span class="ellipsis-child">{{utxo?.address}}</span>
             </span>            
           </td>
         </ng-container>

src/app/lnd/on-chain/utxo-tables/utxos/utxos.component.scss

@@ -2,12 +2,11 @@
   width: 2rem;
 }
 
-.mat-column-label, .mat-column-tx_id {
-  flex: 1 1 15%;
-  & .ellipsis-child {
-    white-space: nowrap;
-    overflow: hidden;  
-    text-overflow: ellipsis;
+.mat-column-label, .mat-column-tx_id, .mat-column-address {
+  flex: 0 0 15%;
+  width: 15%;
+  & .ellipsis-parent {
+    display: flex;
   }
 }
 

src/app/shared/services/consts-enums-functions.ts

@@ -145,7 +145,8 @@ export const WALLET_ADDRESS_TYPE = {
   WITNESS_PUBKEY_HASH: { name: 'Witness Pubkey Hash', tooltip: '' },
   NESTED_PUBKEY_HASH: { name: 'Nested Pubkey Hash', tooltip: '' },
   UNUSED_WITNESS_PUBKEY_HASH: { name: 'Unused Witness Pubkey Hash', tooltip: '' },
-  UNUSED_NESTED_PUBKEY_HASH: { name: 'Unused Nested Pubkey Hash', tooltip: '' }
+  UNUSED_NESTED_PUBKEY_HASH: { name: 'Unused Nested Pubkey Hash', tooltip: '' },
+  TAPROOT_PUBKEY: { name: 'Taproot Pubkey Hash', tooltip: '' }
 };
 
 export enum CLNFailReason {
@@ -932,16 +933,16 @@ export const LND_DEFAULT_PAGE_SETTINGS: PageSettings[] = [
 export const LND_TABLES_DEF = {
   on_chain: {
     utxos: {
-      maxColumns: 5,
-      allowedColumns: ['tx_id', 'output', 'label', 'amount_sat', 'confirmations']
+      maxColumns: 7,
+      allowedColumns: ['tx_id', 'output', 'label', 'address_type', 'address', 'amount_sat', 'confirmations']
     },
     transactions: {
       maxColumns: 7,
       allowedColumns: ['time_stamp', 'label', 'amount', 'total_fees', 'block_height', 'num_confirmations']
     },
     dust_utxos: {
-      maxColumns: 5,
-      allowedColumns: ['tx_id', 'output', 'label', 'amount_sat', 'confirmations']
+      maxColumns: 7,
+      allowedColumns: ['tx_id', 'output', 'label', 'address_type', 'address', 'amount_sat', 'confirmations']
     }
   },
   peers_channels: {