Bisq module separation.

Transaction view.
Block view.
Blocks list.

frontend/src/app/bisq/bisq-transaction/bisq-transaction.component.ts

@@ -1,36 +1,50 @@
-import { Component, OnInit } from '@angular/core';
+import { Component, OnInit, OnDestroy } from '@angular/core';
 import { ActivatedRoute, ParamMap } from '@angular/router';
-import { BisqTransaction } from 'src/app/interfaces/bisq.interfaces';
-import { switchMap } from 'rxjs/operators';
-import { ApiService } from 'src/app/services/api.service';
-import { of } from 'rxjs';
+import { BisqTransaction } from 'src/app/bisq/bisq.interfaces';
+import { switchMap, map } from 'rxjs/operators';
+import { of, Observable, Subscription } from 'rxjs';
+import { StateService } from 'src/app/services/state.service';
+import { Block } from 'src/app/interfaces/electrs.interface';
+import { BisqApiService } from '../bisq-api.service';
 
 @Component({
   selector: 'app-bisq-transaction',
   templateUrl: './bisq-transaction.component.html',
   styleUrls: ['./bisq-transaction.component.scss']
 })
-export class BisqTransactionComponent implements OnInit {
+export class BisqTransactionComponent implements OnInit, OnDestroy {
   bisqTx: BisqTransaction;
+  latestBlock$: Observable<Block>;
   txId: string;
+  isLoading = true;
+  subscription: Subscription;
 
   constructor(
     private route: ActivatedRoute,
-    private apiService: ApiService,
+    private bisqApiService: BisqApiService,
+    private stateService: StateService,
   ) { }
 
   ngOnInit(): void {
-    this.route.paramMap.pipe(
+    this.subscription = this.route.paramMap.pipe(
       switchMap((params: ParamMap) => {
+        this.isLoading = true;
         this.txId = params.get('id') || '';
-        if (history.state.bsqTx) {
-          return of(history.state.bsqTx);
+        if (history.state.data) {
+          return of(history.state.data);
         }
-        return this.apiService.getBisqTransaction$(this.txId);
+        return this.bisqApiService.getTransaction$(this.txId);
       })
     )
     .subscribe((tx) => {
+      this.isLoading = false;
       this.bisqTx = tx;
     });
+
+    this.latestBlock$ = this.stateService.blocks$.pipe(map((([block]) => block)));
+  }
+
+  ngOnDestroy() {
+    this.subscription.unsubscribe();
   }
 }