machankura/mempool
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge pull request #2517 from mempool/nymkappa/bugfix/missing-loaders

Browse Source 
Add skeleton loader in node per isp/country lists
This commit is contained in:
softsimon
2022-09-08 15:59:21 +02:00
committed by GitHub
parent 336c9954ac 6673b3d2a2
commit 5fbe90d2b7
4 changed files with 72 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
frontend/src/app/lightning/nodes-per-isp/nodes-per-isp.component.html
View File

@@ -3,6 +3,7 @@
<div style="min-height: 295px">
<table class="table table-borderless">
<thead>
<th class="alias text-left" i18n="lightning.alias">Alias</th>
<th class="timestamp-first text-left" i18n="lightning.first_seen">First seen</th>
@@ -11,7 +12,8 @@
<th class="channels text-right" i18n="lightning.channels">Channels</th>
<th class="city text-right" i18n="lightning.location">Location</th>
</thead>
<tbody *ngIf="nodes$ | async as nodes">
<tbody *ngIf="nodes$ | async as nodes; else skeleton">
<tr *ngFor="let node of nodes; let i= index; trackBy: trackByPublicKey">
<td class="alias text-left text-truncate">
<a [routerLink]="['/lightning/node/' | relativeUrl, node.public_key]">{{ node.alias }}</a>
@@ -36,6 +38,32 @@
<app-geolocation [data]="node.geolocation" [type]="'list-isp'"></app-geolocation>
</td>
</tbody>
<ng-template #skeleton>
<tbody>
<tr *ngFor="let item of skeletonLines">
<td class="alias text-left text-truncate">
<span class="skeleton-loader"></span>
</td>
<td class="timestamp-first text-left">
<span class="skeleton-loader"></span>
</td>
<td class="timestamp-update text-left">
<span class="skeleton-loader"></span>
</td>
<td class="capacity text-right">
<span class="skeleton-loader"></span>
</td>
<td class="channels text-right">
<span class="skeleton-loader"></span>
</td>
<td class="city text-right text-truncate">
<span class="skeleton-loader"></span>
</td>
</tr>
</tbody>
</ng-template>
</table>
</div>