From 5086f132f8dad3dfc0cf3eb3ba9dca17a0a86f45 Mon Sep 17 00:00:00 2001
From: nymkappa <vialjoris@hotmail.com>
Date: Sun, 4 Sep 2022 19:12:01 +0200
Subject: [PATCH 1/2] If a channel is closed, show closing date instead of last
 update

---
 backend/src/api/explorer/channels.api.ts               |  1 +
 .../src/app/lightning/channel/channel.component.html   | 10 +++++++---
 2 files changed, 8 insertions(+), 3 deletions(-)

diff --git a/backend/src/api/explorer/channels.api.ts b/backend/src/api/explorer/channels.api.ts
index b396e4808..6b4a8d02c 100644
--- a/backend/src/api/explorer/channels.api.ts
+++ b/backend/src/api/explorer/channels.api.ts
@@ -374,6 +374,7 @@ class ChannelsApi {
       'transaction_vout': channel.transaction_vout,
       'closing_transaction_id': channel.closing_transaction_id,
       'closing_reason': channel.closing_reason,
+      'closing_date': channel.closing_date,
       'updated_at': channel.updated_at,
       'created': channel.created,
       'status': channel.status,
diff --git a/frontend/src/app/lightning/channel/channel.component.html b/frontend/src/app/lightning/channel/channel.component.html
index 2824b8dba..9a0c424fb 100644
--- a/frontend/src/app/lightning/channel/channel.component.html
+++ b/frontend/src/app/lightning/channel/channel.component.html
@@ -25,13 +25,17 @@
           <table class="table table-borderless table-striped">
             <tbody>
               <tr>
-                <td i18n="address.total-sent">Created</td>
+                <td i18n="lightning.created">Created</td>
                 <td><app-timestamp [dateString]="channel.created"></app-timestamp></td>
               </tr>
-              <tr>
-                <td i18n="address.total-sent">Last update</td>
+              <tr *ngIf="channel.status !== 2">
+                <td i18n="lightning.last-update">Last update</td>
                 <td><app-timestamp [dateString]="channel.updated_at"></app-timestamp></td>
               </tr>
+              <tr *ngIf="channel.status === 2">
+                <td i18n="lightning.closing_date">Closing date</td>
+                <td><app-timestamp [dateString]="channel.closing_date"></app-timestamp></td>
+              </tr>
             </tbody>
           </table>
         </div>

From 5389928c49cb2998e829137b4b380c80e4f8336c Mon Sep 17 00:00:00 2001
From: nymkappa <vialjoris@hotmail.com>
Date: Sun, 4 Sep 2022 19:39:28 +0200
Subject: [PATCH 2/2] Show closing date in closed channel list

---
 .../channels-list/channels-list.component.html        |  8 ++++++--
 .../components/timestamp/timestamp.component.html     | 11 +++++++----
 .../components/timestamp/timestamp.component.ts       |  6 ++----
 3 files changed, 15 insertions(+), 10 deletions(-)

diff --git a/frontend/src/app/lightning/channels-list/channels-list.component.html b/frontend/src/app/lightning/channels-list/channels-list.component.html
index af87cefa4..a51e03ef8 100644
--- a/frontend/src/app/lightning/channels-list/channels-list.component.html
+++ b/frontend/src/app/lightning/channels-list/channels-list.component.html
@@ -35,7 +35,8 @@
     <th class="alias text-left" i18n="nodes.alias">Node Alias</th>
     <th class="alias text-left d-none d-md-table-cell" i18n="channels.transaction">&nbsp;</th>
     <th class="alias text-left d-none d-md-table-cell" i18n="status">Status</th>
-    <th class="channels text-left d-none d-md-table-cell" i18n="channels.rate">Fee Rate</th>
+    <th *ngIf="status !== 'closed'" class="channels text-left d-none d-md-table-cell" i18n="channels.rate">Fee Rate</th>
+    <th *ngIf="status === 'closed'" class="channels text-left d-none d-md-table-cell" i18n="channels.closing_date">Closing date</th>
     <th class="capacity text-right d-none d-md-table-cell" i18n="nodes.capacity">Capacity</th>
     <th class="capacity text-right" i18n="channels.id">Channel ID</th>
   </thead>
@@ -71,9 +72,12 @@
       </ng-template>
     </ng-template>
   </td>
-  <td class="capacity text-left d-none d-md-table-cell">
+  <td *ngIf="status !== 'closed'" class="capacity text-left d-none d-md-table-cell">
     {{ channel.fee_rate }} <span class="symbol">ppm ({{ channel.fee_rate / 10000 | number }}%)</span>
   </td>
+  <td *ngIf="status === 'closed'" class="capacity text-left d-none d-md-table-cell">
+    <app-timestamp [unixTime]="channel.closing_date"></app-timestamp>
+  </td>
   <td class="capacity text-right d-none d-md-table-cell">
     <app-amount *ngIf="channel.capacity > 100000000; else smallchannel" [satoshis]="channel.capacity" [digitsInfo]="'1.2-2'" [noFiat]="true"></app-amount>
     <ng-template #smallchannel>
diff --git a/frontend/src/app/shared/components/timestamp/timestamp.component.html b/frontend/src/app/shared/components/timestamp/timestamp.component.html
index 769b292d4..69abce53f 100644
--- a/frontend/src/app/shared/components/timestamp/timestamp.component.html
+++ b/frontend/src/app/shared/components/timestamp/timestamp.component.html
@@ -1,4 +1,7 @@
-&lrm;{{ seconds * 1000 | date: customFormat ?? 'yyyy-MM-dd HH:mm' }}
-<div class="lg-inline">
-  <i class="symbol">(<app-time-since [time]="seconds" [fastRender]="true"></app-time-since>)</i>
-</div>
+<span *ngIf="seconds === undefined">-</span>
+<span *ngIf="seconds !== undefined">
+  &lrm;{{ seconds * 1000 | date: customFormat ?? 'yyyy-MM-dd HH:mm' }}
+  <div class="lg-inline">
+    <i class="symbol">(<app-time-since [time]="seconds" [fastRender]="true"></app-time-since>)</i>
+  </div>
+</span>
diff --git a/frontend/src/app/shared/components/timestamp/timestamp.component.ts b/frontend/src/app/shared/components/timestamp/timestamp.component.ts
index dc577a185..120a5dfe4 100644
--- a/frontend/src/app/shared/components/timestamp/timestamp.component.ts
+++ b/frontend/src/app/shared/components/timestamp/timestamp.component.ts
@@ -11,15 +11,13 @@ export class TimestampComponent implements OnChanges {
   @Input() dateString: string;
   @Input() customFormat: string;
 
-  seconds: number;
-
-  constructor() { }
+  seconds: number | undefined = undefined;
 
   ngOnChanges(): void {
     if (this.unixTime) {
       this.seconds = this.unixTime;
     } else if (this.dateString) {
-      this.seconds  = new Date(this.dateString).getTime() / 1000
+      this.seconds = new Date(this.dateString).getTime() / 1000;
     }
   }