From 756caf2c53c0619ef61425032141b8a891a917fc Mon Sep 17 00:00:00 2001
From: softsimon <softsimon@protonmail.com>
Date: Sun, 10 May 2020 12:31:57 +0700
Subject: [PATCH] Improved network switching.

---
 .../app/components/block/block.component.html | 12 ++---
 frontend/src/app/services/state.service.ts    | 48 +++++++++++--------
 .../src/app/services/websocket.service.ts     |  8 +++-
 3 files changed, 38 insertions(+), 30 deletions(-)

diff --git a/frontend/src/app/components/block/block.component.html b/frontend/src/app/components/block/block.component.html
index 414ab16dc..6b2e4705c 100644
--- a/frontend/src/app/components/block/block.component.html
+++ b/frontend/src/app/components/block/block.component.html
@@ -11,6 +11,10 @@
         <div class="col-sm">
           <table class="table table-borderless table-striped">
             <tbody>
+              <tr>
+                <td class="td-width">Hash</td>
+                <td><a [routerLink]="['/block/' | relativeUrl, block.id]" title="{{ block.id }}">{{ block.id | shortenString : 13 }}</a> <app-clipboard class="d-none d-sm-inline-block" [text]="block.id"></app-clipboard></td>
+              </tr>
               <tr>
                 <td class="td-width">Timestamp</td>
                 <td>
@@ -20,10 +24,6 @@
                   </div>
                 </td>
               </tr>
-              <tr>
-                <td>Transactions</td>
-                <td>{{ block.tx_count | number }}</td>
-              </tr>
               <tr>
                 <td>Size</td>
                 <td>{{ block.size | bytes: 2 }}</td>
@@ -38,10 +38,6 @@
         <div class="col-sm">
           <table class="table table-borderless table-striped">
             <tbody>
-              <tr>
-                <td class="td-width">Hash</td>
-                <td><a [routerLink]="['/block/' | relativeUrl, block.id]" title="{{ block.id }}">{{ block.id | shortenString : 13 }}</a> <app-clipboard class="d-none d-sm-inline-block" [text]="block.id"></app-clipboard></td>
-              </tr>
               <tr *ngIf="block.medianFee !== undefined">
                 <td>Median fee</td>
                 <td>~{{ block.medianFee | number:'1.0-0' }} sat/vB (<app-fiat [value]="block.medianFee * 250" digitsInfo="1.2-2"></app-fiat>)</td>
diff --git a/frontend/src/app/services/state.service.ts b/frontend/src/app/services/state.service.ts
index c54a914f9..51207c744 100644
--- a/frontend/src/app/services/state.service.ts
+++ b/frontend/src/app/services/state.service.ts
@@ -38,30 +38,36 @@ export class StateService {
   constructor(
     private router: Router,
   ) {
+    this.setNetworkBasedonUrl(window.location.pathname);
+
     this.router.events.subscribe((event) => {
       if (event instanceof NavigationStart) {
-        switch (event.url.split('/')[1]) {
-          case 'liquid':
-          case 'liquid-tv':
-            if (this.network !== 'liquid') {
-              this.network = 'liquid';
-              this.networkChanged$.next('liquid');
-            }
-            return;
-          case 'testnet':
-          case 'testnet-tv':
-            if (this.network !== 'testnet') {
-              this.network = 'testnet';
-              this.networkChanged$.next('testnet');
-            }
-            return;
-          default:
-            if (this.network !== '') {
-              this.network = '';
-              this.networkChanged$.next('');
-            }
-        }
+        this.setNetworkBasedonUrl(event.url);
       }
     });
   }
+
+  setNetworkBasedonUrl(url: string) {
+    switch (url.split('/')[1]) {
+      case 'liquid':
+      case 'liquid-tv':
+        if (this.network !== 'liquid') {
+          this.network = 'liquid';
+          this.networkChanged$.next('liquid');
+        }
+        return;
+      case 'testnet':
+      case 'testnet-tv':
+        if (this.network !== 'testnet') {
+          this.network = 'testnet';
+          this.networkChanged$.next('testnet');
+        }
+        return;
+      default:
+        if (this.network !== '') {
+          this.network = '';
+          this.networkChanged$.next('');
+        }
+    }
+  }
 }
diff --git a/frontend/src/app/services/websocket.service.ts b/frontend/src/app/services/websocket.service.ts
index 5d60ce248..9d98888a3 100644
--- a/frontend/src/app/services/websocket.service.ts
+++ b/frontend/src/app/services/websocket.service.ts
@@ -24,14 +24,20 @@ export class WebsocketService {
   private onlineCheckTimeout: number;
   private onlineCheckTimeoutTwo: number;
   private subscription: Subscription;
+  private network = '';
 
   constructor(
     private stateService: StateService,
   ) {
-    this.websocketSubject = webSocket<WebsocketResponse | any>(WEB_SOCKET_URL + '/' + this.stateService.network);
+    this.network = this.stateService.network;
+    this.websocketSubject = webSocket<WebsocketResponse | any>(WEB_SOCKET_URL + '/' + this.network);
     this.startSubscription();
 
     this.stateService.networkChanged$.subscribe((network) => {
+      if (network === this.network) {
+        return;
+      }
+      this.network = network;
       clearTimeout(this.onlineCheckTimeout);
       clearTimeout(this.onlineCheckTimeoutTwo);