From aa1519c18eb06c0917fefb84940583126a3cf37c Mon Sep 17 00:00:00 2001
From: nymkappa <vialjoris@hotmail.com>
Date: Thu, 8 Sep 2022 18:56:25 +0200
Subject: [PATCH 1/2] Show zero base fee tag on channels

---
 .../channel-box/channel-box.component.html    | 103 +++++++++++-------
 .../app/shared/pipes/amount-shortener.pipe.ts |   3 +-
 2 files changed, 68 insertions(+), 38 deletions(-)

diff --git a/frontend/src/app/lightning/channel/channel-box/channel-box.component.html b/frontend/src/app/lightning/channel/channel-box/channel-box.component.html
index 8b486eff5..4a421480d 100644
--- a/frontend/src/app/lightning/channel/channel-box/channel-box.component.html
+++ b/frontend/src/app/lightning/channel/channel-box/channel-box.component.html
@@ -11,44 +11,73 @@
     <div class="second-line"><app-amount [satoshis]="channel.capacity" digitsInfo="1.2-2"></app-amount></div>
   </div>
 </div>
-<div class="box">
 
-  <div class="col-md">
-    <table class="table table-borderless table-striped">
-      <tbody>
-        <tr>
-          <td i18n="address.total-sent">Fee rate</td>
-          <td>
-            {{ channel.fee_rate ?? '-' }} <span class="symbol">ppm ({{ channel.fee_rate / 10000 | number }}%)</span>
-          </td>
-        </tr>
-        <tr>
-          <td i18n="address.total-sent">Base fee</td>
-          <td>
-            <app-sats [valueOverride]="!channel.base_fee_mtokens ? '- ' : undefined" [satoshis]="channel.base_fee_mtokens / 1000" digitsInfo="1.0-2"></app-sats>
-          </td>
-        </tr>
-        <tr>
-          <td i18n="address.total-sent">Min HTLC</td>
-          <td>
-            <app-sats [valueOverride]="!channel.min_htlc_mtokens ? '- ' : undefined" [satoshis]="channel.min_htlc_mtokens / 1000"></app-sats>
-          </td>
-        </tr>
-        <tr>
-          <td i18n="address.total-sent">Max HTLC</td>
-          <td>
-            <app-sats [valueOverride]="!channel.max_htlc_mtokens ? '- ' : undefined" [satoshis]="channel.max_htlc_mtokens / 1000"></app-sats>
-          </td>
-        </tr>
-        <tr>
-          <td i18n="address.total-sent">Timelock delta</td>
-          <td>
-            <ng-container *ngTemplateOutlet="blocksPlural; context: {$implicit: channel.cltv_delta ?? '-' }"></ng-container>
-          </td>
-        </tr>
-      </tbody>
-    </table>
-  </div>
+<div class="box">
+  <table class="table table-borderless table-striped">
+    <tbody>
+      <tr>
+        <td i18n="lightning.fee-rate">Fee rate</td>
+        <td>
+          <span class="d-inline-block d-md-none">
+            {{ channel.fee_rate !== null ? (channel.fee_rate | amountShortener : 2 : undefined : true) : '-' }} <span class="symbol">ppm ({{ channel.fee_rate !== null ? '(' + (channel.fee_rate / 10000 | amountShortener : 2 : undefined : true) + '%)' : '' }}</span>
+          </span>
+          <span class="d-none d-md-inline-block">
+            {{ channel.fee_rate !== null ? (channel.fee_rate | number) : '-' }} <span class="symbol">ppm {{ channel.fee_rate !== null ? '(' + (channel.fee_rate / 10000 | number) + '%)' : '' }}</span>
+          </span>
+        </td>
+      </tr>
+      <tr>
+        <td i18n="lightning.base-fee">Base fee</td>
+        <td>
+          <div class="d-inline-block d-md-none w-100">
+            <span class="d-flex justify-content-between align-items-center">
+              <span>
+                {{ channel.base_fee_mtokens !== null ? (channel.base_fee_mtokens / 1000 | amountShortener : 2 : undefined : true) : '-' }}
+                <span class="symbol">sats</span>
+              </span>
+              <span *ngIf="channel.base_fee_mtokens !== null" class="badge" [class]="channel.base_fee_mtokens === 0 ? 'badge-success' : 'badge-danger'"
+                i18n-ngbTooltip="lightning.zero-base-fee"
+                [ngbTooltip]="channel.base_fee_mtokens === 0 ? 'This channel supports zero base fee routing' :
+                  'This channel does not support zero base fee routing'"
+                placement="bottom" i18n="lightning.zerobasefee">
+                Zero base fee
+              </span>
+            </span>
+          </div>
+          <div class="d-none d-md-inline-block w-100">
+            <span class="d-flex justify-content-between align-items-center">
+              <app-sats [valueOverride]="channel.min_htlc_mtokens === null ? '- ' : undefined" [satoshis]="channel.base_fee_mtokens / 1000" digitsInfo="1.0-0"></app-sats>
+              <span *ngIf="channel.base_fee_mtokens !== null" class="badge" [class]="channel.base_fee_mtokens === 0 ? 'badge-success' : 'badge-danger'"
+                i18n-ngbTooltip="lightning.zero-base-fee"
+                [ngbTooltip]="channel.base_fee_mtokens === 0 ? 'This channel supports zero base fee routing' :
+                  'This channel does not support zero base fee routing'"
+                placement="bottom" i18n="lightning.zerobasefee">
+                  Zero base fee
+              </span>
+            </span>
+          </div>
+        </td>
+      </tr>
+      <tr>
+        <td i18n="lightning.min-htlc">Min HTLC</td>
+        <td>
+          <app-sats [valueOverride]="channel.min_htlc_mtokens === null ? '- ' : undefined" [satoshis]="channel.min_htlc_mtokens / 1000"></app-sats>
+        </td>
+      </tr>
+      <tr>
+        <td i18n="lightning.max-htlc">Max HTLC</td>
+        <td>
+          <app-sats [valueOverride]="channel.max_htlc_mtokens === null ? '- ' : undefined" [satoshis]="channel.max_htlc_mtokens / 1000"></app-sats>
+        </td>
+      </tr>
+      <tr>
+        <td i18n="lightning.timelock-detla">Timelock delta</td>
+        <td>
+          <ng-container *ngTemplateOutlet="blocksPlural; context: {$implicit: channel.cltv_delta ?? '-' }"></ng-container>
+        </td>
+      </tr>
+    </tbody>
+  </table>
 </div>
 
 <ng-template #blocksPlural let-i i18n="shared.blocks">{{ i }} <span class="shared-block">blocks</span></ng-template>
diff --git a/frontend/src/app/shared/pipes/amount-shortener.pipe.ts b/frontend/src/app/shared/pipes/amount-shortener.pipe.ts
index db3d94284..71ff76f77 100644
--- a/frontend/src/app/shared/pipes/amount-shortener.pipe.ts
+++ b/frontend/src/app/shared/pipes/amount-shortener.pipe.ts
@@ -7,6 +7,7 @@ export class AmountShortenerPipe implements PipeTransform {
   transform(num: number, ...args: any[]): unknown {
     const digits = args[0] ?? 1;
     const unit = args[1] || undefined;
+    const isMoney = args[2] || false;
 
     if (num < 1000) {
       return num.toFixed(digits);
@@ -16,7 +17,7 @@ export class AmountShortenerPipe implements PipeTransform {
       { value: 1, symbol: '' },
       { value: 1e3, symbol: 'k' },
       { value: 1e6, symbol: 'M' },
-      { value: 1e9, symbol: 'G' },
+      { value: 1e9, symbol: isMoney ? 'B' : 'G' },
       { value: 1e12, symbol: 'T' },
       { value: 1e15, symbol: 'P' },
       { value: 1e18, symbol: 'E' }

From 575a79145e7c70a4c2fd66299e4818ff22c60e88 Mon Sep 17 00:00:00 2001
From: nymkappa <vialjoris@hotmail.com>
Date: Thu, 22 Sep 2022 16:39:57 +0200
Subject: [PATCH 2/2] Show "Non-zero base fee" and fix base fee rounding issue

---
 .../channel-box/channel-box.component.html    | 41 ++++++++-----------
 .../channel-box/channel-box.component.scss    |  6 +++
 2 files changed, 22 insertions(+), 25 deletions(-)

diff --git a/frontend/src/app/lightning/channel/channel-box/channel-box.component.html b/frontend/src/app/lightning/channel/channel-box/channel-box.component.html
index 4a421480d..a61273d4d 100644
--- a/frontend/src/app/lightning/channel/channel-box/channel-box.component.html
+++ b/frontend/src/app/lightning/channel/channel-box/channel-box.component.html
@@ -19,7 +19,7 @@
         <td i18n="lightning.fee-rate">Fee rate</td>
         <td>
           <span class="d-inline-block d-md-none">
-            {{ channel.fee_rate !== null ? (channel.fee_rate | amountShortener : 2 : undefined : true) : '-' }} <span class="symbol">ppm ({{ channel.fee_rate !== null ? '(' + (channel.fee_rate / 10000 | amountShortener : 2 : undefined : true) + '%)' : '' }}</span>
+            {{ channel.fee_rate !== null ? (channel.fee_rate | amountShortener : 2 : undefined : true) : '-' }} <span class="symbol">ppm {{ channel.fee_rate !== null ? '(' + (channel.fee_rate / 10000 | amountShortener : 2 : undefined : true) + '%)' : '' }}</span>
           </span>
           <span class="d-none d-md-inline-block">
             {{ channel.fee_rate !== null ? (channel.fee_rate | number) : '-' }} <span class="symbol">ppm {{ channel.fee_rate !== null ? '(' + (channel.fee_rate / 10000 | number) + '%)' : '' }}</span>
@@ -28,34 +28,25 @@
       </tr>
       <tr>
         <td i18n="lightning.base-fee">Base fee</td>
-        <td>
-          <div class="d-inline-block d-md-none w-100">
-            <span class="d-flex justify-content-between align-items-center">
-              <span>
-                {{ channel.base_fee_mtokens !== null ? (channel.base_fee_mtokens / 1000 | amountShortener : 2 : undefined : true) : '-' }}
-                <span class="symbol">sats</span>
+        <td class="base-fee">
+          <span class="d-flex justify-content-between align-items-center">
+            <span>
+              <span *ngIf="channel.base_fee_mtokens !== null">
+                {{ channel.base_fee_mtokens | amountShortener : 0 }}
+                <span class="symbol">msats</span>
               </span>
-              <span *ngIf="channel.base_fee_mtokens !== null" class="badge" [class]="channel.base_fee_mtokens === 0 ? 'badge-success' : 'badge-danger'"
-                i18n-ngbTooltip="lightning.zero-base-fee"
-                [ngbTooltip]="channel.base_fee_mtokens === 0 ? 'This channel supports zero base fee routing' :
-                  'This channel does not support zero base fee routing'"
-                placement="bottom" i18n="lightning.zerobasefee">
-                Zero base fee
+              <span *ngIf="channel.base_fee_mtokens === null">
+                -
               </span>
             </span>
-          </div>
-          <div class="d-none d-md-inline-block w-100">
-            <span class="d-flex justify-content-between align-items-center">
-              <app-sats [valueOverride]="channel.min_htlc_mtokens === null ? '- ' : undefined" [satoshis]="channel.base_fee_mtokens / 1000" digitsInfo="1.0-0"></app-sats>
-              <span *ngIf="channel.base_fee_mtokens !== null" class="badge" [class]="channel.base_fee_mtokens === 0 ? 'badge-success' : 'badge-danger'"
-                i18n-ngbTooltip="lightning.zero-base-fee"
-                [ngbTooltip]="channel.base_fee_mtokens === 0 ? 'This channel supports zero base fee routing' :
-                  'This channel does not support zero base fee routing'"
-                placement="bottom" i18n="lightning.zerobasefee">
-                  Zero base fee
-              </span>
+            <span *ngIf="channel.base_fee_mtokens !== null" class="badge" [class]="channel.base_fee_mtokens === 0 ? 'badge-success' : 'badge-danger'"
+              i18n-ngbTooltip="lightning.zero-base-fee"
+              [ngbTooltip]="channel.base_fee_mtokens === 0 ? 'This channel supports zero base fee routing' :
+                'This channel does not support zero base fee routing'"
+              placement="bottom" i18n="lightning.zerobasefee">
+              {{ channel.base_fee_mtokens === 0 ? 'Zero base fee' : 'Non-zero base fee' }}
             </span>
-          </div>
+          </span>
         </td>
       </tr>
       <tr>
diff --git a/frontend/src/app/lightning/channel/channel-box/channel-box.component.scss b/frontend/src/app/lightning/channel/channel-box/channel-box.component.scss
index bc7b56f62..f157f380a 100644
--- a/frontend/src/app/lightning/channel/channel-box/channel-box.component.scss
+++ b/frontend/src/app/lightning/channel/channel-box/channel-box.component.scss
@@ -21,4 +21,10 @@
   .box {
     margin-bottom: 20px;
   }
+}
+
+.base-fee {
+  @media (max-width: 768px) {
+    padding-right: 0px;
+  }
 }
\ No newline at end of file