Fix key navigation bug in accelerator dashboard
This commit is contained in:
		
							parent
							
								
									3dbbc83077
								
							
						
					
					
						commit
						4723ca88ec
					
				@ -50,10 +50,6 @@ export class AccelerationsListComponent implements OnInit, OnDestroy {
 | 
			
		||||
    if (!this.widget) {
 | 
			
		||||
      this.websocketService.want(['blocks']);
 | 
			
		||||
      this.seoService.setTitle($localize`:@@02573b6980a2d611b4361a2595a4447e390058cd:Accelerations`);
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    this.skeletonLines = this.widget === true ? [...Array(6).keys()] : [...Array(15).keys()];
 | 
			
		||||
    this.paginationMaxSize = window.matchMedia('(max-width: 670px)').matches ? 3 : 5;
 | 
			
		||||
 | 
			
		||||
      this.paramSubscription = this.route.params.pipe(
 | 
			
		||||
        tap(params => {
 | 
			
		||||
@ -62,6 +58,31 @@ export class AccelerationsListComponent implements OnInit, OnDestroy {
 | 
			
		||||
        })
 | 
			
		||||
      ).subscribe();
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
      this.keyNavigationSubscription = this.stateService.keyNavigation$.pipe(
 | 
			
		||||
        tap((event) => {
 | 
			
		||||
          const prevKey = this.dir === 'ltr' ? 'ArrowLeft' : 'ArrowRight';
 | 
			
		||||
          const nextKey = this.dir === 'ltr' ? 'ArrowRight' : 'ArrowLeft';
 | 
			
		||||
          if (event.key === prevKey && this.page > 1) {
 | 
			
		||||
            this.page--;
 | 
			
		||||
            this.isLoading = true;
 | 
			
		||||
            this.cd.markForCheck();
 | 
			
		||||
          }
 | 
			
		||||
          if (event.key === nextKey && this.page * 15 < this.accelerationCount) {
 | 
			
		||||
            this.page++;
 | 
			
		||||
            this.isLoading = true;
 | 
			
		||||
            this.cd.markForCheck();
 | 
			
		||||
          }
 | 
			
		||||
        }),
 | 
			
		||||
        throttleTime(1000, undefined, { leading: true, trailing: true }),
 | 
			
		||||
      ).subscribe(() => {
 | 
			
		||||
        this.pageChange(this.page);
 | 
			
		||||
      });
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    this.skeletonLines = this.widget === true ? [...Array(6).keys()] : [...Array(15).keys()];
 | 
			
		||||
    this.paginationMaxSize = window.matchMedia('(max-width: 670px)').matches ? 3 : 5;
 | 
			
		||||
 | 
			
		||||
    this.accelerationList$ = this.pageSubject.pipe(
 | 
			
		||||
      switchMap((page) => {
 | 
			
		||||
        this.isLoading = true;
 | 
			
		||||
@ -100,26 +121,6 @@ export class AccelerationsListComponent implements OnInit, OnDestroy {
 | 
			
		||||
        );
 | 
			
		||||
      })
 | 
			
		||||
    );
 | 
			
		||||
 | 
			
		||||
    this.keyNavigationSubscription = this.stateService.keyNavigation$.pipe(
 | 
			
		||||
      tap((event) => {
 | 
			
		||||
        const prevKey = this.dir === 'ltr' ? 'ArrowLeft' : 'ArrowRight';
 | 
			
		||||
        const nextKey = this.dir === 'ltr' ? 'ArrowRight' : 'ArrowLeft';
 | 
			
		||||
        if (event.key === prevKey && this.page > 1) {
 | 
			
		||||
          this.page--;
 | 
			
		||||
          this.isLoading = true;
 | 
			
		||||
          this.cd.markForCheck();
 | 
			
		||||
        }
 | 
			
		||||
        if (event.key === nextKey && this.page * 15 < this.accelerationCount) {
 | 
			
		||||
          this.page++;
 | 
			
		||||
          this.isLoading = true;
 | 
			
		||||
          this.cd.markForCheck();
 | 
			
		||||
        }
 | 
			
		||||
      }),
 | 
			
		||||
      throttleTime(1000, undefined, { leading: true, trailing: true }),
 | 
			
		||||
    ).subscribe(() => {
 | 
			
		||||
      this.pageChange(this.page);
 | 
			
		||||
    });
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  pageChange(page: number): void {
 | 
			
		||||
 | 
			
		||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user