diff --git a/frontend/src/app/components/liquid-reserves-audit/federation-addresses-list/federation-addresses-list.component.ts b/frontend/src/app/components/liquid-reserves-audit/federation-addresses-list/federation-addresses-list.component.ts index 67bb68193..caeac1987 100644 --- a/frontend/src/app/components/liquid-reserves-audit/federation-addresses-list/federation-addresses-list.component.ts +++ b/frontend/src/app/components/liquid-reserves-audit/federation-addresses-list/federation-addresses-list.component.ts @@ -1,6 +1,6 @@ import { Component, OnInit, ChangeDetectionStrategy, Input } from '@angular/core'; -import { Observable, combineLatest, of, timer } from 'rxjs'; -import { delayWhen, filter, map, share, shareReplay, switchMap, tap, throttleTime } from 'rxjs/operators'; +import { Observable, Subject, combineLatest, of, timer } from 'rxjs'; +import { delayWhen, filter, map, share, shareReplay, switchMap, takeUntil, tap, throttleTime } from 'rxjs/operators'; import { ApiService } from '../../../services/api.service'; import { Env, StateService } from '../../../services/state.service'; import { AuditStatus, CurrentPegs, FederationAddress } from '../../../interfaces/node-api.interface'; @@ -30,6 +30,8 @@ export class FederationAddressesListComponent implements OnInit { lastPegAmount: string = ''; isLoad: boolean = true; + private destroy$ = new Subject(); + constructor( private apiService: ApiService, public stateService: StateService, @@ -44,6 +46,7 @@ export class FederationAddressesListComponent implements OnInit { if (!this.widget) { this.websocketService.want(['blocks']); this.auditStatus$ = this.stateService.blocks$.pipe( + takeUntil(this.destroy$), throttleTime(40000), delayWhen(_ => this.isLoad ? timer(0) : timer(2000)), tap(() => this.isLoad = false), @@ -92,7 +95,11 @@ export class FederationAddressesListComponent implements OnInit { ); } + } + ngOnDestroy(): void { + this.destroy$.next(1); + this.destroy$.complete(); } pageChange(page: number): void { diff --git a/frontend/src/app/components/liquid-reserves-audit/federation-utxos-list/federation-utxos-list.component.ts b/frontend/src/app/components/liquid-reserves-audit/federation-utxos-list/federation-utxos-list.component.ts index 39c2c577e..470862c67 100644 --- a/frontend/src/app/components/liquid-reserves-audit/federation-utxos-list/federation-utxos-list.component.ts +++ b/frontend/src/app/components/liquid-reserves-audit/federation-utxos-list/federation-utxos-list.component.ts @@ -1,6 +1,6 @@ import { Component, OnInit, ChangeDetectionStrategy, Input } from '@angular/core'; -import { Observable, combineLatest, of, timer } from 'rxjs'; -import { delayWhen, filter, map, share, shareReplay, switchMap, tap, throttleTime } from 'rxjs/operators'; +import { Observable, Subject, combineLatest, of, timer } from 'rxjs'; +import { delayWhen, filter, map, share, shareReplay, switchMap, takeUntil, tap, throttleTime } from 'rxjs/operators'; import { ApiService } from '../../../services/api.service'; import { Env, StateService } from '../../../services/state.service'; import { AuditStatus, CurrentPegs, FederationUtxo } from '../../../interfaces/node-api.interface'; @@ -30,6 +30,8 @@ export class FederationUtxosListComponent implements OnInit { lastPegAmount: string = ''; isLoad: boolean = true; + private destroy$ = new Subject(); + constructor( private apiService: ApiService, public stateService: StateService, @@ -44,6 +46,7 @@ export class FederationUtxosListComponent implements OnInit { if (!this.widget) { this.websocketService.want(['blocks']); this.auditStatus$ = this.stateService.blocks$.pipe( + takeUntil(this.destroy$), throttleTime(40000), delayWhen(_ => this.isLoad ? timer(0) : timer(2000)), tap(() => this.isLoad = false), @@ -92,7 +95,11 @@ export class FederationUtxosListComponent implements OnInit { ); } + } + ngOnDestroy(): void { + this.destroy$.next(1); + this.destroy$.complete(); } pageChange(page: number): void { diff --git a/frontend/src/app/components/liquid-reserves-audit/reserves-audit-dashboard/reserves-audit-dashboard.component.ts b/frontend/src/app/components/liquid-reserves-audit/reserves-audit-dashboard/reserves-audit-dashboard.component.ts index cb5439165..3009edc46 100644 --- a/frontend/src/app/components/liquid-reserves-audit/reserves-audit-dashboard/reserves-audit-dashboard.component.ts +++ b/frontend/src/app/components/liquid-reserves-audit/reserves-audit-dashboard/reserves-audit-dashboard.component.ts @@ -2,7 +2,7 @@ import { ChangeDetectionStrategy, Component, OnInit } from '@angular/core'; import { SeoService } from '../../../services/seo.service'; import { WebsocketService } from '../../../services/websocket.service'; import { StateService } from '../../../services/state.service'; -import { Observable, combineLatest, delayWhen, filter, interval, map, of, share, shareReplay, startWith, switchMap, tap, throttleTime, timer } from 'rxjs'; +import { Observable, Subject, combineLatest, delayWhen, filter, interval, map, of, share, shareReplay, startWith, switchMap, takeUntil, tap, throttleTime, timer } from 'rxjs'; import { ApiService } from '../../../services/api.service'; import { AuditStatus, CurrentPegs, FederationAddress, FederationUtxo } from '../../../interfaces/node-api.interface'; @@ -29,6 +29,7 @@ export class ReservesAuditDashboardComponent implements OnInit { private lastPegAmount: string = ''; private lastReservesBlockUpdate: number = 0; + private destroy$ = new Subject(); constructor( private seoService: SeoService, @@ -43,11 +44,12 @@ export class ReservesAuditDashboardComponent implements OnInit { this.websocketService.want(['blocks', 'mempool-blocks']); this.auditStatus$ = this.stateService.blocks$.pipe( + takeUntil(this.destroy$), throttleTime(40000), delayWhen(_ => this.isLoad ? timer(0) : timer(2000)), tap(() => this.isLoad = false), switchMap(() => this.apiService.federationAuditSynced$()), - shareReplay(1) + shareReplay(1), ); this.currentPeg$ = this.auditStatus$.pipe( @@ -177,4 +179,9 @@ export class ReservesAuditDashboardComponent implements OnInit { ); } + ngOnDestroy(): void { + this.destroy$.next(1); + this.destroy$.complete(); + } + } diff --git a/frontend/src/app/dashboard/dashboard.component.ts b/frontend/src/app/dashboard/dashboard.component.ts index 4ade4a9b3..6e65f2332 100644 --- a/frontend/src/app/dashboard/dashboard.component.ts +++ b/frontend/src/app/dashboard/dashboard.component.ts @@ -1,6 +1,6 @@ import { AfterViewInit, ChangeDetectionStrategy, Component, OnDestroy, OnInit } from '@angular/core'; -import { combineLatest, EMPTY, merge, Observable, of, Subscription, timer } from 'rxjs'; -import { catchError, delayWhen, filter, map, scan, share, shareReplay, startWith, switchMap, tap, throttleTime } from 'rxjs/operators'; +import { combineLatest, EMPTY, merge, Observable, of, Subject, Subscription, timer } from 'rxjs'; +import { catchError, delayWhen, filter, map, scan, share, shareReplay, startWith, switchMap, takeUntil, tap, throttleTime } from 'rxjs/operators'; import { AuditStatus, BlockExtended, CurrentPegs, OptimizedMempoolStats } from '../interfaces/node-api.interface'; import { MempoolInfo, TransactionStripped, ReplacementInfo } from '../interfaces/websocket.interface'; import { ApiService } from '../services/api.service'; @@ -60,6 +60,8 @@ export class DashboardComponent implements OnInit, OnDestroy, AfterViewInit { private lastPegAmount: string = ''; private lastReservesBlockUpdate: number = 0; + private destroy$ = new Subject(); + constructor( public stateService: StateService, private apiService: ApiService, @@ -74,6 +76,8 @@ export class DashboardComponent implements OnInit, OnDestroy, AfterViewInit { ngOnDestroy(): void { this.currencySubscription.unsubscribe(); this.websocketService.stopTrackRbfSummary(); + this.destroy$.next(1); + this.destroy$.complete(); } ngOnInit(): void { @@ -215,12 +219,12 @@ export class DashboardComponent implements OnInit, OnDestroy, AfterViewInit { if (this.stateService.network === 'liquid' || this.stateService.network === 'liquidtestnet') { this.auditStatus$ = this.stateService.blocks$.pipe( + takeUntil(this.destroy$), throttleTime(40000), delayWhen(_ => this.isLoad ? timer(0) : timer(2000)), tap(() => this.isLoad = false), switchMap(() => this.apiService.federationAuditSynced$()), - shareReplay(1), - share() + shareReplay(1) ); ////////// Pegs historical data //////////