diff --git a/frontend/src/app/components/latest-blocks/latest-blocks.component.html b/frontend/src/app/components/latest-blocks/latest-blocks.component.html
index a638ffa4f..9a3108617 100644
--- a/frontend/src/app/components/latest-blocks/latest-blocks.component.html
+++ b/frontend/src/app/components/latest-blocks/latest-blocks.component.html
@@ -1,4 +1,4 @@
-
+
@@ -19,7 +19,7 @@
{{ block.tx_count | number }} |
-
+
{{ block.size | bytes: 2 }}
|
diff --git a/frontend/src/app/components/latest-blocks/latest-blocks.component.ts b/frontend/src/app/components/latest-blocks/latest-blocks.component.ts
index 1c85e13f3..6cccfb81f 100644
--- a/frontend/src/app/components/latest-blocks/latest-blocks.component.ts
+++ b/frontend/src/app/components/latest-blocks/latest-blocks.component.ts
@@ -1,17 +1,18 @@
-import { Component, OnInit, OnDestroy } from '@angular/core';
+import { Component, OnInit, OnDestroy, ChangeDetectionStrategy, ChangeDetectorRef } from '@angular/core';
import { ElectrsApiService } from '../../services/electrs-api.service';
import { StateService } from '../../services/state.service';
import { Block } from '../../interfaces/electrs.interface';
-import { Subscription } from 'rxjs';
+import { Subscription, Observable, merge, of } from 'rxjs';
import { SeoService } from 'src/app/services/seo.service';
@Component({
selector: 'app-latest-blocks',
templateUrl: './latest-blocks.component.html',
styleUrls: ['./latest-blocks.component.scss'],
+ changeDetection: ChangeDetectionStrategy.OnPush
})
export class LatestBlocksComponent implements OnInit, OnDestroy {
- network = '';
+ network$: Observable
;
blocks: any[] = [];
blockSubscription: Subscription;
@@ -27,11 +28,12 @@ export class LatestBlocksComponent implements OnInit, OnDestroy {
private electrsApiService: ElectrsApiService,
private stateService: StateService,
private seoService: SeoService,
+ private cd: ChangeDetectorRef,
) { }
ngOnInit() {
this.seoService.resetTitle();
- this.stateService.networkChanged$.subscribe((network) => this.network = network);
+ this.network$ = merge(of(''), this.stateService.networkChanged$);
this.blockSubscription = this.stateService.blocks$
.subscribe(([block]) => {
@@ -57,6 +59,7 @@ export class LatestBlocksComponent implements OnInit, OnDestroy {
this.blocks.pop();
this.blocks.unshift(block);
+ this.cd.markForCheck();
});
this.loadInitialBlocks();
@@ -80,6 +83,7 @@ export class LatestBlocksComponent implements OnInit, OnDestroy {
if (chunks > 0) {
this.loadMore(chunks);
}
+ this.cd.markForCheck();
});
}
@@ -97,6 +101,7 @@ export class LatestBlocksComponent implements OnInit, OnDestroy {
if (chunksLeft > 0) {
this.loadMore(chunksLeft);
}
+ this.cd.markForCheck();
});
}
diff --git a/frontend/src/app/components/master-page/master-page.component.html b/frontend/src/app/components/master-page/master-page.component.html
index 5af2c3cf4..eab40d088 100644
--- a/frontend/src/app/components/master-page/master-page.component.html
+++ b/frontend/src/app/components/master-page/master-page.component.html
@@ -1,22 +1,25 @@
+