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 1914b5d08..3c85787e7 100644
--- a/frontend/src/app/components/blockchain-blocks/blockchain-blocks.component.html
+++ b/frontend/src/app/components/blockchain-blocks/blockchain-blocks.component.html
@@ -21,7 +21,7 @@
+
diff --git a/frontend/src/app/components/blockchain-blocks/blockchain-blocks.component.scss b/frontend/src/app/components/blockchain-blocks/blockchain-blocks.component.scss
index a20b1cb35..5a9a7ea18 100644
--- a/frontend/src/app/components/blockchain-blocks/blockchain-blocks.component.scss
+++ b/frontend/src/app/components/blockchain-blocks/blockchain-blocks.component.scss
@@ -129,4 +129,15 @@
position: relative;
top: 15px;
z-index: 101;
-}
\ No newline at end of file
+}
+
+.animated {
+ transition: all 0.15s ease-in-out;
+}
+.show {
+ opacity: 1;
+}
+.hide {
+ opacity: 0;
+ pointer-events : none;
+}
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 a8d055602..42d045201 100644
--- a/frontend/src/app/components/blockchain-blocks/blockchain-blocks.component.ts
+++ b/frontend/src/app/components/blockchain-blocks/blockchain-blocks.component.ts
@@ -1,9 +1,10 @@
-import { Component, OnInit, OnDestroy, ChangeDetectionStrategy, ChangeDetectorRef, Input } from '@angular/core';
+import { Component, OnInit, OnDestroy, ChangeDetectionStrategy, ChangeDetectorRef } from '@angular/core';
import { Observable, Subscription } from 'rxjs';
import { StateService } from 'src/app/services/state.service';
-import { Router } from '@angular/router';
import { specialBlocks } from 'src/app/app.constants';
import { BlockExtended } from 'src/app/interfaces/node-api.interface';
+import { Location } from '@angular/common';
+import { config } from 'process';
@Component({
selector: 'app-blockchain-blocks',
@@ -12,7 +13,6 @@ import { BlockExtended } from 'src/app/interfaces/node-api.interface';
changeDetection: ChangeDetectionStrategy.OnPush,
})
export class BlockchainBlocksComponent implements OnInit, OnDestroy {
- @Input() showMiningInfo: boolean = false;
specialBlocks = specialBlocks;
network = '';
blocks: BlockExtended[] = [];
@@ -32,6 +32,7 @@ export class BlockchainBlocksComponent implements OnInit, OnDestroy {
arrowLeftPx = 30;
blocksFilled = false;
transition = '1s';
+ showMiningInfo = false;
gradientColors = {
'': ['#9339f4', '#105fb0'],
@@ -44,11 +45,23 @@ export class BlockchainBlocksComponent implements OnInit, OnDestroy {
constructor(
public stateService: StateService,
- private router: Router,
private cd: ChangeDetectorRef,
- ) { }
+ private location: Location,
+ private cdr: ChangeDetectorRef
+ ) {
+ }
+
+ enabledMiningInfoIfNeeded(url) {
+ this.showMiningInfo = url === '/mining';
+ this.cdr.detectChanges(); // Need to update the view asap
+ }
ngOnInit() {
+ if (['', 'testnet', 'signet'].includes(this.stateService.network)) {
+ this.enabledMiningInfoIfNeeded(this.location.path());
+ this.location.onUrlChange((url) => this.enabledMiningInfoIfNeeded(url));
+ }
+
if (this.stateService.network === 'liquid' || this.stateService.network === 'liquidtestnet') {
this.feeRounding = '1.0-1';
}
diff --git a/frontend/src/app/components/blockchain/blockchain.component.html b/frontend/src/app/components/blockchain/blockchain.component.html
index 19ee5676d..c49d08c5a 100644
--- a/frontend/src/app/components/blockchain/blockchain.component.html
+++ b/frontend/src/app/components/blockchain/blockchain.component.html
@@ -1,8 +1,8 @@
-
+
diff --git a/frontend/src/app/components/blockchain/blockchain.component.scss b/frontend/src/app/components/blockchain/blockchain.component.scss
index a33fc58d2..6d415cd2a 100644
--- a/frontend/src/app/components/blockchain/blockchain.component.scss
+++ b/frontend/src/app/components/blockchain/blockchain.component.scss
@@ -59,14 +59,4 @@
width: 300px;
left: -150px;
top: 0px;
-}
-
-.animate {
- transition: all 1s ease-in-out;
-}
-.move-left {
- transform: translate(-40%, 0);
- @media (max-width: 767.98px) {
- transform: translate(-85%, 0);
- }
-}
+}
\ No newline at end of file
diff --git a/frontend/src/app/components/blockchain/blockchain.component.ts b/frontend/src/app/components/blockchain/blockchain.component.ts
index b47eee833..5c00c5ef7 100644
--- a/frontend/src/app/components/blockchain/blockchain.component.ts
+++ b/frontend/src/app/components/blockchain/blockchain.component.ts
@@ -8,7 +8,6 @@ import { StateService } from 'src/app/services/state.service';
changeDetection: ChangeDetectionStrategy.OnPush,
})
export class BlockchainComponent implements OnInit {
- showMiningInfo: boolean = false;
network: string;
constructor(