Merge branch 'master' into mononaut/preview-miner-tag-style

frontend/src/app/components/block-overview-graph/block-overview-graph.component.ts

@@ -77,6 +77,8 @@ export class BlockOverviewGraphComponent implements AfterViewInit, OnDestroy, On
       cancelAnimationFrame(this.animationFrameRequest);
       clearTimeout(this.animationHeartBeat);
     }
+    this.canvas.nativeElement.removeEventListener('webglcontextlost', this.handleContextLost);
+    this.canvas.nativeElement.removeEventListener('webglcontextrestored', this.handleContextRestored);
   }
 
   clear(direction): void {

frontend/src/app/components/transactions-list/transactions-list.component.ts

@@ -91,6 +91,9 @@ export class TransactionsListComponent implements OnInit, OnChanges {
             filter(() => this.stateService.env.LIGHTNING),
             switchMap((txIds) => this.apiService.getChannelByTxIds$(txIds)),
             tap((channels) => {
+              if (!this.transactions) {
+                return;
+              }
               const transactions = this.transactions.filter((tx) => !tx._channels);
               channels.forEach((channel, i) => {
                 transactions[i]._channels = channel;

frontend/src/app/components/tx-bowtie-graph/tx-bowtie-graph.component.html

@@ -88,7 +88,7 @@
         <stop offset="100%" stop-color="transparent" />
       </linearGradient>
     </defs>
-    <path [attr.d]="middle.path" class="line middle" [style]="middle.style"/>
+    <path *ngIf="hasLine" [attr.d]="middle.path" class="line middle" [style]="middle.style"/>
     <ng-container *ngFor="let input of inputs; let i = index">
       <path *ngIf="connectors && !inputData[i].coinbase && !inputData[i].pegin"
         [attr.d]="input.connectorPath"
@@ -106,7 +106,7 @@
         (pointerout)="onBlur($event, 'input', i);"
         (click)="onClick($event, 'input', inputData[i].index);"
       />
-      <path
+      <path *ngIf="!input.zeroValue"
         [attr.d]="input.path"
         class="line {{input.class}}"
         [class.highlight]="inputIndex != null && inputData[i].index === inputIndex"
@@ -116,6 +116,16 @@
         (pointerout)="onBlur($event, 'input', i);"
         (click)="onClick($event, 'input', inputData[i].index);"
       />
+      <path *ngIf="input.zeroValue"
+        [attr.d]="input.path"
+        class="line {{input.class}} zerovalue"
+        [class.highlight]="inputIndex != null && inputData[i].index === inputIndex"
+        [class.zerovalue]="input.zeroValue"
+        [style]="input.style"
+        (pointerover)="onHover($event, 'input', i);"
+        (pointerout)="onBlur($event, 'input', i);"
+        (click)="onClick($event, 'input', inputData[i].index);"
+      />
     </ng-container>
     <ng-container *ngFor="let output of outputs; let i = index">
       <path *ngIf="connectors && outspends[outputData[i].index]?.spent"

frontend/src/app/components/tx-bowtie-graph/tx-bowtie-graph.component.ts

@@ -68,6 +68,7 @@ export class TxBowtieGraphComponent implements OnInit, OnChanges {
   outspends: Outspend[] = [];
   zeroValueWidth = 60;
   zeroValueThickness = 20;
+  hasLine: boolean;
 
   outspendsSubscription: Subscription;
   refreshOutspends$: ReplaySubject<string> = new ReplaySubject();
@@ -162,7 +163,7 @@ export class TxBowtieGraphComponent implements OnInit, OnChanges {
     let truncatedInputs = this.tx.vin.map((v, i) => {
       return {
         type: 'input',
-        value: v?.prevout?.value,
+        value: v?.prevout?.value || (v?.is_coinbase && !totalValue ? 0 : undefined),
         txid: v.txid,
         vout: v.vout,
         address: v?.prevout?.scriptpubkey_address || v?.prevout?.scriptpubkey_type?.toUpperCase(),
@@ -198,6 +199,9 @@ export class TxBowtieGraphComponent implements OnInit, OnChanges {
       path: `M ${(this.width / 2) - this.midWidth} ${(this.height / 2) + 0.5} L ${(this.width / 2) + this.midWidth} ${(this.height / 2) + 0.5}`,
       style: `stroke-width: ${this.combinedWeight + 1}; stroke: ${this.gradient[1]}`
     };
+
+    this.hasLine = this.inputs.reduce((line, put) => line || !put.zeroValue, false)
+      && this.outputs.reduce((line, put) => line || !put.zeroValue, false);
   }
 
   calcTotalValue(tx: Transaction): number {
@@ -278,6 +282,9 @@ export class TxBowtieGraphComponent implements OnInit, OnChanges {
     lineParams.forEach((line, i) => {
       if (xputs[i].value === 0) {
         line.outerY = lastOuter + (this.zeroValueThickness / 2);
+        if (xputs.length === 1) {
+          line.outerY = (this.height / 2);
+        }
         lastOuter += this.zeroValueThickness + spacing;
         return;
       }

frontend/src/app/lightning/nodes-networks-chart/nodes-networks-chart.component.ts

@@ -118,7 +118,7 @@ export class NodesNetworksChartComponent implements OnInit {
           color: 'grey',
           fontSize: 15
         },
-        text: $localize`Indexing in progess`,
+        text: $localize`Indexing in progress`,
         left: 'center',
         top: 'center',
       };

frontend/src/app/lightning/statistics-chart/lightning-statistics-chart.component.ts

@@ -109,7 +109,7 @@ export class LightningStatisticsChartComponent implements OnInit {
           color: 'grey',
           fontSize: 15
         },
-        text: $localize`Indexing in progess`,
+        text: $localize`Indexing in progress`,
         left: 'center',
         top: 'center'
       };