Link channels from Transaction page.

frontend/src/app/components/address-labels/address-labels.component.html

@@ -1,4 +1,13 @@
-<span
-  *ngIf="label"
-  class="badge badge-pill badge-warning"
->{{ label }}</span>
+<a *ngIf="channel; else default" [routerLink]="['/lightning/channel' | relativeUrl, channel.id]">
+  <span
+    *ngIf="label"
+    class="badge badge-pill badge-warning"
+  >{{ label }}</span>
+</a>
+
+<ng-template #default>
+  <span
+    *ngIf="label"
+    class="badge badge-pill badge-warning"
+  >{{ label }}</span>
+</ng-template>

frontend/src/app/components/address-labels/address-labels.component.ts

@@ -1,4 +1,4 @@
-import { Component, OnInit, ChangeDetectionStrategy, Input } from '@angular/core';
+import { Component, ChangeDetectionStrategy, Input, OnChanges } from '@angular/core';
 import { Vin, Vout } from '../../interfaces/electrs.interface';
 import { StateService } from 'src/app/services/state.service';
 
@@ -8,11 +8,12 @@ import { StateService } from 'src/app/services/state.service';
   styleUrls: ['./address-labels.component.scss'],
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
-export class AddressLabelsComponent implements OnInit {
+export class AddressLabelsComponent implements OnChanges {
   network = '';
 
   @Input() vin: Vin;
   @Input() vout: Vout;
+  @Input() channel: any;
 
   label?: string;
 
@@ -22,14 +23,20 @@ export class AddressLabelsComponent implements OnInit {
     this.network = stateService.network;
   }
 
-  ngOnInit() {
-    if (this.vin) {
+  ngOnChanges() {
+    if (this.channel) {
+      this.handleChannel();
+    } else if (this.vin) {
       this.handleVin();
     } else if (this.vout) {
       this.handleVout();
     }
   }
 
+  handleChannel() {
+    this.label = `Channel open: ${this.channel.alias_left} <> ${this.channel.alias_right}`;
+  }
+
   handleVin() {
     if (this.vin.inner_witnessscript_asm) {
       if (this.vin.inner_witnessscript_asm.indexOf('OP_DEPTH OP_PUSHNUM_12 OP_EQUAL OP_IF OP_PUSHNUM_11') === 0) {