Channel component

frontend/src/app/shared/components/sats/sats.component.html

@@ -0,0 +1,5 @@
+‎{{ addPlus && satoshis >= 0 ? '+' : '' }}{{ satoshis | number }}
+<span class="symbol"><ng-template [ngIf]="network === 'liquid'">L-</ng-template>
+<ng-template [ngIf]="network === 'liquidtestnet'">tL-</ng-template>
+<ng-template [ngIf]="network === 'testnet'">t-</ng-template>
+<ng-template [ngIf]="network === 'signet'">s-</ng-template>sats</span>

frontend/src/app/shared/components/sats/sats.component.ts

@@ -0,0 +1,32 @@
+import { Component, Input, OnInit } from '@angular/core';
+import { Subscription } from 'rxjs';
+import { StateService } from '../../../services/state.service';
+
+@Component({
+  selector: 'app-sats',
+  templateUrl: './sats.component.html',
+  styleUrls: ['./sats.component.scss']
+})
+export class SatsComponent implements OnInit {
+  @Input() satoshis: number;
+  @Input() digitsInfo = 0;
+  @Input() addPlus = false;
+
+  network = '';
+  stateSubscription: Subscription;
+
+  constructor(
+    private stateService: StateService,
+  ) { }
+
+  ngOnInit() {
+    this.stateSubscription = this.stateService.networkChanged$.subscribe((network) => this.network = network);
+  }
+
+  ngOnDestroy() {
+    if (this.stateSubscription) {
+      this.stateSubscription.unsubscribe();
+    }
+  }
+
+}

frontend/src/app/shared/shared.module.ts

@@ -74,6 +74,7 @@ import { LoadingIndicatorComponent } from '../components/loading-indicator/loadi
 import { IndexingProgressComponent } from '../components/indexing-progress/indexing-progress.component';
 import { SvgImagesComponent } from '../components/svg-images/svg-images.component';
 import { ChangeComponent } from '../components/change/change.component';
+import { SatsComponent } from './components/sats/sats.component';
 
 @NgModule({
   declarations: [
@@ -142,6 +143,7 @@ import { ChangeComponent } from '../components/change/change.component';
     IndexingProgressComponent,
     SvgImagesComponent,
     ChangeComponent,
+    SatsComponent,
   ],
   imports: [
     CommonModule,
@@ -238,6 +240,7 @@ import { ChangeComponent } from '../components/change/change.component';
     IndexingProgressComponent,
     SvgImagesComponent,
     ChangeComponent,
+    SatsComponent
   ]
 })
 export class SharedModule {