diff --git a/frontend/src/app/bisq/bisq-blocks/bisq-blocks.component.html b/frontend/src/app/bisq/bisq-blocks/bisq-blocks.component.html index c38860562..e1953ec63 100644 --- a/frontend/src/app/bisq/bisq-blocks/bisq-blocks.component.html +++ b/frontend/src/app/bisq/bisq-blocks/bisq-blocks.component.html @@ -27,7 +27,7 @@
- + diff --git a/frontend/src/app/bisq/bisq-blocks/bisq-blocks.component.ts b/frontend/src/app/bisq/bisq-blocks/bisq-blocks.component.ts index 4f6727336..ae5b4fc51 100644 --- a/frontend/src/app/bisq/bisq-blocks/bisq-blocks.component.ts +++ b/frontend/src/app/bisq/bisq-blocks/bisq-blocks.component.ts @@ -4,6 +4,7 @@ import { switchMap, map } from 'rxjs/operators'; import { Subject, Observable, of, merge } from 'rxjs'; import { BisqBlock, BisqOutput, BisqTransaction } from '../bisq.interfaces'; import { SeoService } from 'src/app/services/seo.service'; +import { ActivatedRoute, Router } from '@angular/router'; @Component({ selector: 'app-bisq-blocks', @@ -23,11 +24,11 @@ export class BisqBlocksComponent implements OnInit { paginationSize: 'sm' | 'lg' = 'md'; paginationMaxSize = 10; - pageSubject$ = new Subject(); - constructor( private bisqApiService: BisqApiService, private seoService: SeoService, + private route: ActivatedRoute, + private router: Router, ) { } ngOnInit(): void { @@ -39,8 +40,15 @@ export class BisqBlocksComponent implements OnInit { this.paginationMaxSize = 3; } - this.blocks$ = merge(of(1), this.pageSubject$) + this.blocks$ = this.route.queryParams .pipe( + map((queryParams) => { + if (queryParams.page) { + this.page = parseInt(queryParams.page, 10); + return parseInt(queryParams.page, 10); + } + return 1; + }), switchMap((page) => this.bisqApiService.listBlocks$((page - 1) * this.itemsPerPage, this.itemsPerPage)), map((response) => [response.body, parseInt(response.headers.get('x-total-count'), 10)]), ); @@ -57,6 +65,10 @@ export class BisqBlocksComponent implements OnInit { } pageChange(page: number) { - this.pageSubject$.next(page); + this.router.navigate([], { + queryParams: { page: page }, + replaceUrl: true, + queryParamsHandling: 'merge', + }); } } diff --git a/frontend/src/app/bisq/bisq-transaction/bisq-transaction.component.html b/frontend/src/app/bisq/bisq-transaction/bisq-transaction.component.html index b2a949321..355a94f2b 100644 --- a/frontend/src/app/bisq/bisq-transaction/bisq-transaction.component.html +++ b/frontend/src/app/bisq/bisq-transaction/bisq-transaction.component.html @@ -155,7 +155,7 @@
- Error loading transaction + Error loading Bisq transaction

{{ error.status }}: {{ error.statusText }}
diff --git a/frontend/src/app/bisq/bisq-transactions/bisq-transactions.component.html b/frontend/src/app/bisq/bisq-transactions/bisq-transactions.component.html index 19332fa3b..b39f93868 100644 --- a/frontend/src/app/bisq/bisq-transactions/bisq-transactions.component.html +++ b/frontend/src/app/bisq/bisq-transactions/bisq-transactions.component.html @@ -94,7 +94,7 @@
- + diff --git a/frontend/src/app/bisq/bisq-transactions/bisq-transactions.component.ts b/frontend/src/app/bisq/bisq-transactions/bisq-transactions.component.ts index 186525c71..98c98a975 100644 --- a/frontend/src/app/bisq/bisq-transactions/bisq-transactions.component.ts +++ b/frontend/src/app/bisq/bisq-transactions/bisq-transactions.component.ts @@ -1,10 +1,11 @@ import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core'; import { BisqTransaction, BisqOutput } from '../bisq.interfaces'; -import { Subject, merge, Observable, of } from 'rxjs'; +import { Subject, merge, Observable } from 'rxjs'; import { switchMap, map } from 'rxjs/operators'; import { BisqApiService } from '../bisq-api.service'; import { SeoService } from 'src/app/services/seo.service'; import { FormGroup, FormBuilder } from '@angular/forms'; +import { Router, ActivatedRoute } from '@angular/router'; @Component({ selector: 'app-bisq-transactions', @@ -20,7 +21,6 @@ export class BisqTransactionsComponent implements OnInit { fiveItemsPxSize = 250; isLoading = true; loadingItems: number[]; - pageSubject$ = new Subject(); radioGroupForm: FormGroup; types: string[] = []; @@ -32,6 +32,8 @@ export class BisqTransactionsComponent implements OnInit { private bisqApiService: BisqApiService, private seoService: SeoService, private formBuilder: FormBuilder, + private route: ActivatedRoute, + private router: Router, ) { } ngOnInit(): void { @@ -63,8 +65,16 @@ export class BisqTransactionsComponent implements OnInit { } this.transactions$ = merge( - of(1), - this.pageSubject$, + this.route.queryParams + .pipe( + map((queryParams) => { + if (queryParams.page) { + this.page = parseInt(queryParams.page, 10); + return parseInt(queryParams.page, 10); + } + return 1; + }) + ), this.radioGroupForm.valueChanges .pipe( map((data) => { @@ -75,6 +85,9 @@ export class BisqTransactionsComponent implements OnInit { } } this.types = types; + if (this.page !== 1) { + this.pageChange(1); + } return 1; }) ) @@ -86,7 +99,11 @@ export class BisqTransactionsComponent implements OnInit { } pageChange(page: number) { - this.pageSubject$.next(page); + this.router.navigate([], { + queryParams: { page: page }, + replaceUrl: true, + queryParamsHandling: 'merge', + }); } calculateTotalOutput(outputs: BisqOutput[]): number { diff --git a/frontend/src/app/bisq/bisq.routing.module.ts b/frontend/src/app/bisq/bisq.routing.module.ts index fdac7de60..da0c490c6 100644 --- a/frontend/src/app/bisq/bisq.routing.module.ts +++ b/frontend/src/app/bisq/bisq.routing.module.ts @@ -1,7 +1,6 @@ import { NgModule } from '@angular/core'; import { RouterModule, Routes } from '@angular/router'; import { AboutComponent } from '../components/about/about.component'; -import { AddressComponent } from '../components/address/address.component'; import { BisqTransactionsComponent } from './bisq-transactions/bisq-transactions.component'; import { BisqTransactionComponent } from './bisq-transaction/bisq-transaction.component'; import { BisqBlockComponent } from './bisq-block/bisq-block.component'; diff --git a/frontend/src/app/services/state.service.ts b/frontend/src/app/services/state.service.ts index c8836eaa2..73ef0c924 100644 --- a/frontend/src/app/services/state.service.ts +++ b/frontend/src/app/services/state.service.ts @@ -53,7 +53,7 @@ export class StateService { } setNetworkBasedonUrl(url: string) { - switch (url.split('/')[1]) { + switch (url.split(/\/|\?|#/)[1]) { case 'liquid': if (this.network !== 'liquid') { this.network = 'liquid';