Fix bug when loading /tv and cleanup Observable flow

This commit is contained in:
nymkappa 2022-02-10 00:04:14 +09:00
parent cd9eaf816b
commit 055c587351
No known key found for this signature in database
GPG Key ID: E155910B16E8BD04

View File

@ -5,19 +5,20 @@ import { StateService } from 'src/app/services/state.service';
import { ApiService } from 'src/app/services/api.service'; import { ApiService } from 'src/app/services/api.service';
import { SeoService } from 'src/app/services/seo.service'; import { SeoService } from 'src/app/services/seo.service';
import { ActivatedRoute } from '@angular/router'; import { ActivatedRoute } from '@angular/router';
import { map, startWith, switchMap, tap } from 'rxjs/operators'; import { map, scan, startWith, switchMap, tap } from 'rxjs/operators';
import { interval, merge, Observable } from 'rxjs'; import { interval, merge, Observable } from 'rxjs';
import { isArray } from 'src/app/shared/pipes/bytes-pipe/utils'; import { ChangeDetectionStrategy } from '@angular/core';
@Component({ @Component({
selector: 'app-television', selector: 'app-television',
templateUrl: './television.component.html', templateUrl: './television.component.html',
styleUrls: ['./television.component.scss'] styleUrls: ['./television.component.scss'],
changeDetection: ChangeDetectionStrategy.OnPush
}) })
export class TelevisionComponent implements OnInit { export class TelevisionComponent implements OnInit {
mempoolStats: OptimizedMempoolStats[] = []; mempoolStats: OptimizedMempoolStats[] = [];
statsSubscription$: Observable<any>; statsSubscription$: Observable<OptimizedMempoolStats[]>;
fragment: string; fragment: string;
constructor( constructor(
@ -37,14 +38,13 @@ export class TelevisionComponent implements OnInit {
this.websocketService.want(['blocks', 'live-2h-chart', 'mempool-blocks']); this.websocketService.want(['blocks', 'live-2h-chart', 'mempool-blocks']);
this.statsSubscription$ = merge( this.statsSubscription$ = merge(
this.stateService.live2Chart$, this.stateService.live2Chart$.pipe(map(stats => [stats])),
this.route.fragment this.route.fragment
.pipe( .pipe(
tap(fragment => { this.fragment = fragment; }), tap(fragment => { this.fragment = fragment ?? '2h'; }),
switchMap((fragment) => { switchMap((fragment) => {
const minute = 60000; const hour = 3600000; const minute = 60000; const hour = 3600000;
switch (fragment) { switch (fragment) {
case '2h': return this.apiService.list2HStatistics$();
case '24h': return this.apiService.list24HStatistics$(); case '24h': return this.apiService.list24HStatistics$();
case '1w': return this.refreshStats(5 * minute, this.apiService.list1WStatistics$()); case '1w': return this.refreshStats(5 * minute, this.apiService.list1WStatistics$());
case '1m': return this.refreshStats(30 * minute, this.apiService.list1MStatistics$()); case '1m': return this.refreshStats(30 * minute, this.apiService.list1MStatistics$());
@ -53,20 +53,20 @@ export class TelevisionComponent implements OnInit {
case '1y': return this.refreshStats(8 * hour, this.apiService.list1YStatistics$()); case '1y': return this.refreshStats(8 * hour, this.apiService.list1YStatistics$());
case '2y': return this.refreshStats(8 * hour, this.apiService.list2YStatistics$()); case '2y': return this.refreshStats(8 * hour, this.apiService.list2YStatistics$());
case '3y': return this.refreshStats(12 * hour, this.apiService.list3YStatistics$()); case '3y': return this.refreshStats(12 * hour, this.apiService.list3YStatistics$());
default: return this.apiService.list2HStatistics$(); default /* 2h */: return this.apiService.list2HStatistics$();
} }
}) })
) )
) )
.pipe( .pipe(
map(stats => { scan((mempoolStats, newStats) => {
if (isArray(stats)) { if (newStats.length > 1) {
this.mempoolStats = stats as OptimizedMempoolStats[]; mempoolStats = newStats;
} else if (['2h', '24h'].includes(this.fragment)) { } else if (['2h', '24h'].includes(this.fragment)) {
this.mempoolStats.unshift(stats as OptimizedMempoolStats); mempoolStats.unshift(newStats[0]);
this.mempoolStats = this.mempoolStats.slice(0, this.mempoolStats.length - 1); mempoolStats = mempoolStats.slice(0, mempoolStats.length - 1);
} }
return this.mempoolStats; return mempoolStats;
}) })
); );
} }