Refactor TV component subscription
This commit is contained in:
		
							parent
							
								
									aa77faf314
								
							
						
					
					
						commit
						cd9eaf816b
					
				| @ -7,7 +7,7 @@ | ||||
|         [height]="600" | ||||
|         [left]="60" | ||||
|         [right]="10" | ||||
|         [data]="mempoolStats && mempoolStats.length ? mempoolStats : null" | ||||
|         [data]="statsSubscription$ | async" | ||||
|         [showZoom]="false" | ||||
|       ></app-mempool-graph> | ||||
|     </div> | ||||
|  | ||||
| @ -5,7 +5,9 @@ import { StateService } from 'src/app/services/state.service'; | ||||
| import { ApiService } from 'src/app/services/api.service'; | ||||
| import { SeoService } from 'src/app/services/seo.service'; | ||||
| import { ActivatedRoute } from '@angular/router'; | ||||
| import { switchMap } from 'rxjs/operators'; | ||||
| import { map, startWith, switchMap, tap } from 'rxjs/operators'; | ||||
| import { interval, merge, Observable } from 'rxjs'; | ||||
| import { isArray } from 'src/app/shared/pipes/bytes-pipe/utils'; | ||||
| 
 | ||||
| @Component({ | ||||
|   selector: 'app-television', | ||||
| @ -15,7 +17,8 @@ import { switchMap } from 'rxjs/operators'; | ||||
| export class TelevisionComponent implements OnInit { | ||||
| 
 | ||||
|   mempoolStats: OptimizedMempoolStats[] = []; | ||||
|   mempoolVsizeFeesData: any; | ||||
|   statsSubscription$: Observable<any>; | ||||
|   fragment: string; | ||||
| 
 | ||||
|   constructor( | ||||
|     private websocketService: WebsocketService, | ||||
| @ -25,36 +28,46 @@ export class TelevisionComponent implements OnInit { | ||||
|     private route: ActivatedRoute | ||||
|   ) { } | ||||
| 
 | ||||
|   refreshStats(time: number, fn: Observable<OptimizedMempoolStats[]>) { | ||||
|     return interval(time).pipe(startWith(0), switchMap(() => fn)); | ||||
|   } | ||||
| 
 | ||||
|   ngOnInit() { | ||||
|     this.seoService.setTitle($localize`:@@46ce8155c9ab953edeec97e8950b5a21e67d7c4e:TV view`); | ||||
|     this.websocketService.want(['blocks', 'live-2h-chart', 'mempool-blocks']); | ||||
| 
 | ||||
|     this.route.fragment | ||||
|       .pipe( | ||||
|         switchMap((fragment) => { | ||||
|           switch (fragment) { | ||||
|             case '2h': return this.apiService.list2HStatistics$(); | ||||
|             case '24h': return this.apiService.list24HStatistics$(); | ||||
|             case '1w': return this.apiService.list1WStatistics$(); | ||||
|             case '1m': return this.apiService.list1MStatistics$(); | ||||
|             case '3m': return this.apiService.list3MStatistics$(); | ||||
|             case '6m': return this.apiService.list6MStatistics$(); | ||||
|             case '1y': return this.apiService.list1YStatistics$(); | ||||
|             case '2y': return this.apiService.list2YStatistics$(); | ||||
|             case '3y': return this.apiService.list3YStatistics$(); | ||||
|             default: return this.apiService.list2HStatistics$(); | ||||
|           } | ||||
|         }) | ||||
|       ) | ||||
|       .subscribe((mempoolStats) => { | ||||
|         this.mempoolStats = mempoolStats; | ||||
|       }); | ||||
| 
 | ||||
|     this.stateService.live2Chart$ | ||||
|       .subscribe((mempoolStats) => { | ||||
|         this.mempoolStats.unshift(mempoolStats); | ||||
|         this.mempoolStats = this.mempoolStats.slice(0, this.mempoolStats.length - 1); | ||||
|       }); | ||||
|     this.statsSubscription$ = merge( | ||||
|       this.stateService.live2Chart$, | ||||
|       this.route.fragment | ||||
|         .pipe( | ||||
|           tap(fragment => { this.fragment = fragment; }), | ||||
|           switchMap((fragment) => { | ||||
|             const minute = 60000; const hour = 3600000; | ||||
|             switch (fragment) { | ||||
|               case '2h': return this.apiService.list2HStatistics$(); | ||||
|               case '24h': return this.apiService.list24HStatistics$(); | ||||
|               case '1w': return this.refreshStats(5 * minute, this.apiService.list1WStatistics$()); | ||||
|               case '1m': return this.refreshStats(30 * minute, this.apiService.list1MStatistics$()); | ||||
|               case '3m': return this.refreshStats(2 * hour, this.apiService.list3MStatistics$()); | ||||
|               case '6m': return this.refreshStats(3 * hour, this.apiService.list6MStatistics$()); | ||||
|               case '1y': return this.refreshStats(8 * hour, this.apiService.list1YStatistics$()); | ||||
|               case '2y': return this.refreshStats(8 * hour, this.apiService.list2YStatistics$()); | ||||
|               case '3y': return this.refreshStats(12 * hour, this.apiService.list3YStatistics$()); | ||||
|               default: return this.apiService.list2HStatistics$(); | ||||
|             } | ||||
|           }) | ||||
|         ) | ||||
|     ) | ||||
|     .pipe( | ||||
|       map(stats => { | ||||
|         if (isArray(stats)) { | ||||
|           this.mempoolStats = stats as OptimizedMempoolStats[]; | ||||
|         } else if (['2h', '24h'].includes(this.fragment)) { | ||||
|           this.mempoolStats.unshift(stats as OptimizedMempoolStats); | ||||
|           this.mempoolStats = this.mempoolStats.slice(0, this.mempoolStats.length - 1); | ||||
|         } | ||||
|         return this.mempoolStats; | ||||
|       }) | ||||
|     ); | ||||
|   } | ||||
| 
 | ||||
| } | ||||
|  | ||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user