Merge branch 'master' into mononaut/first-seen-tooltip

frontend/src/app/components/incoming-transactions-graph/incoming-transactions-graph.component.ts

@@ -265,8 +265,8 @@ export class IncomingTransactionsGraphComponent implements OnInit, OnChanges, On
         type: 'value',
         axisLabel: {
           fontSize: 11,
-          formatter: (value) => {
-            return this.weightMode ? value * 4 : value;
+          formatter: (value): string => {
+            return this.weightMode ? (value * 4).toString() : value.toString();
           }
         },
         splitLine: {

frontend/src/app/components/mempool-blocks/mempool-blocks.component.html

@@ -20,10 +20,12 @@
                 -
                 <app-fee-rate [fee]="projectedBlock.feeRange[projectedBlock.feeRange.length - 1]" rounding="1.0-0" unitClass=""></app-fee-rate>
               </div>
-              <div *ngIf="showMiningInfo" class="block-size">
+              <div *ngIf="showMiningInfo$ | async; else noMiningInfo" class="block-size">
                 <app-amount [attr.data-cy]="'mempool-block-' + i + '-total-fees'" [satoshis]="projectedBlock.totalFees" digitsInfo="1.2-3" [noFiat]="true"></app-amount>
               </div>
-              <div *ngIf="!showMiningInfo" class="block-size" [innerHTML]="'&lrm;' + (projectedBlock.blockSize | bytes: 2)"></div>
+              <ng-template #noMiningInfo>
+                <div class="block-size" [innerHTML]="'&lrm;' + (projectedBlock.blockSize | bytes: 2)"></div>
+              </ng-template>
               <div [attr.data-cy]="'mempool-block-' + i + '-transaction-count'" class="transaction-count">
                 <ng-container *ngTemplateOutlet="projectedBlock.nTx === 1 ? transactionsSingular : transactionsPlural; context: {$implicit: projectedBlock.nTx | number}"></ng-container>
                 <ng-template #transactionsSingular let-i i18n="shared.transaction-count.singular">{{ i }} transaction</ng-template>

frontend/src/app/components/mempool-blocks/mempool-blocks.component.ts

@@ -1,5 +1,5 @@
 import { Component, OnInit, OnDestroy, ChangeDetectionStrategy, ChangeDetectorRef, HostListener, Input, OnChanges, SimpleChanges, Output, EventEmitter } from '@angular/core';
-import { Subscription, Observable, of, combineLatest } from 'rxjs';
+import { Subscription, Observable, of, combineLatest, BehaviorSubject } from 'rxjs';
 import { MempoolBlock } from '../../interfaces/websocket.interface';
 import { StateService } from '../../services/state.service';
 import { Router } from '@angular/router';
@@ -42,6 +42,7 @@ export class MempoolBlocksComponent implements OnInit, OnChanges, OnDestroy {
   mempoolBlocks$: Observable<MempoolBlock[]>;
   difficultyAdjustments$: Observable<DifficultyAdjustment>;
   loadingBlocks$: Observable<boolean>;
+  showMiningInfo$: BehaviorSubject<boolean> = new BehaviorSubject<boolean>(false);
   blocksSubscription: Subscription;
 
   mempoolBlocksFull: MempoolBlock[] = [];
@@ -57,10 +58,8 @@ export class MempoolBlocksComponent implements OnInit, OnChanges, OnDestroy {
   network = '';
   now = new Date().getTime();
   timeOffset = 0;
-  showMiningInfo = false;
   timeLtrSubscription: Subscription;
   timeLtr: boolean;
-  showMiningInfoSubscription: Subscription;
   animateEntry: boolean = false;
 
   blockOffset: number = 155;
@@ -98,10 +97,7 @@ export class MempoolBlocksComponent implements OnInit, OnChanges, OnDestroy {
     this.widthChange.emit(this.mempoolWidth);
 
     if (['', 'testnet', 'signet'].includes(this.stateService.network)) {
-      this.showMiningInfoSubscription = this.stateService.showMiningInfo$.subscribe((showMiningInfo) => {
-        this.showMiningInfo = showMiningInfo;
-        this.cd.markForCheck();
-      });
+      this.showMiningInfo$ = this.stateService.showMiningInfo$;
     }
 
     this.timeLtrSubscription = this.stateService.timeLtr.subscribe((ltr) => {
@@ -267,7 +263,6 @@ export class MempoolBlocksComponent implements OnInit, OnChanges, OnDestroy {
     this.chainTipSubscription.unsubscribe();
     this.keySubscription.unsubscribe();
     this.isTabHiddenSubscription.unsubscribe();
-    this.showMiningInfoSubscription.unsubscribe();
     clearTimeout(this.resetTransitionTimeout);
   }
 

frontend/src/app/components/mempool-graph/mempool-graph.component.ts

@@ -411,7 +411,6 @@ export class MempoolGraphComponent implements OnInit, OnChanges {
             padding: [20, 0, 0, 0],
           },
           type: 'time',
-          boundaryGap: false,
           axisLine: { onZero: true },
           axisLabel: {
             margin: 20,

frontend/src/app/components/menu/menu.component.html

@@ -6,7 +6,7 @@
         <span class="menu-click text-nowrap ellipsis">
           <strong>
             <span *ngIf="user.username.includes('@'); else usernamenospace">{{ user.username }}</span>
-            <ng-template #usernamenospace>@{{ user.username }}</ng-template>
+            <ng-template #usernamenospace>&#64;{{ user.username }}</ng-template>
           </strong>
         </span>
         <span class="badge mr-1 badge-og" *ngIf="user.ogRank">

frontend/src/app/components/trademark-policy/trademark-policy.component.html

@@ -326,7 +326,7 @@
 
           <br>
 
-          <p>If you have any questions about this Policy, would like to speak with us about the use of our Marks in ways not described in the Policy, or see any abuse of our Marks, please email us at &lt;legal@mempool.space&gt;</p>
+          <p>If you have any questions about this Policy, would like to speak with us about the use of our Marks in ways not described in the Policy, or see any abuse of our Marks, please email us at &lt;legal&#64;mempool.space&gt;</p>
 
         </ol>
 

frontend/src/app/services/http-cache.interceptor.ts

@@ -1,8 +1,8 @@
-import { Inject, Injectable, PLATFORM_ID } from '@angular/core';
+import { Inject, Injectable, PLATFORM_ID, makeStateKey, TransferState } from '@angular/core';
 import { HttpInterceptor, HttpEvent, HttpRequest, HttpHandler, HttpResponse, HttpErrorResponse, HttpHeaders } from '@angular/common/http';
 import { Observable, of } from 'rxjs';
 import { catchError, tap } from 'rxjs/operators';
-import { TransferState, makeStateKey } from '@angular/platform-browser';
+
 import { isPlatformBrowser } from '@angular/common';
 
 @Injectable()