Show geolocation in node channels ranking widget

This commit is contained in:
nymkappa
2023-02-23 18:57:55 +09:00
parent 50c3f83484
commit 7e913e4d34
4 changed files with 33 additions and 9 deletions

View File

@@ -8,13 +8,13 @@
<div style="min-height: 295px">
<table class="table table-borderless">
<thead>
<th class="alias text-left" i18n="nodes.alias">Alias</th>
<th class="pool text-left" i18n="nodes.alias" [ngClass]="{'widget': widget}">Alias</th>
<th class="liquidity text-right" i18n="node.channels">Channels</th>
<th *ngIf="!widget" class="d-none d-md-table-cell channels text-right" i18n="lightning.channels">Capacity</th>
<th *ngIf="!widget" class="d-none d-md-table-cell text-right" i18n="node.liquidity">{{ currency$ | async }}</th>
<th *ngIf="!widget" class="d-none d-md-table-cell timestamp text-right" i18n="transaction.first-seen|Transaction first seen">First seen</th>
<th *ngIf="!widget" class="d-none d-md-table-cell timestamp text-right" i18n="lightning.last_update">Last update</th>
<th *ngIf="!widget" class="d-none d-md-table-cell text-right" i18n="lightning.location">Location</th>
<th class="d-none d-md-table-cell text-right" i18n="lightning.location">Location</th>
</thead>
<tbody *ngIf="topNodesPerChannels$ | async as nodes">
<tr *ngFor="let node of nodes;">
@@ -40,7 +40,7 @@
<td *ngIf="!widget" class="d-none d-md-table-cell text-right">
<app-timestamp [customFormat]="'yyyy-MM-dd'" [unixTime]="node.updatedAt" [hideTimeSince]="true"></app-timestamp>
</td>
<td *ngIf="!widget" class="d-none d-md-table-cell text-right text-truncate">
<td class="d-none d-md-table-cell text-right text-truncate">
<app-geolocation [data]="node.geolocation" [type]="'list-isp'"></app-geolocation>
</td>
</tr>

View File

@@ -33,6 +33,9 @@ tr, td, th {
text-overflow: ellipsis;
overflow: hidden;
}
.pool.widget {
width: 45%;
}
.liquidity {
width: 10%;

View File

@@ -28,7 +28,7 @@ export class TopNodesPerChannels implements OnInit {
ngOnInit(): void {
this.currency$ = this.stateService.fiatCurrency$;
for (let i = 1; i <= (this.widget ? (isMobile() ? 8 : 6) : 100); ++i) {
for (let i = 1; i <= (this.widget ? 6 : 100); ++i) {
this.skeletonRows.push(i);
}
@@ -49,7 +49,16 @@ export class TopNodesPerChannels implements OnInit {
} else {
this.topNodesPerChannels$ = this.nodes$.pipe(
map((ranking) => {
return ranking.topByChannels.slice(0, isMobile() ? 8 : 6);
for (const i in ranking.topByChannels) {
ranking.topByChannels[i].geolocation = <GeolocationData>{
country: ranking.topByChannels[i].country?.en,
city: ranking.topByChannels[i].city?.en,
subdivision: ranking.topByChannels[i].subdivision?.en,
iso: ranking.topByChannels[i].iso_code,
};
console.log(ranking.topByChannels[i].geolocation);
}
return ranking.topByChannels;
})
);
}