;
- constructor(private route: ActivatedRoute) {}
+ constructor(
+ private route: ActivatedRoute,
+ private lightningApiService: LightningApiService,
+ ) {}
ngOnInit(): void {
+ this.statistics$ = this.lightningApiService.getLatestStatistics$().pipe(share());
this.route.data.subscribe(data => {
this.type = data.type;
});
diff --git a/frontend/src/app/lightning/nodes-ranking/top-nodes-per-capacity/top-nodes-per-capacity.component.html b/frontend/src/app/lightning/nodes-ranking/top-nodes-per-capacity/top-nodes-per-capacity.component.html
index 3efbc8594..56fb091ee 100644
--- a/frontend/src/app/lightning/nodes-ranking/top-nodes-per-capacity/top-nodes-per-capacity.component.html
+++ b/frontend/src/app/lightning/nodes-ranking/top-nodes-per-capacity/top-nodes-per-capacity.component.html
@@ -27,12 +27,14 @@
+ ({{ (node.capacity / totalCapacity * 100) | number:'1.1-1' }}%)
|
|
{{ node.channels | number }}
+ ({{ (node?.channels / totalChannels * 100) | number:'1.1-1' }}%)
|
diff --git a/frontend/src/app/lightning/nodes-ranking/top-nodes-per-capacity/top-nodes-per-capacity.component.scss b/frontend/src/app/lightning/nodes-ranking/top-nodes-per-capacity/top-nodes-per-capacity.component.scss
index 3547c447f..89f144135 100644
--- a/frontend/src/app/lightning/nodes-ranking/top-nodes-per-capacity/top-nodes-per-capacity.component.scss
+++ b/frontend/src/app/lightning/nodes-ranking/top-nodes-per-capacity/top-nodes-per-capacity.component.scss
@@ -41,6 +41,11 @@ tr, td, th {
}
}
+.capacity-ratio {
+ font-size: 12px;
+ color: darkgrey;
+}
+
.fiat {
width: 15%;
@media (min-width: 768px) and (max-width: 991px) {
diff --git a/frontend/src/app/lightning/nodes-ranking/top-nodes-per-capacity/top-nodes-per-capacity.component.ts b/frontend/src/app/lightning/nodes-ranking/top-nodes-per-capacity/top-nodes-per-capacity.component.ts
index 054fa2f3c..780b9d1cd 100644
--- a/frontend/src/app/lightning/nodes-ranking/top-nodes-per-capacity/top-nodes-per-capacity.component.ts
+++ b/frontend/src/app/lightning/nodes-ranking/top-nodes-per-capacity/top-nodes-per-capacity.component.ts
@@ -14,11 +14,14 @@ import { LightningApiService } from '../../lightning-api.service';
})
export class TopNodesPerCapacity implements OnInit {
@Input() nodes$: Observable;
+ @Input() statistics$: Observable;
@Input() widget: boolean = false;
topNodesPerCapacity$: Observable;
skeletonRows: number[] = [];
currency$: Observable;
+ totalCapacity: number;
+ totalChannels: number;
constructor(
private apiService: LightningApiService,
@@ -59,6 +62,11 @@ export class TopNodesPerCapacity implements OnInit {
})
);
}
+
+ this.statistics$?.subscribe((data) => {
+ this.totalCapacity = data.latest.total_capacity;
+ this.totalChannels = data.latest.channel_count;
+ });
}
}
diff --git a/frontend/src/app/lightning/nodes-ranking/top-nodes-per-channels/top-nodes-per-channels.component.html b/frontend/src/app/lightning/nodes-ranking/top-nodes-per-channels/top-nodes-per-channels.component.html
index 94a887bb3..76b032552 100644
--- a/frontend/src/app/lightning/nodes-ranking/top-nodes-per-channels/top-nodes-per-channels.component.html
+++ b/frontend/src/app/lightning/nodes-ranking/top-nodes-per-channels/top-nodes-per-channels.component.html
@@ -27,9 +27,11 @@
|
{{ node.channels ? (node.channels | number) : '~' }}
+ ({{ (node?.channels / totalChannels * 100) | number:'1.1-1' }}%)
|
+ ({{ (node.capacity / totalCapacity * 100) | number:'1.1-1' }}%)
|
diff --git a/frontend/src/app/lightning/nodes-ranking/top-nodes-per-channels/top-nodes-per-channels.component.scss b/frontend/src/app/lightning/nodes-ranking/top-nodes-per-channels/top-nodes-per-channels.component.scss
index a42599d69..63d65bcf8 100644
--- a/frontend/src/app/lightning/nodes-ranking/top-nodes-per-channels/top-nodes-per-channels.component.scss
+++ b/frontend/src/app/lightning/nodes-ranking/top-nodes-per-channels/top-nodes-per-channels.component.scss
@@ -44,6 +44,11 @@ tr, td, th {
}
}
+.capacity-ratio {
+ font-size: 12px;
+ color: darkgrey;
+}
+
.geolocation {
@media (min-width: 768px) and (max-width: 991px) {
display: none !important;
diff --git a/frontend/src/app/lightning/nodes-ranking/top-nodes-per-channels/top-nodes-per-channels.component.ts b/frontend/src/app/lightning/nodes-ranking/top-nodes-per-channels/top-nodes-per-channels.component.ts
index 3de177cc7..f2d00f6f0 100644
--- a/frontend/src/app/lightning/nodes-ranking/top-nodes-per-channels/top-nodes-per-channels.component.ts
+++ b/frontend/src/app/lightning/nodes-ranking/top-nodes-per-channels/top-nodes-per-channels.component.ts
@@ -14,11 +14,14 @@ import { LightningApiService } from '../../lightning-api.service';
})
export class TopNodesPerChannels implements OnInit {
@Input() nodes$: Observable;
+ @Input() statistics$: Observable;
@Input() widget: boolean = false;
topNodesPerChannels$: Observable;
skeletonRows: number[] = [];
currency$: Observable;
+ totalChannels: number;
+ totalCapacity: number;
constructor(
private apiService: LightningApiService,
@@ -65,6 +68,11 @@ export class TopNodesPerChannels implements OnInit {
})
);
}
+
+ this.statistics$?.subscribe((data) => {
+ this.totalChannels = data.latest.channel_count;
+ this.totalCapacity = data.latest.total_capacity;
+ });
}
}
|