Show skeleton loader for all blocks while offline

This commit is contained in:
Mononaut 2023-02-14 12:51:41 -06:00
parent 8eca1e5f7e
commit ee265be55e
No known key found for this signature in database
GPG Key ID: A3F058E41374C04E

View File

@ -2,7 +2,7 @@
[style.left]="static ? (offset || 0) + 'px' : null" [style.left]="static ? (offset || 0) + 'px' : null"
*ngIf="static || (loadingBlocks$ | async) === false; else loadingBlocksTemplate"> *ngIf="static || (loadingBlocks$ | async) === false; else loadingBlocksTemplate">
<div *ngFor="let block of blocks; let i = index; trackBy: trackByBlocksFn"> <div *ngFor="let block of blocks; let i = index; trackBy: trackByBlocksFn">
<ng-container *ngIf="block && !block.loading && !block.placeholder; else placeholderBlock"> <ng-container *ngIf="connected && block && !block.loading && !block.placeholder; else placeholderBlock">
<div [attr.data-cy]="'bitcoin-block-offset-' + offset + '-index-' + i" <div [attr.data-cy]="'bitcoin-block-offset-' + offset + '-index-' + i"
class="text-center bitcoin-block mined-block blockchain-blocks-offset-{{ offset }}-index-{{ i }}" class="text-center bitcoin-block mined-block blockchain-blocks-offset-{{ offset }}-index-{{ i }}"
id="bitcoin-block-{{ block.height }}" [ngStyle]="blockStyles[i]" id="bitcoin-block-{{ block.height }}" [ngStyle]="blockStyles[i]"
@ -59,7 +59,7 @@
</div> </div>
</ng-container> </ng-container>
<ng-template #placeholderBlock> <ng-template #placeholderBlock>
<ng-container *ngIf="block && block.placeholder && !loadingTip; else loadingBlock"> <ng-container *ngIf="block && block.placeholder && connected && !loadingTip; else loadingBlock">
<div [attr.data-cy]="'bitcoin-block-' + offset + '-index-' + i" <div [attr.data-cy]="'bitcoin-block-' + offset + '-index-' + i"
class="text-center bitcoin-block mined-block placeholder-block blockchain-blocks-{{ i }}" class="text-center bitcoin-block mined-block placeholder-block blockchain-blocks-{{ i }}"
id="bitcoin-block-{{ block.height }}" [ngStyle]="blockStyles[i]"> id="bitcoin-block-{{ block.height }}" [ngStyle]="blockStyles[i]">
@ -68,10 +68,10 @@
</ng-container> </ng-container>
</ng-template> </ng-template>
<ng-template #loadingBlock> <ng-template #loadingBlock>
<ng-container *ngIf="loadingTip || (block && block.loading)"> <ng-container *ngIf="!connected || loadingTip || (block && block.loading)">
<div class="flashing loading"> <div class="flashing loading">
<div class="text-center bitcoin-block mined-block" id="bitcoin-block-{{ block.height }}" <div class="text-center bitcoin-block mined-block" id="bitcoin-block-{{ block.height }}"
[ngStyle]="blockStyles[i]"></div> [ngStyle]="emptyBlockStyles[i]"></div>
</div> </div>
</ng-container> </ng-container>
</ng-template> </ng-template>