mirror of
https://github.com/mempool/mempool.git
synced 2025-01-18 21:32:55 +01:00
UI/UX - Blocks not visible on the TV page. (#626)
* Fix blocks not visible on the TV page. * Add e2e testing for tv screen.
This commit is contained in:
parent
80d76ad1f4
commit
2c5ccab77c
@ -49,6 +49,9 @@ describe('Mainnet', () => {
|
||||
cy.viewport('macbook-16');
|
||||
cy.wait(1000);
|
||||
cy.get('.blockchain-wrapper').should('be.visible');
|
||||
cy.get('#mempool-block-0').should('be.visible');
|
||||
cy.get('#mempool-block-1').should('be.visible');
|
||||
cy.get('#mempool-block-2').should('be.visible');
|
||||
});
|
||||
});
|
||||
|
||||
|
@ -1,10 +1,10 @@
|
||||
<div id="tv-wrapper">
|
||||
|
||||
<div *ngIf="loading" class="loading">
|
||||
<div *ngIf="mempoolStats.length === 0" class="loading">
|
||||
<div class="spinner-border text-light"></div>
|
||||
</div>
|
||||
|
||||
<div class="tv-container" *ngIf="!loading">
|
||||
<div class="tv-container">
|
||||
|
||||
<div class="chart-holder" *ngIf="mempoolStats.length">
|
||||
<app-mempool-graph dir="ltr" [data]="mempoolStats"></app-mempool-graph>
|
||||
@ -12,8 +12,8 @@
|
||||
|
||||
<div class="blockchain-wrapper">
|
||||
<div class="position-container">
|
||||
<app-mempool-blocks></app-mempool-blocks>
|
||||
<app-blockchain-blocks></app-blockchain-blocks>
|
||||
<app-mempool-blocks [isLoading$]="isLoading$"></app-mempool-blocks>
|
||||
<app-blockchain-blocks [isLoading$]="isLoading$"></app-blockchain-blocks>
|
||||
<div id="divider"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -4,6 +4,7 @@ import { OptimizedMempoolStats } from '../../interfaces/node-api.interface';
|
||||
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 { Observable } from 'rxjs';
|
||||
|
||||
@Component({
|
||||
selector: 'app-television',
|
||||
@ -11,7 +12,7 @@ import { SeoService } from 'src/app/services/seo.service';
|
||||
styleUrls: ['./television.component.scss']
|
||||
})
|
||||
export class TelevisionComponent implements OnInit {
|
||||
loading = true;
|
||||
isLoading$: Observable<boolean>;
|
||||
|
||||
mempoolStats: OptimizedMempoolStats[] = [];
|
||||
mempoolVsizeFeesData: any;
|
||||
@ -26,11 +27,11 @@ export class TelevisionComponent implements OnInit {
|
||||
ngOnInit() {
|
||||
this.seoService.setTitle($localize`:@@46ce8155c9ab953edeec97e8950b5a21e67d7c4e:TV view`);
|
||||
this.websocketService.want(['blocks', 'live-2h-chart', 'mempool-blocks']);
|
||||
this.isLoading$ = this.stateService.isLoadingWebSocket$;
|
||||
|
||||
this.apiService.list2HStatistics$()
|
||||
.subscribe((mempoolStats) => {
|
||||
this.mempoolStats = mempoolStats;
|
||||
this.loading = false;
|
||||
});
|
||||
|
||||
this.stateService.live2Chart$
|
||||
|
Loading…
Reference in New Issue
Block a user