Transaction, address and block page now works.

frontend/src/app/components/qrcode/qrcode.component.ts

@@ -1,5 +1,6 @@
 import { Component, Input, AfterViewInit, OnDestroy, ViewChild, ElementRef } from '@angular/core';
 import * as QRCode from 'qrcode/build/qrcode.js';
+import { StateService } from 'src/app/services/state.service';
 
 @Component({
   selector: 'app-qrcode',
@@ -14,9 +15,14 @@ export class QrcodeComponent implements AfterViewInit {
 
   qrcodeObject: any;
 
-  constructor() { }
+  constructor(
+    private stateService: StateService,
+  ) { }
 
   ngAfterViewInit() {
+    if (!this.stateService.isBrowser) {
+      return;
+    }
     const opts = {
       errorCorrectionLevel: 'H',
       margin: 0,

frontend/src/app/components/statistics/chartist.component.ts

@@ -1,14 +1,18 @@
 import {
   Component,
   ElementRef,
+  Inject,
   Input,
   OnChanges,
   OnDestroy,
   OnInit,
+  PLATFORM_ID,
   SimpleChanges,
   ViewEncapsulation
 } from '@angular/core';
 
+import { isPlatformBrowser } from '@angular/common';
+
 import * as Chartist from '@mempool/chartist';
 
 /**
@@ -63,16 +67,25 @@ export class ChartistComponent implements OnInit, OnChanges, OnDestroy {
   // @ts-ignore
   @Input() public events: ChartEvent;
 
+  isBrowser: boolean = isPlatformBrowser(this.platformId);
+
   // @ts-ignore
   public chart: ChartInterfaces;
 
   private element: HTMLElement;
 
-  constructor(element: ElementRef) {
+  constructor(
+    element: ElementRef,
+    @Inject(PLATFORM_ID) private platformId: any,
+  ) {
     this.element = element.nativeElement;
   }
 
   public ngOnInit(): Promise<ChartInterfaces> {
+    if (!this.isBrowser) {
+      return;
+    }
+
     if (!this.type || !this.data) {
       Promise.reject('Expected at least type and data.');
     }
@@ -87,6 +100,10 @@ export class ChartistComponent implements OnInit, OnChanges, OnDestroy {
   }
 
   public ngOnChanges(changes: SimpleChanges): void {
+    if (!this.isBrowser) {
+      return;
+    }
+
     this.update(changes);
   }
 

frontend/src/app/components/time-since/time-since.component.ts

@@ -1,5 +1,5 @@
-import { isPlatformBrowser } from '@angular/common';
 import { Component, OnInit, OnDestroy, ChangeDetectionStrategy, Input, ChangeDetectorRef, OnChanges, PLATFORM_ID, Inject } from '@angular/core';
+import { StateService } from 'src/app/services/state.service';
 
 @Component({
   selector: 'app-time-since',
@@ -7,7 +7,6 @@ import { Component, OnInit, OnDestroy, ChangeDetectionStrategy, Input, ChangeDet
   changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class TimeSinceComponent implements OnInit, OnChanges, OnDestroy {
-  isBrowser: boolean = isPlatformBrowser(this.platformId);
   interval: number;
   text: string;
   intervals = {};
@@ -17,7 +16,7 @@ export class TimeSinceComponent implements OnInit, OnChanges, OnDestroy {
 
   constructor(
     private ref: ChangeDetectorRef,
-    @Inject(PLATFORM_ID) private platformId: any,
+    private stateService: StateService,
   ) {
     if (document.body.clientWidth < 768) {
       this.intervals = {
@@ -43,7 +42,7 @@ export class TimeSinceComponent implements OnInit, OnChanges, OnDestroy {
   }
 
   ngOnInit() {
-    if (!this.isBrowser) {
+    if (!this.stateService.isBrowser) {
       this.text = this.calculate();
       this.ref.markForCheck();
       return;