diff --git a/frontend/src/app/components/blockchain-blocks/blockchain-blocks.component.html b/frontend/src/app/components/blockchain-blocks/blockchain-blocks.component.html
index 2224ec0bf..ac29524bb 100644
--- a/frontend/src/app/components/blockchain-blocks/blockchain-blocks.component.html
+++ b/frontend/src/app/components/blockchain-blocks/blockchain-blocks.component.html
@@ -40,12 +40,14 @@
-
+
+
diff --git a/frontend/src/app/components/blockchain-blocks/blockchain-blocks.component.ts b/frontend/src/app/components/blockchain-blocks/blockchain-blocks.component.ts
index 760e9261d..02591f657 100644
--- a/frontend/src/app/components/blockchain-blocks/blockchain-blocks.component.ts
+++ b/frontend/src/app/components/blockchain-blocks/blockchain-blocks.component.ts
@@ -1,5 +1,5 @@
import { Component, OnInit, OnDestroy, ChangeDetectionStrategy, ChangeDetectorRef, Input, OnChanges, SimpleChanges } from '@angular/core';
-import { Observable, Subscription } from 'rxjs';
+import { BehaviorSubject, Observable, Subscription } from 'rxjs';
import { StateService } from '../../services/state.service';
import { specialBlocks } from '../../app.constants';
import { BlockExtended } from '../../interfaces/node-api.interface';
@@ -45,6 +45,7 @@ export class BlockchainBlocksComponent implements OnInit, OnChanges, OnDestroy {
markBlockSubscription: Subscription;
txConfirmedSubscription: Subscription;
loadingBlocks$: Observable;
+ showMiningInfo$: BehaviorSubject = new BehaviorSubject(false);
blockStyles = [];
emptyBlockStyles = [];
interval: any;
@@ -54,7 +55,6 @@ export class BlockchainBlocksComponent implements OnInit, OnChanges, OnDestroy {
arrowLeftPx = 30;
blocksFilled = false;
arrowTransition = '1s';
- showMiningInfo = false;
timeLtrSubscription: Subscription;
timeLtr: boolean;
@@ -80,8 +80,11 @@ export class BlockchainBlocksComponent implements OnInit, OnChanges, OnDestroy {
}
enabledMiningInfoIfNeeded(url) {
- this.showMiningInfo = url.includes('/mining') || url.includes('/acceleration');
- this.cd.markForCheck(); // Need to update the view asap
+ const urlParts = url.split('/');
+ const onDashboard = ['','testnet','signet','mining','acceleration'].includes(urlParts[urlParts.length - 1]);
+ if (onDashboard) { // Only update showMiningInfo if we are on the main, mining or acceleration dashboards
+ this.stateService.showMiningInfo$.next(url.includes('/mining') || url.includes('/acceleration'));
+ }
}
ngOnInit() {
@@ -90,6 +93,7 @@ export class BlockchainBlocksComponent implements OnInit, OnChanges, OnDestroy {
if (['', 'testnet', 'signet'].includes(this.stateService.network)) {
this.enabledMiningInfoIfNeeded(this.location.path());
this.location.onUrlChange((url) => this.enabledMiningInfoIfNeeded(url));
+ this.showMiningInfo$ = this.stateService.showMiningInfo$;
}
this.timeLtrSubscription = this.stateService.timeLtr.subscribe((ltr) => {
diff --git a/frontend/src/app/components/mempool-blocks/mempool-blocks.component.ts b/frontend/src/app/components/mempool-blocks/mempool-blocks.component.ts
index 111491f94..016798777 100644
--- a/frontend/src/app/components/mempool-blocks/mempool-blocks.component.ts
+++ b/frontend/src/app/components/mempool-blocks/mempool-blocks.component.ts
@@ -60,6 +60,7 @@ export class MempoolBlocksComponent implements OnInit, OnChanges, OnDestroy {
showMiningInfo = false;
timeLtrSubscription: Subscription;
timeLtr: boolean;
+ showMiningInfoSubscription: Subscription;
animateEntry: boolean = false;
blockOffset: number = 155;
@@ -89,11 +90,6 @@ export class MempoolBlocksComponent implements OnInit, OnChanges, OnDestroy {
private location: Location,
) { }
- enabledMiningInfoIfNeeded(url) {
- this.showMiningInfo = url.includes('/mining') || url.includes('/acceleration');
- this.cd.markForCheck(); // Need to update the view asap
- }
-
ngOnInit() {
this.chainTip = this.stateService.latestBlockHeight;
@@ -102,8 +98,10 @@ export class MempoolBlocksComponent implements OnInit, OnChanges, OnDestroy {
this.widthChange.emit(this.mempoolWidth);
if (['', 'testnet', 'signet'].includes(this.stateService.network)) {
- this.enabledMiningInfoIfNeeded(this.location.path());
- this.location.onUrlChange((url) => this.enabledMiningInfoIfNeeded(url));
+ this.showMiningInfoSubscription = this.stateService.showMiningInfo$.subscribe((showMiningInfo) => {
+ this.showMiningInfo = showMiningInfo;
+ this.cd.markForCheck();
+ });
}
this.timeLtrSubscription = this.stateService.timeLtr.subscribe((ltr) => {
@@ -269,6 +267,7 @@ export class MempoolBlocksComponent implements OnInit, OnChanges, OnDestroy {
this.chainTipSubscription.unsubscribe();
this.keySubscription.unsubscribe();
this.isTabHiddenSubscription.unsubscribe();
+ this.showMiningInfoSubscription.unsubscribe();
clearTimeout(this.resetTransitionTimeout);
}
diff --git a/frontend/src/app/services/state.service.ts b/frontend/src/app/services/state.service.ts
index 9a591452e..f9de61b69 100644
--- a/frontend/src/app/services/state.service.ts
+++ b/frontend/src/app/services/state.service.ts
@@ -151,6 +151,7 @@ export class StateService {
hideAudit: BehaviorSubject;
fiatCurrency$: BehaviorSubject;
rateUnits$: BehaviorSubject;
+ showMiningInfo$: BehaviorSubject = new BehaviorSubject(false);
searchFocus$: Subject = new Subject();
menuOpen$: BehaviorSubject = new BehaviorSubject(false);