mirror of
https://github.com/Ride-The-Lightning/RTL.git
synced 2024-11-19 01:40:29 +01:00
lnd all routing & reports page layout
This commit is contained in:
ShahanaFarooqui
parent
381be53e40
commit
76afb82dae
@ -12,11 +12,59 @@
|
||||
<table mat-table #table [dataSource]="NonRoutingPeers" matSort class="overflow-auto">
|
||||
<ng-container matColumnDef="chan_id">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header>Channel ID</th>
|
||||
<td mat-cell *matCellDef="let nonRPeer" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '28rem'}">{{nonRPeer.chan_id}}</td>
|
||||
<td mat-cell *matCellDef="let nonRPeer" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}">{{nonRPeer.chan_id}}</td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="remote_alias">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header>Peer Alias</th>
|
||||
<td mat-cell *matCellDef="let nonRPeer" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '28rem'}">{{nonRPeer.remote_alias}}</td>
|
||||
<td mat-cell *matCellDef="let nonRPeer" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}">{{nonRPeer.remote_alias}}</td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="remote_pubkey">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header>Peer Pubkey</th>
|
||||
<td mat-cell *matCellDef="let nonRPeer" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}">{{nonRPeer.remote_pubkey}}</td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="channel_point">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header> Channel Point </th>
|
||||
<td mat-cell *matCellDef="let nonRPeer" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}">{{nonRPeer.channel_point}}</td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="uptime">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Uptime ({{timeUnit}})</th>
|
||||
<td mat-cell *matCellDef="let nonRPeer"><span fxLayoutAlign="end center">{{nonRPeer.uptime_str}} </span></td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="lifetime">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Lifetime ({{timeUnit}})</th>
|
||||
<td mat-cell *matCellDef="let nonRPeer"><span fxLayoutAlign="end center">{{nonRPeer.lifetime_str}} </span></td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="commit_fee">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Commit Fee (Sats)</th>
|
||||
<td mat-cell *matCellDef="let nonRPeer"><span fxLayoutAlign="end center">{{nonRPeer.commit_fee | number}} </span></td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="commit_weight">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Commit Weight</th>
|
||||
<td mat-cell *matCellDef="let nonRPeer"><span fxLayoutAlign="end center">{{nonRPeer.commit_weight | number}} </span></td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="fee_per_kw">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Fee/KW</th>
|
||||
<td mat-cell *matCellDef="let nonRPeer"><span fxLayoutAlign="end center">{{nonRPeer.fee_per_kw | number}} </span></td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="num_updates">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Updates</th>
|
||||
<td mat-cell *matCellDef="let nonRPeer"><span fxLayoutAlign="end center">{{nonRPeer.num_updates | number}} </span></td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="unsettled_balance">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Unsettled Balance (Sats)</th>
|
||||
<td mat-cell *matCellDef="let nonRPeer"><span fxLayoutAlign="end center">{{nonRPeer.unsettled_balance | number}} </span></td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="capacity">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Capacity (Sats)</th>
|
||||
<td mat-cell *matCellDef="let nonRPeer"><span fxLayoutAlign="end center">{{nonRPeer.capacity | number}} </span></td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="local_chan_reserve_sat">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Local Reserve (Sats)</th>
|
||||
<td mat-cell *matCellDef="let nonRPeer"><span fxLayoutAlign="end center">{{nonRPeer.local_chan_reserve_sat | number}} </span></td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="remote_chan_reserve_sat">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Remote Reserve (Sats)</th>
|
||||
<td mat-cell *matCellDef="let nonRPeer"><span fxLayoutAlign="end center">{{nonRPeer.remote_chan_reserve_sat | number}} </span></td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="total_satoshis_sent">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Sats Sent</th>
|
||||
|
||||
@ -1,10 +1,33 @@
|
||||
.mat-column-chan_id, .mat-column-alias {
|
||||
flex: 1 1 25%;
|
||||
@import "../../../shared/theme/styles/mixins.scss";
|
||||
|
||||
.mat-column-chan_id, .mat-column-remote_alias, .mat-column-remote_pubkey, .mat-column-channel_point {
|
||||
flex: 1 1 20%;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.mat-column-uptime, .mat-column-lifetime, .mat-column-local_balance, .mat-column-remote_balance, .mat-column-total_satoshis_sent, .mat-column-total_satoshis_received {
|
||||
flex: 1 1 10%;
|
||||
width: 10%;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
@include for_screensize(tab-land) {
|
||||
white-space: unset;
|
||||
flex: 1 1 25%;
|
||||
width: 25%;
|
||||
}
|
||||
@include for_screensize(tab-port) {
|
||||
flex: 0 0 15%;
|
||||
width: 15%;
|
||||
}
|
||||
@include for_screensize(phone) {
|
||||
white-space: unset;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.mat-column-actions {
|
||||
min-height: 4.8rem;
|
||||
}
|
||||
|
||||
@ -1,4 +1,5 @@
|
||||
import { Component, OnInit, ViewChild, OnDestroy, AfterViewInit } from '@angular/core';
|
||||
import { DecimalPipe } from '@angular/common';
|
||||
import { Subject } from 'rxjs';
|
||||
import { takeUntil } from 'rxjs/operators';
|
||||
import { Store } from '@ngrx/store';
|
||||
@ -40,11 +41,12 @@ export class NonRoutingPeersComponent implements OnInit, AfterViewInit, OnDestro
|
||||
public errorMessage = '';
|
||||
public filter = '';
|
||||
public activeChannels: Channel[] = [];
|
||||
public timeUnit = 'mins:secs';
|
||||
public apiCallStatus: ApiCallStatusPayload | null = null;
|
||||
public apiCallStatusEnum = APICallStatusEnum;
|
||||
private unSubs: Array<Subject<void>> = [new Subject(), new Subject(), new Subject(), new Subject(), new Subject()];
|
||||
|
||||
constructor(private logger: LoggerService, private commonService: CommonService, private store: Store<RTLState>, private router: Router, private activatedRoute: ActivatedRoute) {
|
||||
constructor(private logger: LoggerService, private commonService: CommonService, private store: Store<RTLState>, private router: Router, private activatedRoute: ActivatedRoute, private decimalPipe: DecimalPipe) {
|
||||
this.screenSize = this.commonService.getScreenSize();
|
||||
}
|
||||
|
||||
@ -102,6 +104,57 @@ export class NonRoutingPeersComponent implements OnInit, AfterViewInit, OnDestro
|
||||
}
|
||||
}
|
||||
|
||||
calculateUptime(channels: Channel[]) {
|
||||
const minutesDivider = 60;
|
||||
const hoursDivider = minutesDivider * 60;
|
||||
const daysDivider = hoursDivider * 24;
|
||||
const yearsDivider = daysDivider * 365;
|
||||
let maxDivider = minutesDivider;
|
||||
let minDivider = 1;
|
||||
let max_uptime = 0;
|
||||
channels.forEach((channel) => {
|
||||
if (channel.uptime && +channel.uptime > max_uptime) {
|
||||
max_uptime = +channel.uptime;
|
||||
}
|
||||
});
|
||||
switch (true) {
|
||||
case max_uptime < hoursDivider:
|
||||
this.timeUnit = 'Mins:Secs';
|
||||
maxDivider = minutesDivider;
|
||||
minDivider = 1;
|
||||
break;
|
||||
|
||||
case max_uptime >= hoursDivider && max_uptime < daysDivider:
|
||||
this.timeUnit = 'Hrs:Mins';
|
||||
maxDivider = hoursDivider;
|
||||
minDivider = minutesDivider;
|
||||
break;
|
||||
|
||||
case max_uptime >= daysDivider && max_uptime < yearsDivider:
|
||||
this.timeUnit = 'Days:Hrs';
|
||||
maxDivider = daysDivider;
|
||||
minDivider = hoursDivider;
|
||||
break;
|
||||
|
||||
case max_uptime > yearsDivider:
|
||||
this.timeUnit = 'Yrs:Days';
|
||||
maxDivider = yearsDivider;
|
||||
minDivider = daysDivider;
|
||||
break;
|
||||
|
||||
default:
|
||||
this.timeUnit = 'Mins:Secs';
|
||||
maxDivider = minutesDivider;
|
||||
minDivider = 1;
|
||||
break;
|
||||
}
|
||||
channels.forEach((channel) => {
|
||||
channel.uptime_str = channel.uptime ? (this.decimalPipe.transform(Math.floor(+channel.uptime / maxDivider), '2.0-0') + ':' + this.decimalPipe.transform(Math.round((+channel.uptime % maxDivider) / minDivider), '2.0-0')) : '---';
|
||||
channel.lifetime_str = channel.lifetime ? (this.decimalPipe.transform(Math.floor(+channel.lifetime / maxDivider), '2.0-0') + ':' + this.decimalPipe.transform(Math.round((+channel.lifetime % maxDivider) / minDivider), '2.0-0')) : '---';
|
||||
});
|
||||
return channels;
|
||||
}
|
||||
|
||||
onManagePeer(selNonRoutingChannel: Channel) {
|
||||
this.router.navigate(['../../', 'connections', 'channels', 'open'], { relativeTo: this.activatedRoute, state: { filter: selNonRoutingChannel.chan_id } });
|
||||
}
|
||||
@ -134,7 +187,7 @@ export class NonRoutingPeersComponent implements OnInit, AfterViewInit, OnDestro
|
||||
loadNonRoutingPeersTable(forwardingEvents: ForwardingEvent[]) {
|
||||
if (forwardingEvents.length > 0) {
|
||||
// const grpdRoutingPeers = this.groupRoutingPeers(forwardingEvents);
|
||||
const filteredNonRoutingChannels = this.activeChannels?.filter((actvChnl) => forwardingEvents.findIndex((evnt) => (evnt.chan_id_in === actvChnl.chan_id || evnt.chan_id_out === actvChnl.chan_id)) < 0);
|
||||
const filteredNonRoutingChannels = this.calculateUptime(this.activeChannels?.filter((actvChnl) => forwardingEvents.findIndex((evnt) => (evnt.chan_id_in === actvChnl.chan_id || evnt.chan_id_out === actvChnl.chan_id)) < 0));
|
||||
this.NonRoutingPeers = new MatTableDataSource<Channel>(filteredNonRoutingChannels);
|
||||
this.NonRoutingPeers.sort = this.sort;
|
||||
this.NonRoutingPeers.sort?.sort({ id: this.tableSetting.sortBy, start: this.tableSetting.sortOrder, disableClear: true });
|
||||
|
||||
@ -998,8 +998,8 @@ export const LND_TABLES_DEF = {
|
||||
allowedColumns: ['chan_id', 'alias', 'events', 'total_amount']
|
||||
},
|
||||
non_routing_peers: {
|
||||
maxColumns: 6,
|
||||
allowedColumns: ['chan_id', 'remote_alias', 'total_satoshis_received', 'total_satoshis_sent', 'local_balance', 'remote_balance']
|
||||
maxColumns: 8,
|
||||
allowedColumns: ['chan_id', 'remote_alias', 'remote_pubkey', 'channel_point', 'uptime', 'lifetime', 'commit_fee', 'commit_weight', 'fee_per_kw', 'num_updates', 'unsettled_balance', 'capacity', 'local_chan_reserve_sat', 'remote_chan_reserve_sat', 'total_satoshis_sent', 'total_satoshis_received', 'local_balance', 'remote_balance']
|
||||
}
|
||||
},
|
||||
reports: {
|
||||
|
||||
Loading…
Reference in New Issue
Block a user