mirror of
https://github.com/Ride-The-Lightning/RTL.git
synced 2024-11-19 01:40:29 +01:00
CLN Peers and Channels Page Layout
This commit is contained in:
parent
c487379898
commit
eafc7835f8
@ -17,9 +17,8 @@ export const getPeers = (req, res, next) => {
|
||||
peer.alias = peer.id.substring(0, 20);
|
||||
}
|
||||
});
|
||||
const peers = (body) ? common.sortDescByStrKey(body, 'alias') : [];
|
||||
logger.log({ selectedNode: req.session.selectedNode, level: 'INFO', fileName: 'Peers', msg: 'Peers with Alias Received', data: peers });
|
||||
res.status(200).json(peers);
|
||||
logger.log({ selectedNode: req.session.selectedNode, level: 'INFO', fileName: 'Peers', msg: 'Peers with Alias Received', data: body });
|
||||
res.status(200).json(body || []);
|
||||
}).catch((errRes) => {
|
||||
const err = common.handleError(errRes, 'Peers', 'List Peers Error', req.session.selectedNode);
|
||||
return res.status(err.statusCode).json({ message: err.message, error: err.error });
|
||||
@ -33,12 +32,11 @@ export const postPeer = (req, res, next) => {
|
||||
}
|
||||
options.url = req.session.selectedNode.ln_server_url + '/v1/peer/connect';
|
||||
options.body = req.body;
|
||||
request.post(options).then((body) => {
|
||||
logger.log({ selectedNode: req.session.selectedNode, level: 'DEBUG', fileName: 'Peers', msg: 'Peer Connected', data: body });
|
||||
request.post(options).then((connectRes) => {
|
||||
logger.log({ selectedNode: req.session.selectedNode, level: 'DEBUG', fileName: 'Peers', msg: 'Peer Connected', data: connectRes });
|
||||
options.url = req.session.selectedNode.ln_server_url + '/v1/peer/listPeers';
|
||||
request(options).then((body) => {
|
||||
let peers = (body) ? common.sortDescByStrKey(body, 'alias') : [];
|
||||
peers = common.newestOnTop(peers, 'id', req.body.id);
|
||||
request(options).then((listPeersRes) => {
|
||||
const peers = listPeersRes ? common.newestOnTop(listPeersRes, 'id', req.body.id) : [];
|
||||
logger.log({ selectedNode: req.session.selectedNode, level: 'INFO', fileName: 'Peers', msg: 'Peers List after Connect Received', data: peers });
|
||||
res.status(201).json(peers);
|
||||
}).catch((errRes) => {
|
||||
|
@ -103,8 +103,8 @@ export const validatePageSettings = (documentToValidate) => {
|
||||
if (table[CollectionFieldsEnum.COLUMN_SELECTION_SM].length < 1) {
|
||||
errMsg = errMsg + 'Column Selection (Mobile) should have at least 1 field.';
|
||||
}
|
||||
if (table[CollectionFieldsEnum.COLUMN_SELECTION_SM].length > 2) {
|
||||
errMsg = errMsg + 'Column Selection (Mobile) should have maximum 2 fields.';
|
||||
if (table[CollectionFieldsEnum.COLUMN_SELECTION_SM].length > 3) {
|
||||
errMsg = errMsg + 'Column Selection (Mobile) should have maximum 3 fields.';
|
||||
}
|
||||
if (!table.hasOwnProperty(CollectionFieldsEnum.COLUMN_SELECTION)) {
|
||||
errMsg = errMsg + 'Column Selection (Desktop) is mandatory.';
|
||||
|
@ -16,9 +16,8 @@ export const getPeers = (req, res, next) => {
|
||||
peer.alias = peer.id.substring(0, 20);
|
||||
}
|
||||
});
|
||||
const peers = (body) ? common.sortDescByStrKey(body, 'alias') : [];
|
||||
logger.log({ selectedNode: req.session.selectedNode, level: 'INFO', fileName: 'Peers', msg: 'Peers with Alias Received', data: peers });
|
||||
res.status(200).json(peers);
|
||||
logger.log({ selectedNode: req.session.selectedNode, level: 'INFO', fileName: 'Peers', msg: 'Peers with Alias Received', data: body });
|
||||
res.status(200).json(body || []);
|
||||
}).catch((errRes) => {
|
||||
const err = common.handleError(errRes, 'Peers', 'List Peers Error', req.session.selectedNode);
|
||||
return res.status(err.statusCode).json({ message: err.message, error: err.error });
|
||||
@ -31,12 +30,11 @@ export const postPeer = (req, res, next) => {
|
||||
if (options.error) { return res.status(options.statusCode).json({ message: options.message, error: options.error }); }
|
||||
options.url = req.session.selectedNode.ln_server_url + '/v1/peer/connect';
|
||||
options.body = req.body;
|
||||
request.post(options).then((body) => {
|
||||
logger.log({ selectedNode: req.session.selectedNode, level: 'DEBUG', fileName: 'Peers', msg: 'Peer Connected', data: body });
|
||||
request.post(options).then((connectRes) => {
|
||||
logger.log({ selectedNode: req.session.selectedNode, level: 'DEBUG', fileName: 'Peers', msg: 'Peer Connected', data: connectRes });
|
||||
options.url = req.session.selectedNode.ln_server_url + '/v1/peer/listPeers';
|
||||
request(options).then((body) => {
|
||||
let peers = (body) ? common.sortDescByStrKey(body, 'alias') : [];
|
||||
peers = common.newestOnTop(peers, 'id', req.body.id);
|
||||
request(options).then((listPeersRes) => {
|
||||
const peers = listPeersRes ? common.newestOnTop(listPeersRes, 'id', req.body.id) : [];
|
||||
logger.log({ selectedNode: req.session.selectedNode, level: 'INFO', fileName: 'Peers', msg: 'Peers List after Connect Received', data: peers });
|
||||
res.status(201).json(peers);
|
||||
}).catch((errRes) => {
|
||||
|
@ -114,8 +114,8 @@ export const validatePageSettings = (documentToValidate): any => {
|
||||
if (table[CollectionFieldsEnum.COLUMN_SELECTION_SM].length < 1) {
|
||||
errMsg = errMsg + 'Column Selection (Mobile) should have at least 1 field.';
|
||||
}
|
||||
if (table[CollectionFieldsEnum.COLUMN_SELECTION_SM].length > 2) {
|
||||
errMsg = errMsg + 'Column Selection (Mobile) should have maximum 2 fields.';
|
||||
if (table[CollectionFieldsEnum.COLUMN_SELECTION_SM].length > 3) {
|
||||
errMsg = errMsg + 'Column Selection (Mobile) should have maximum 3 fields.';
|
||||
}
|
||||
if (!table.hasOwnProperty(CollectionFieldsEnum.COLUMN_SELECTION)) {
|
||||
errMsg = errMsg + 'Column Selection (Desktop) is mandatory.';
|
||||
|
@ -59,7 +59,7 @@
|
||||
<ng-container matColumnDef="actions">
|
||||
<th mat-header-cell *matHeaderCellDef class="pl-4 pr-3"><span fxLayoutAlign="end center">Actions</span></th>
|
||||
<td mat-cell *matCellDef="let hop" class="pl-4">
|
||||
<button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onHopClick(hop, $event)">View Info</button>
|
||||
<button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onHopClick(hop, $event)"class="table-actions-button">View Info</button>
|
||||
</td>
|
||||
</ng-container>
|
||||
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
|
||||
|
@ -1,6 +1,5 @@
|
||||
.mat-column-actions {
|
||||
flex: 0 0 5%;
|
||||
width: 5%;
|
||||
min-height: 4.8rem;
|
||||
}
|
||||
|
||||
.mat-column-pubkey_alias {
|
||||
|
@ -99,7 +99,7 @@
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="actions">
|
||||
<th mat-header-cell *matHeaderCellDef class="px-3">
|
||||
<div class="bordered-box table-actions-select">
|
||||
<div class="bordered-box table-actions-select" fxLayoutAlign="center center">
|
||||
<mat-select placeholder="Actions" tabindex="1" class="mr-0">
|
||||
<mat-select-trigger></mat-select-trigger>
|
||||
<mat-option (click)="onDownloadCSV()">Download CSV</mat-option>
|
||||
|
@ -125,7 +125,7 @@ export class CLNLiquidityAdsListComponent implements OnInit, OnDestroy {
|
||||
this.liquidityNodes.sortingDataAccessor = (data: any, sortHeaderId: string) => ((data[sortHeaderId] && isNaN(data[sortHeaderId])) ? data[sortHeaderId].toLocaleLowerCase() : data[sortHeaderId] ? +data[sortHeaderId] : null);
|
||||
this.liquidityNodes.sort = this.sort;
|
||||
this.liquidityNodes.paginator = this.paginator;
|
||||
if (this.sort) { this.sort.sort({ id: 'channelOpeningFee', start: 'asc', disableClear: true }); }
|
||||
if (this.sort) { this.sort?.sort({ id: 'channelOpeningFee', start: 'asc', disableClear: true }); }
|
||||
this.liquidityNodes.filterPredicate = (node: LookupNode, fltr: string) => {
|
||||
const newNode = ((node.alias) ? node.alias.toLocaleLowerCase() : '') + (node.channelOpeningFee ? node.channelOpeningFee + ' Sats' : '') +
|
||||
(node.option_will_fund?.lease_fee_base_msat ? (node.option_will_fund?.lease_fee_base_msat / 1000) + ' Sats' : '') + (node.option_will_fund?.lease_fee_basis ? (this.decimalPipe.transform(node.option_will_fund?.lease_fee_basis / 100, '1.2-2') + '%') : '') +
|
||||
|
@ -72,7 +72,7 @@
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="actions">
|
||||
<th mat-header-cell *matHeaderCellDef class="pr-3">
|
||||
<div class="bordered-box table-actions-select">
|
||||
<div class="bordered-box table-actions-select" fxLayoutAlign="center center">
|
||||
<mat-select placeholder="Actions" tabindex="1" class="mr-0">
|
||||
<mat-select-trigger></mat-select-trigger>
|
||||
<mat-option (click)="onDownloadCSV()">Download CSV</mat-option>
|
||||
@ -80,7 +80,7 @@
|
||||
</div>
|
||||
</th>
|
||||
<td mat-cell *matCellDef="let utxo" fxLayoutAlign="end center">
|
||||
<button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onUTXOClick(utxo, $event)">View Info</button>
|
||||
<button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onUTXOClick(utxo, $event)"class="table-actions-button">View Info</button>
|
||||
</td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="no_utxo">
|
||||
|
@ -122,7 +122,7 @@ export class CLNOnChainUtxosComponent implements OnInit, AfterViewInit, OnDestro
|
||||
this.listUTXOs = new MatTableDataSource<UTXO>([...utxos]);
|
||||
this.listUTXOs.sortingDataAccessor = (data: any, sortHeaderId: string) => ((data[sortHeaderId] && isNaN(data[sortHeaderId])) ? data[sortHeaderId].toLocaleLowerCase() : data[sortHeaderId] ? +data[sortHeaderId] : null);
|
||||
this.listUTXOs.sort = this.sort;
|
||||
this.listUTXOs.sort.sort({ id: this.tableSetting.sortBy, start: this.tableSetting.sortOrder, disableClear: true });
|
||||
this.listUTXOs.sort?.sort({ id: this.tableSetting.sortBy, start: this.tableSetting.sortOrder, disableClear: true });
|
||||
this.listUTXOs.filterPredicate = (utxo: UTXO, fltr: string) => JSON.stringify(utxo).toLowerCase().includes(fltr);
|
||||
this.listUTXOs.paginator = this.paginator;
|
||||
this.applyFilter();
|
||||
|
@ -1,4 +1,4 @@
|
||||
<div fxLayout="column" class="padding-gap">
|
||||
<div fxLayout="column">
|
||||
<div fxLayout="column" fxLayout.gt-xs="row" fxLayoutAlign.gt-xs="start center" fxLayoutAlign="start stretch" class="page-sub-title-container">
|
||||
<div fxFlex="70"></div>
|
||||
<mat-form-field fxFlex="30">
|
||||
@ -8,59 +8,90 @@
|
||||
<mat-progress-bar *ngIf="apiCallStatus.status === apiCallStatusEnum.INITIATED" mode="indeterminate"></mat-progress-bar>
|
||||
<div [perfectScrollbar] fxLayout="row" fxLayoutAlign="start center" fxFlex="100" class="table-container w-100">
|
||||
<table mat-table #table [dataSource]="channels" matSort [ngClass]="{'overflow-auto error-border': errorMessage !== '','overflow-auto': true}">
|
||||
<ng-container matColumnDef="short_channel_id">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header> Short Channel ID </th>
|
||||
<ng-container matColumnDef="private">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header></th>
|
||||
<td mat-cell *matCellDef="let channel">
|
||||
<span *ngIf="channel.private" class="mr-1" matTooltip="Private" matTooltipPosition="right"><fa-icon [icon]="faEyeSlash"></fa-icon></span>
|
||||
<span *ngIf="!channel.private" class="mr-1" matTooltip="Public" matTooltipPosition="right"><fa-icon [icon]="faEye"></fa-icon></span>
|
||||
</td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="short_channel_id">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> Short Channel ID </th>
|
||||
<td mat-cell *matCellDef="let channel" class="pl-1">
|
||||
<div class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '12rem' : '22rem'}">
|
||||
<span *ngIf="channel.private" class="mr-1" matTooltip="Private" matTooltipPosition="right"><fa-icon [icon]="faEyeSlash"></fa-icon></span>
|
||||
<span *ngIf="!channel.private" class="mr-1" matTooltip="Public" matTooltipPosition="right"><fa-icon [icon]="faEye"></fa-icon></span>
|
||||
<span class="ellipsis-child">{{channel?.short_channel_id}}</span>
|
||||
</div>
|
||||
</td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="alias">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header> Alias </th>
|
||||
<td mat-cell *matCellDef="let channel">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> Alias </th>
|
||||
<td mat-cell *matCellDef="let channel" class="pl-1">
|
||||
<div class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '12rem' : '22rem'}">
|
||||
<span class="ellipsis-child">{{channel?.alias}}</span>
|
||||
</div>
|
||||
</td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="id">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> Id </th>
|
||||
<td mat-cell *matCellDef="let channel" class="pl-1">
|
||||
<div class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '12rem' : '22rem'}">
|
||||
<span class="ellipsis-child">{{channel?.id}}</span>
|
||||
</div>
|
||||
</td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="channel_id">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> Channel Id </th>
|
||||
<td mat-cell *matCellDef="let channel" class="pl-1">
|
||||
<div class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '12rem' : '22rem'}">
|
||||
<span class="ellipsis-child">{{channel?.channel_id}}</span>
|
||||
</div>
|
||||
</td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="funding_txid">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> Funding Transaction Id </th>
|
||||
<td mat-cell *matCellDef="let channel" class="pl-1">
|
||||
<div class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '12rem' : '22rem'}">
|
||||
<span class="ellipsis-child">{{channel?.funding_txid}}</span>
|
||||
</div>
|
||||
</td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="connected">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header> Connected </th>
|
||||
<td mat-cell *matCellDef="let channel"> {{(channel?.connected) ? 'Connected' : 'Disconnected'}} </td>
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> Connected </th>
|
||||
<td mat-cell *matCellDef="let channel" class="pl-1"> {{(channel?.connected) ? 'Connected' : 'Disconnected'}} </td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="private">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header> Private </th>
|
||||
<td mat-cell *matCellDef="let channel"> {{(channel?.private ? 'Private' : 'Public')}} </td>
|
||||
<ng-container matColumnDef="our_channel_reserve_satoshis">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before" class="pl-1"> Local Reserve (Sats) </th>
|
||||
<td mat-cell *matCellDef="let channel" class="pl-1"><span fxLayoutAlign="end center">
|
||||
{{channel?.our_channel_reserve_satoshis | number:'1.0-0'}} </span></td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="state">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header> State </th>
|
||||
<td mat-cell *matCellDef="let channel"> {{channel?.state}}</td>
|
||||
<ng-container matColumnDef="their_channel_reserve_satoshis">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before" class="pl-1"> Remote Reserve (Sats) </th>
|
||||
<td mat-cell *matCellDef="let channel" class="pl-1"><span fxLayoutAlign="end center">
|
||||
{{channel?.their_channel_reserve_satoshis | number:'1.0-0'}} </span></td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="msatoshi_total">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before" class="pl-1"> Total (Sats) </th>
|
||||
<td mat-cell *matCellDef="let channel" class="pl-1"><span fxLayoutAlign="end center">
|
||||
{{channel?.msatoshi_total/1000 | number:channel?.msatoshi_to_us < 1000 ? '1.0-4' : '1.0-0'}} </span></td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="spendable_msatoshi">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before" class="pl-1"> Spendable (Sats) </th>
|
||||
<td mat-cell *matCellDef="let channel" class="pl-1"><span fxLayoutAlign="end center">
|
||||
{{channel?.spendable_msatoshi/1000 | number:channel?.msatoshi_to_us < 1000 ? '1.0-4' : '1.0-0'}} </span></td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="msatoshi_to_us">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before"> Local Balance (Sats) </th>
|
||||
<td mat-cell *matCellDef="let channel"><span fxLayoutAlign="end center">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before" class="pl-1"> Local Balance (Sats) </th>
|
||||
<td mat-cell *matCellDef="let channel" class="pl-1"><span fxLayoutAlign="end center">
|
||||
{{channel?.msatoshi_to_us/1000 | number:channel?.msatoshi_to_us < 1000 ? '1.0-4' : '1.0-0'}} </span></td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="msatoshi_to_them">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before"> Remote Balance (Sats) </th>
|
||||
<td mat-cell *matCellDef="let channel"><span fxLayoutAlign="end center">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before" class="pl-1"> Remote Balance (Sats) </th>
|
||||
<td mat-cell *matCellDef="let channel" class="pl-1"><span fxLayoutAlign="end center">
|
||||
{{channel?.msatoshi_to_them/1000 | number:channel?.msatoshi_to_them < 1000 ? '1.0-4' : '1.0-0'}} </span></td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="msatoshi_total">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before"> Total mSatoshis </th>
|
||||
<td mat-cell *matCellDef="let channel"><span fxLayoutAlign="end center">
|
||||
{{channel?.msatoshi_total | number}} </span></td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="spendable_msatoshi">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before"> Spendable Satoshi </th>
|
||||
<td mat-cell *matCellDef="let channel"><span fxLayoutAlign="end center">
|
||||
{{channel?.spendable_msatoshi | number}} </span></td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="balancedness">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-3">Balance Score </th>
|
||||
<td mat-cell *matCellDef="let channel" class="pl-3">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-2">Balance Score </th>
|
||||
<td mat-cell *matCellDef="let channel" class="pl-2">
|
||||
<div fxLayout="row">
|
||||
<mat-hint fxFlex="100" fxLayoutAlign="center center" class="font-size-80">{{channel.balancedness || 0 | number}}</mat-hint>
|
||||
</div>
|
||||
@ -69,7 +100,7 @@
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="actions">
|
||||
<th mat-header-cell *matHeaderCellDef class="pl-1">
|
||||
<div class="bordered-box table-actions-select">
|
||||
<div class="bordered-box table-actions-select" fxLayoutAlign="center center">
|
||||
<mat-select placeholder="Actions" tabindex="1" class="mr-0">
|
||||
<mat-select-trigger></mat-select-trigger>
|
||||
<mat-option (click)="onChannelUpdate('all')">Update Fee Policy</mat-option>
|
||||
|
@ -1,16 +1,12 @@
|
||||
@import "../../../../../shared/theme/styles/mixins.scss";
|
||||
|
||||
.mat-column-short_channel_id {
|
||||
flex: 0 0 15%;
|
||||
width: 15%;
|
||||
& .ellipsis-parent {
|
||||
display: flex;
|
||||
}
|
||||
.mat-column-private {
|
||||
width: 2rem;
|
||||
}
|
||||
|
||||
.mat-column-alias {
|
||||
flex: 0 0 20%;
|
||||
width: 20%;
|
||||
.mat-column-short_channel_id, .mat-column-alias, .mat-column-id, .mat-column-channel_id, .mat-column-funding_txid {
|
||||
flex: 0 0 15%;
|
||||
width: 15%;
|
||||
& .ellipsis-parent {
|
||||
display: flex;
|
||||
}
|
||||
@ -35,10 +31,4 @@
|
||||
|
||||
.mat-column-actions {
|
||||
min-height: 4.8rem;
|
||||
& .bordered-box.table-actions-select {
|
||||
flex: 0 0 100%;
|
||||
@include for_screensize(phone) {
|
||||
flex: 0 0 80%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -9,7 +9,7 @@ import { MatPaginator, MatPaginatorIntl } from '@angular/material/paginator';
|
||||
import { MatSort } from '@angular/material/sort';
|
||||
import { MatTableDataSource } from '@angular/material/table';
|
||||
import { Channel, GetInfo, ChannelEdge, Balance } from '../../../../../shared/models/clnModels';
|
||||
import { PAGE_SIZE, PAGE_SIZE_OPTIONS, getPaginatorLabel, AlertTypeEnum, DataTypeEnum, ScreenSizeEnum, FEE_RATE_TYPES, APICallStatusEnum, UI_MESSAGES } from '../../../../../shared/services/consts-enums-functions';
|
||||
import { PAGE_SIZE, PAGE_SIZE_OPTIONS, getPaginatorLabel, AlertTypeEnum, DataTypeEnum, ScreenSizeEnum, FEE_RATE_TYPES, APICallStatusEnum, UI_MESSAGES, CLN_DEFAULT_PAGE_SETTINGS, SortOrderEnum } from '../../../../../shared/services/consts-enums-functions';
|
||||
import { ApiCallStatusPayload } from '../../../../../shared/models/apiCallsPayload';
|
||||
import { LoggerService } from '../../../../../shared/services/logger.service';
|
||||
import { CommonService } from '../../../../../shared/services/common.service';
|
||||
@ -21,7 +21,8 @@ import { RTLEffects } from '../../../../../store/rtl.effects';
|
||||
import { openAlert, openConfirmation } from '../../../../../store/rtl.actions';
|
||||
import { RTLState } from '../../../../../store/rtl.state';
|
||||
import { channelLookup, closeChannel, updateChannel } from '../../../../store/cln.actions';
|
||||
import { channels, nodeInfoAndBalanceAndNumPeers } from '../../../../store/cln.selector';
|
||||
import { channels, clnPageSettings, nodeInfoAndBalanceAndNumPeers } from '../../../../store/cln.selector';
|
||||
import { PageSettingsCLN, TableSetting } from '../../../../../shared/models/pageSettings';
|
||||
|
||||
@Component({
|
||||
selector: 'rtl-cln-channel-open-table',
|
||||
@ -37,6 +38,8 @@ export class CLNChannelOpenTableComponent implements OnInit, AfterViewInit, OnDe
|
||||
@ViewChild(MatPaginator, { static: false }) paginator: MatPaginator | undefined;
|
||||
public faEye = faEye;
|
||||
public faEyeSlash = faEyeSlash;
|
||||
public PAGE_ID = 'peers/channels';
|
||||
public tableSetting: TableSetting = { tableId: 'open_channels', recordsPerPage: PAGE_SIZE, sortBy: 'alias', sortOrder: SortOrderEnum.DESCENDING };
|
||||
public totalBalance = 0;
|
||||
public displayedColumns: any[] = [];
|
||||
public channelsData: Channel[] = [];
|
||||
@ -53,19 +56,10 @@ export class CLNChannelOpenTableComponent implements OnInit, AfterViewInit, OnDe
|
||||
public errorMessage = '';
|
||||
public apiCallStatus: ApiCallStatusPayload | null = null;
|
||||
public apiCallStatusEnum = APICallStatusEnum;
|
||||
private unSubs: Array<Subject<void>> = [new Subject(), new Subject(), new Subject(), new Subject(), new Subject(), new Subject()];
|
||||
private unSubs: Array<Subject<void>> = [new Subject(), new Subject(), new Subject(), new Subject(), new Subject(), new Subject(), new Subject(), new Subject(), new Subject()];
|
||||
|
||||
constructor(private logger: LoggerService, private store: Store<RTLState>, private rtlEffects: RTLEffects, private clnEffects: CLNEffects, private commonService: CommonService, private router: Router) {
|
||||
this.screenSize = this.commonService.getScreenSize();
|
||||
if (this.screenSize === ScreenSizeEnum.XS) {
|
||||
this.displayedColumns = ['alias', 'msatoshi_to_us', 'msatoshi_to_them', 'actions'];
|
||||
} else if (this.screenSize === ScreenSizeEnum.SM) {
|
||||
this.displayedColumns = ['short_channel_id', 'alias', 'msatoshi_to_us', 'msatoshi_to_them', 'actions'];
|
||||
} else if (this.screenSize === ScreenSizeEnum.MD) {
|
||||
this.displayedColumns = ['short_channel_id', 'alias', 'msatoshi_to_us', 'msatoshi_to_them', 'actions'];
|
||||
} else {
|
||||
this.displayedColumns = ['short_channel_id', 'alias', 'msatoshi_to_us', 'msatoshi_to_them', 'balancedness', 'actions'];
|
||||
}
|
||||
this.selFilter = this.router?.getCurrentNavigation()?.extras?.state?.filter ? this.router?.getCurrentNavigation()?.extras?.state?.filter : '';
|
||||
}
|
||||
|
||||
@ -77,7 +71,25 @@ export class CLNChannelOpenTableComponent implements OnInit, AfterViewInit, OnDe
|
||||
this.totalBalance = infoBalNumpeersSelector.balance.totalBalance || 0;
|
||||
this.logger.info(infoBalNumpeersSelector);
|
||||
});
|
||||
this.store.select(channels).pipe(takeUntil(this.unSubs[1])).
|
||||
this.store.select(clnPageSettings).pipe(takeUntil(this.unSubs[1])).
|
||||
subscribe((settings: { pageSettings: PageSettingsCLN[], apiCallStatus: ApiCallStatusPayload }) => {
|
||||
this.errorMessage = '';
|
||||
this.apiCallStatus = settings.apiCallStatus;
|
||||
if (this.apiCallStatus.status === APICallStatusEnum.ERROR) {
|
||||
this.errorMessage = this.apiCallStatus.message || '';
|
||||
}
|
||||
this.tableSetting = settings.pageSettings.find((page) => page.pageId === this.PAGE_ID)?.tables.find((table) => table.tableId === this.tableSetting.tableId) || CLN_DEFAULT_PAGE_SETTINGS.find((page) => page.pageId === this.PAGE_ID)?.tables.find((table) => table.tableId === this.tableSetting.tableId)!;
|
||||
if (this.screenSize === ScreenSizeEnum.XS || this.screenSize === ScreenSizeEnum.SM) {
|
||||
this.displayedColumns = JSON.parse(JSON.stringify(this.tableSetting.columnSelectionSM));
|
||||
} else {
|
||||
this.displayedColumns = JSON.parse(JSON.stringify(this.tableSetting.columnSelection));
|
||||
}
|
||||
this.displayedColumns.unshift('private');
|
||||
this.displayedColumns.push('actions');
|
||||
this.pageSize = this.tableSetting.recordsPerPage ? +this.tableSetting.recordsPerPage : PAGE_SIZE;
|
||||
this.logger.info(this.displayedColumns);
|
||||
});
|
||||
this.store.select(channels).pipe(takeUntil(this.unSubs[2])).
|
||||
subscribe((channelsSeletor: { activeChannels: Channel[], pendingChannels: Channel[], inactiveChannels: Channel[], apiCallStatus: ApiCallStatusPayload }) => {
|
||||
this.errorMessage = '';
|
||||
this.apiCallStatus = channelsSeletor.apiCallStatus;
|
||||
@ -154,7 +166,7 @@ export class CLNChannelOpenTableComponent implements OnInit, AfterViewInit, OnDe
|
||||
}
|
||||
}
|
||||
}));
|
||||
this.rtlEffects.closeConfirm.pipe(takeUntil(this.unSubs[1])).subscribe((confirmRes) => {
|
||||
this.rtlEffects.closeConfirm.pipe(takeUntil(this.unSubs[3])).subscribe((confirmRes) => {
|
||||
if (confirmRes) {
|
||||
const base_fee = confirmRes[0].inputValue;
|
||||
const fee_rate = confirmRes[1].inputValue;
|
||||
@ -196,7 +208,7 @@ export class CLNChannelOpenTableComponent implements OnInit, AfterViewInit, OnDe
|
||||
}, 0);
|
||||
});
|
||||
this.rtlEffects.closeConfirm.
|
||||
pipe(takeUntil(this.unSubs[2])).
|
||||
pipe(takeUntil(this.unSubs[4])).
|
||||
subscribe((confirmRes) => {
|
||||
if (confirmRes) {
|
||||
const base_fee = confirmRes[0].inputValue;
|
||||
@ -225,7 +237,7 @@ export class CLNChannelOpenTableComponent implements OnInit, AfterViewInit, OnDe
|
||||
}
|
||||
}));
|
||||
this.rtlEffects.closeConfirm.
|
||||
pipe(takeUntil(this.unSubs[3])).
|
||||
pipe(takeUntil(this.unSubs[5])).
|
||||
subscribe((confirmRes) => {
|
||||
if (confirmRes) {
|
||||
this.store.dispatch(closeChannel({ payload: { id: channelToClose.id || '', channelId: channelToClose.channel_id || '', force: false } }));
|
||||
@ -250,8 +262,11 @@ export class CLNChannelOpenTableComponent implements OnInit, AfterViewInit, OnDe
|
||||
}
|
||||
|
||||
loadChannelsTable(mychannels) {
|
||||
mychannels.sort((a, b) => ((a.active === b.active) ? 0 : ((b.active) ? 1 : -1)));
|
||||
// mychannels.sort((a, b) => ((a.active === b.active) ? 0 : ((b.active) ? 1 : -1)));
|
||||
this.channels = new MatTableDataSource<Channel>([...mychannels]);
|
||||
this.channels.sort = this.sort;
|
||||
this.channels.sortingDataAccessor = (data: any, sortHeaderId: string) => ((data[sortHeaderId] && isNaN(data[sortHeaderId])) ? data[sortHeaderId].toLocaleLowerCase() : data[sortHeaderId] ? +data[sortHeaderId] : null);
|
||||
this.channels.sort?.sort({ id: this.tableSetting.sortBy, start: this.tableSetting.sortOrder, disableClear: true });
|
||||
this.channels.filterPredicate = (channel: Channel, fltr: string) => {
|
||||
const newChannel = ((channel.connected) ? 'connected' : 'disconnected') + (channel.channel_id ? channel.channel_id.toLowerCase() : '') +
|
||||
(channel.short_channel_id ? channel.short_channel_id.toLowerCase() : '') + (channel.id ? channel.id.toLowerCase() : '') + (channel.alias ? channel.alias.toLowerCase() : '') +
|
||||
@ -261,8 +276,6 @@ export class CLNChannelOpenTableComponent implements OnInit, AfterViewInit, OnDe
|
||||
(channel.our_channel_reserve_satoshis ? channel.our_channel_reserve_satoshis : '') + (channel.spendable_msatoshi ? channel.spendable_msatoshi : '');
|
||||
return newChannel.includes(fltr);
|
||||
};
|
||||
this.channels.sort = this.sort;
|
||||
this.channels.sortingDataAccessor = (data: any, sortHeaderId: string) => ((data[sortHeaderId] && isNaN(data[sortHeaderId])) ? data[sortHeaderId].toLocaleLowerCase() : data[sortHeaderId] ? +data[sortHeaderId] : null);
|
||||
this.channels.paginator = this.paginator;
|
||||
this.applyFilter();
|
||||
this.logger.info(this.channels);
|
||||
|
@ -1,4 +1,4 @@
|
||||
<div fxLayout="column" class="padding-gap">
|
||||
<div fxLayout="column">
|
||||
<div fxLayout="column" fxLayout.gt-xs="row" fxLayoutAlign.gt-xs="start center" fxLayoutAlign="start stretch" class="page-sub-title-container">
|
||||
<div fxFlex="70"></div>
|
||||
<mat-form-field fxFlex="30">
|
||||
@ -8,52 +8,94 @@
|
||||
<mat-progress-bar *ngIf="apiCallStatus.status === apiCallStatusEnum.INITIATED" mode="indeterminate"></mat-progress-bar>
|
||||
<div [perfectScrollbar] fxLayout="row" fxLayoutAlign="start center" fxFlex="100" class="table-container w-100">
|
||||
<table mat-table #table [dataSource]="channels" matSort [ngClass]="{'overflow-auto error-border': errorMessage !== '','overflow-auto': true}">
|
||||
<ng-container matColumnDef="short_channel_id">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header> Short Channel ID </th>
|
||||
<td mat-cell *matCellDef="let channel"> {{channel?.short_channel_id}}</td>
|
||||
<ng-container matColumnDef="private">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header></th>
|
||||
<td mat-cell *matCellDef="let channel">
|
||||
<span *ngIf="channel.private" class="mr-1" matTooltip="Private" matTooltipPosition="right"><fa-icon [icon]="faEyeSlash"></fa-icon></span>
|
||||
<span *ngIf="!channel.private" class="mr-1" matTooltip="Public" matTooltipPosition="right"><fa-icon [icon]="faEye"></fa-icon></span>
|
||||
</td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="alias">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header> Alias </th>
|
||||
<td mat-cell *matCellDef="let channel">{{channel?.alias}}</td>
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> Alias </th>
|
||||
<td mat-cell *matCellDef="let channel" class="pl-1">
|
||||
<div class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '12rem' : '22rem'}">
|
||||
<span class="ellipsis-child">{{channel?.alias}}</span>
|
||||
</div>
|
||||
</td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="id">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> Id </th>
|
||||
<td mat-cell *matCellDef="let channel" class="pl-1">
|
||||
<div class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '12rem' : '22rem'}">
|
||||
<span class="ellipsis-child">{{channel?.id}}</span>
|
||||
</div>
|
||||
</td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="channel_id">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> Channel Id </th>
|
||||
<td mat-cell *matCellDef="let channel" class="pl-1">
|
||||
<div class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '12rem' : '22rem'}">
|
||||
<span class="ellipsis-child">{{channel?.channel_id}}</span>
|
||||
</div>
|
||||
</td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="funding_txid">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> Funding Transaction Id </th>
|
||||
<td mat-cell *matCellDef="let channel" class="pl-1">
|
||||
<div class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '12rem' : '22rem'}">
|
||||
<span class="ellipsis-child">{{channel?.funding_txid}}</span>
|
||||
</div>
|
||||
</td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="connected">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header> Connected </th>
|
||||
<td mat-cell *matCellDef="let channel"> {{(channel?.connected) ? 'Connected' : 'Disconnected'}} </td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="private">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header> Private </th>
|
||||
<td mat-cell *matCellDef="let channel"> {{(channel?.private ? 'Private' : 'Public')}} </td>
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> Connected </th>
|
||||
<td mat-cell *matCellDef="let channel" class="pl-1"> {{(channel?.connected) ? 'Connected' : 'Disconnected'}} </td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="state">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header> State </th>
|
||||
<td mat-cell *matCellDef="let channel" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : ''}"> {{CLNChannelPendingState[channel?.state]}} </td>
|
||||
<td mat-cell *matCellDef="let channel" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '12rem' : '22rem'}"> {{CLNChannelPendingState[channel?.state]}} </td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="msatoshi_to_us">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before"> mSatoshi To Us </th>
|
||||
<td mat-cell *matCellDef="let channel"><span fxLayoutAlign="end center">
|
||||
{{channel?.msatoshi_to_us | number}} </span></td>
|
||||
<ng-container matColumnDef="our_channel_reserve_satoshis">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before" class="pl-1"> Local Reserve (Sats) </th>
|
||||
<td mat-cell *matCellDef="let channel" class="pl-1"><span fxLayoutAlign="end center">
|
||||
{{channel?.our_channel_reserve_satoshis | number:'1.0-0'}} </span></td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="their_channel_reserve_satoshis">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before" class="pl-1"> Remote Reserve (Sats) </th>
|
||||
<td mat-cell *matCellDef="let channel" class="pl-1"><span fxLayoutAlign="end center">
|
||||
{{channel?.their_channel_reserve_satoshis | number:'1.0-0'}} </span></td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="msatoshi_total">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before"> Total (Sats) </th>
|
||||
<td mat-cell *matCellDef="let channel"><span fxLayoutAlign="end center">
|
||||
{{channel?.msatoshi_total/1000 | number}} </span></td>
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before" class="pl-1"> Total (Sats) </th>
|
||||
<td mat-cell *matCellDef="let channel" class="pl-1"><span fxLayoutAlign="end center">
|
||||
{{channel?.msatoshi_total/1000 | number:channel?.msatoshi_to_us < 1000 ? '1.0-4' : '1.0-0'}} </span></td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="spendable_msatoshi">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before"> Spendable Satoshi </th>
|
||||
<td mat-cell *matCellDef="let channel"><span fxLayoutAlign="end center">
|
||||
{{channel?.spendable_msatoshi | number}} </span></td>
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before" class="pl-1"> Spendable (Sats) </th>
|
||||
<td mat-cell *matCellDef="let channel" class="pl-1"><span fxLayoutAlign="end center">
|
||||
{{channel?.spendable_msatoshi/1000 | number:channel?.msatoshi_to_us < 1000 ? '1.0-4' : '1.0-0'}} </span></td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="msatoshi_to_us">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before" class="pl-1"> Local Balance (Sats) </th>
|
||||
<td mat-cell *matCellDef="let channel" class="pl-1"><span fxLayoutAlign="end center">
|
||||
{{channel?.msatoshi_to_us/1000 | number:channel?.msatoshi_to_us < 1000 ? '1.0-4' : '1.0-0'}} </span></td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="msatoshi_to_them">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before" class="pl-1"> Remote Balance (Sats) </th>
|
||||
<td mat-cell *matCellDef="let channel" class="pl-1"><span fxLayoutAlign="end center">
|
||||
{{channel?.msatoshi_to_them/1000 | number:channel?.msatoshi_to_them < 1000 ? '1.0-4' : '1.0-0'}} </span></td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="actions">
|
||||
<th mat-header-cell *matHeaderCellDef class="pr-3">
|
||||
<div class="bordered-box table-actions-select">
|
||||
<th mat-header-cell *matHeaderCellDef class="px-2">
|
||||
<div class="bordered-box table-actions-select" fxLayoutAlign="center center">
|
||||
<mat-select placeholder="Actions" tabindex="1" class="mr-0">
|
||||
<mat-select-trigger></mat-select-trigger>
|
||||
<mat-option (click)="onDownloadCSV()">Download CSV</mat-option>
|
||||
</mat-select>
|
||||
</div>
|
||||
</th>
|
||||
<td mat-cell *matCellDef="let channel" fxLayoutAlign="end center" class="pr-3">
|
||||
<div class="bordered-box table-actions-select">
|
||||
<td mat-cell *matCellDef="let channel" fxLayoutAlign="end center" class="px-2">
|
||||
<div class="bordered-box table-actions-select" fxLayoutAlign="center center">
|
||||
<mat-select placeholder="Actions" tabindex="4" class="mr-0">
|
||||
<mat-select-trigger></mat-select-trigger>
|
||||
<mat-option (click)="onChannelClick(channel, $event)">View Info</mat-option>
|
||||
|
@ -1,12 +1,28 @@
|
||||
@import "../../../../../shared/theme/styles/mixins.scss";
|
||||
|
||||
.mat-column-private {
|
||||
width: 2rem;
|
||||
}
|
||||
|
||||
.mat-column-short_channel_id, .mat-column-alias, .mat-column-id, .mat-column-channel_id, .mat-column-funding_txid {
|
||||
flex: 0 0 15%;
|
||||
width: 15%;
|
||||
& .ellipsis-parent {
|
||||
display: flex;
|
||||
}
|
||||
}
|
||||
|
||||
.mat-column-state, .mat-column-msatoshi_to_us, .mat-column-msatoshi_to_them {
|
||||
flex: 1 1 15%;
|
||||
width: 15%;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
@include for_screensize(phone) {
|
||||
white-space: unset;
|
||||
}
|
||||
}
|
||||
|
||||
.mat-column-actions {
|
||||
min-height: 4.8rem;
|
||||
}
|
||||
|
||||
.mat-column-state {
|
||||
flex: 1 1 15%;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
@ -5,9 +5,10 @@ import { Store } from '@ngrx/store';
|
||||
import { MatPaginator, MatPaginatorIntl } from '@angular/material/paginator';
|
||||
import { MatSort } from '@angular/material/sort';
|
||||
import { MatTableDataSource } from '@angular/material/table';
|
||||
import { faEye, faEyeSlash } from '@fortawesome/free-solid-svg-icons';
|
||||
|
||||
import { GetInfo, Channel, Balance } from '../../../../../shared/models/clnModels';
|
||||
import { PAGE_SIZE, PAGE_SIZE_OPTIONS, getPaginatorLabel, ScreenSizeEnum, FEE_RATE_TYPES, AlertTypeEnum, APICallStatusEnum, CLNChannelPendingState } from '../../../../../shared/services/consts-enums-functions';
|
||||
import { PAGE_SIZE, PAGE_SIZE_OPTIONS, getPaginatorLabel, ScreenSizeEnum, FEE_RATE_TYPES, AlertTypeEnum, APICallStatusEnum, CLNChannelPendingState, SortOrderEnum, CLN_DEFAULT_PAGE_SETTINGS } from '../../../../../shared/services/consts-enums-functions';
|
||||
import { ApiCallStatusPayload } from '../../../../../shared/models/apiCallsPayload';
|
||||
import { LoggerService } from '../../../../../shared/services/logger.service';
|
||||
import { CommonService } from '../../../../../shared/services/common.service';
|
||||
@ -18,7 +19,8 @@ import { CLNBumpFeeComponent } from '../../bump-fee-modal/bump-fee.component';
|
||||
import { openAlert, openConfirmation } from '../../../../../store/rtl.actions';
|
||||
import { RTLState } from '../../../../../store/rtl.state';
|
||||
import { closeChannel } from '../../../../store/cln.actions';
|
||||
import { channels, nodeInfoAndBalanceAndNumPeers } from '../../../../store/cln.selector';
|
||||
import { channels, clnPageSettings, nodeInfoAndBalanceAndNumPeers } from '../../../../store/cln.selector';
|
||||
import { PageSettingsCLN, TableSetting } from '../../../../../shared/models/pageSettings';
|
||||
|
||||
@Component({
|
||||
selector: 'rtl-cln-channel-pending-table',
|
||||
@ -32,6 +34,10 @@ export class CLNChannelPendingTableComponent implements OnInit, AfterViewInit, O
|
||||
|
||||
@ViewChild(MatSort, { static: false }) sort: MatSort | undefined;
|
||||
@ViewChild(MatPaginator, { static: false }) paginator: MatPaginator | undefined;
|
||||
public faEye = faEye;
|
||||
public faEyeSlash = faEyeSlash;
|
||||
public PAGE_ID = 'peers/channels';
|
||||
public tableSetting: TableSetting = { tableId: 'pending_inactive_channels', recordsPerPage: PAGE_SIZE, sortBy: 'alias', sortOrder: SortOrderEnum.DESCENDING };
|
||||
public isCompatibleVersion = false;
|
||||
public totalBalance = 0;
|
||||
public displayedColumns: any[] = [];
|
||||
@ -54,15 +60,6 @@ export class CLNChannelPendingTableComponent implements OnInit, AfterViewInit, O
|
||||
|
||||
constructor(private logger: LoggerService, private store: Store<RTLState>, private rtlEffects: RTLEffects, private commonService: CommonService) {
|
||||
this.screenSize = this.commonService.getScreenSize();
|
||||
if (this.screenSize === ScreenSizeEnum.XS) {
|
||||
this.displayedColumns = ['alias', 'state', 'actions'];
|
||||
} else if (this.screenSize === ScreenSizeEnum.SM) {
|
||||
this.displayedColumns = ['alias', 'connected', 'state', 'actions'];
|
||||
} else if (this.screenSize === ScreenSizeEnum.MD) {
|
||||
this.displayedColumns = ['alias', 'connected', 'state', 'msatoshi_total', 'actions'];
|
||||
} else {
|
||||
this.displayedColumns = ['alias', 'connected', 'state', 'msatoshi_total', 'actions'];
|
||||
}
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
@ -76,7 +73,25 @@ export class CLNChannelPendingTableComponent implements OnInit, AfterViewInit, O
|
||||
this.totalBalance = infoBalNumpeersSelector.balance.totalBalance || 0;
|
||||
this.logger.info(infoBalNumpeersSelector);
|
||||
});
|
||||
this.store.select(channels).pipe(takeUntil(this.unSubs[1])).
|
||||
this.store.select(clnPageSettings).pipe(takeUntil(this.unSubs[1])).
|
||||
subscribe((settings: { pageSettings: PageSettingsCLN[], apiCallStatus: ApiCallStatusPayload }) => {
|
||||
this.errorMessage = '';
|
||||
this.apiCallStatus = settings.apiCallStatus;
|
||||
if (this.apiCallStatus.status === APICallStatusEnum.ERROR) {
|
||||
this.errorMessage = this.apiCallStatus.message || '';
|
||||
}
|
||||
this.tableSetting = settings.pageSettings.find((page) => page.pageId === this.PAGE_ID)?.tables.find((table) => table.tableId === this.tableSetting.tableId) || CLN_DEFAULT_PAGE_SETTINGS.find((page) => page.pageId === this.PAGE_ID)?.tables.find((table) => table.tableId === this.tableSetting.tableId)!;
|
||||
if (this.screenSize === ScreenSizeEnum.XS || this.screenSize === ScreenSizeEnum.SM) {
|
||||
this.displayedColumns = JSON.parse(JSON.stringify(this.tableSetting.columnSelectionSM));
|
||||
} else {
|
||||
this.displayedColumns = JSON.parse(JSON.stringify(this.tableSetting.columnSelection));
|
||||
}
|
||||
this.displayedColumns.unshift('private');
|
||||
this.displayedColumns.push('actions');
|
||||
this.pageSize = this.tableSetting.recordsPerPage ? +this.tableSetting.recordsPerPage : PAGE_SIZE;
|
||||
this.logger.info(this.displayedColumns);
|
||||
});
|
||||
this.store.select(channels).pipe(takeUntil(this.unSubs[2])).
|
||||
subscribe((channelsSeletor: { activeChannels: Channel[], pendingChannels: Channel[], inactiveChannels: Channel[], apiCallStatus: ApiCallStatusPayload }) => {
|
||||
this.errorMessage = '';
|
||||
this.apiCallStatus = channelsSeletor.apiCallStatus;
|
||||
@ -138,7 +153,7 @@ export class CLNChannelPendingTableComponent implements OnInit, AfterViewInit, O
|
||||
}
|
||||
}));
|
||||
this.rtlEffects.closeConfirm.
|
||||
pipe(takeUntil(this.unSubs[2])).
|
||||
pipe(takeUntil(this.unSubs[3])).
|
||||
subscribe((confirmRes) => {
|
||||
if (confirmRes) {
|
||||
this.store.dispatch(closeChannel({ payload: { id: channelToClose.id!, channelId: channelToClose.channel_id!, force: true } }));
|
||||
@ -147,7 +162,7 @@ export class CLNChannelPendingTableComponent implements OnInit, AfterViewInit, O
|
||||
}
|
||||
|
||||
loadChannelsTable(mychannels) {
|
||||
mychannels.sort((a, b) => ((a.active === b.active) ? 0 : ((b.active) ? 1 : -1)));
|
||||
// mychannels.sort((a, b) => ((a.active === b.active) ? 0 : ((b.active) ? 1 : -1)));
|
||||
this.channels = new MatTableDataSource<Channel>([...mychannels]);
|
||||
this.channels.filterPredicate = (channel: Channel, fltr: string) => {
|
||||
const newChannel = ((channel.connected) ? 'connected' : 'disconnected') + (channel.channel_id ? channel.channel_id.toLowerCase() : '') +
|
||||
@ -168,6 +183,7 @@ export class CLNChannelPendingTableComponent implements OnInit, AfterViewInit, O
|
||||
return (data[sortHeaderId] && isNaN(data[sortHeaderId])) ? data[sortHeaderId].toLocaleLowerCase() : data[sortHeaderId] ? +data[sortHeaderId] : null;
|
||||
}
|
||||
};
|
||||
this.channels.sort?.sort({ id: this.tableSetting.sortBy, start: this.tableSetting.sortOrder, disableClear: true });
|
||||
this.channels.paginator = this.paginator;
|
||||
this.logger.info(this.channels);
|
||||
}
|
||||
|
@ -17,11 +17,16 @@
|
||||
<div [perfectScrollbar] fxLayout="column" fxLayoutAlign="start center" fxFlex="100" class="table-container">
|
||||
<mat-progress-bar *ngIf="apiCallStatus.status === apiCallStatusEnum.INITIATED" mode="indeterminate"></mat-progress-bar>
|
||||
<table mat-table #table [dataSource]="peers" matSort [ngClass]="{'overflow-auto error-border': errorMessage !== '','overflow-auto': true}">
|
||||
<ng-container matColumnDef="connected">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header></th>
|
||||
<td mat-cell *matCellDef="let peer">
|
||||
<span *ngIf="peer?.connected" class="dot green" matTooltip="Connected" matTooltipPosition="right" [ngClass]="{'mr-0': screenSize === screenSizeEnum.XS}"></span>
|
||||
<span *ngIf="!peer?.connected" class="dot red" matTooltip="Disconnected" matTooltipPosition="right" [ngClass]="{'mr-0': screenSize === screenSizeEnum.XS}"></span>
|
||||
</td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="alias">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header> Alias </th>
|
||||
<td mat-cell *matCellDef="let peer" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '40rem'}">
|
||||
<span *ngIf="peer?.connected" class="dot green" matTooltip="Connected" matTooltipPosition="right" [ngClass]="{'mr-0': screenSize === screenSizeEnum.XS}"></span>
|
||||
<span *ngIf="!peer?.connected" class="dot red" matTooltip="Disconnected" matTooltipPosition="right" [ngClass]="{'mr-0': screenSize === screenSizeEnum.XS}"></span>
|
||||
{{peer?.alias}}
|
||||
</td>
|
||||
</ng-container>
|
||||
@ -33,13 +38,13 @@
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="netaddr">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header> Network Address </th>
|
||||
<td mat-cell *matCellDef="let peer" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}">
|
||||
<td mat-cell *matCellDef="let peer" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '40rem'}">
|
||||
<span *ngFor="let addr of peer?.netaddr; last as isLast">{{addr}}<span *ngIf="!isLast">,<br></span></span>
|
||||
</td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="actions">
|
||||
<th mat-header-cell *matHeaderCellDef class="px-3">
|
||||
<div class="bordered-box table-actions-select">
|
||||
<div class="bordered-box table-actions-select" fxLayoutAlign="center center">
|
||||
<mat-select placeholder="Actions" tabindex="1" class="mr-0">
|
||||
<mat-select-trigger></mat-select-trigger>
|
||||
<mat-option (click)="onDownloadCSV()">Download CSV</mat-option>
|
||||
@ -47,7 +52,7 @@
|
||||
</div>
|
||||
</th>
|
||||
<td mat-cell *matCellDef="let peer" fxLayoutAlign="end center" class="px-3">
|
||||
<div fxFlex="100" class="bordered-box table-actions-select" fxLayoutAlign="center center">
|
||||
<div class="bordered-box table-actions-select" fxLayoutAlign="center center">
|
||||
<mat-select placeholder="Actions" tabindex="1" class="mr-0">
|
||||
<mat-select-trigger></mat-select-trigger>
|
||||
<mat-option (click)="onPeerClick(peer, $event)">View Info</mat-option>
|
||||
|
@ -1,3 +1,7 @@
|
||||
.mat-column-connected {
|
||||
width: 2rem;
|
||||
}
|
||||
|
||||
.mat-column-alias {
|
||||
flex: 1 1 20%;
|
||||
white-space: nowrap;
|
||||
|
@ -10,7 +10,7 @@ import { MatPaginator, MatPaginatorIntl } from '@angular/material/paginator';
|
||||
import { MatSort } from '@angular/material/sort';
|
||||
import { MatTableDataSource } from '@angular/material/table';
|
||||
import { Peer, GetInfo, Balance } from '../../../shared/models/clnModels';
|
||||
import { PAGE_SIZE, PAGE_SIZE_OPTIONS, getPaginatorLabel, AlertTypeEnum, ScreenSizeEnum, APICallStatusEnum, CLNActions } from '../../../shared/services/consts-enums-functions';
|
||||
import { PAGE_SIZE, PAGE_SIZE_OPTIONS, getPaginatorLabel, AlertTypeEnum, ScreenSizeEnum, APICallStatusEnum, CLNActions, SortOrderEnum, CLN_DEFAULT_PAGE_SETTINGS } from '../../../shared/services/consts-enums-functions';
|
||||
import { ApiCallStatusPayload } from '../../../shared/models/apiCallsPayload';
|
||||
import { LoggerService } from '../../../shared/services/logger.service';
|
||||
import { CommonService } from '../../../shared/services/common.service';
|
||||
@ -21,7 +21,8 @@ import { RTLEffects } from '../../../store/rtl.effects';
|
||||
import { RTLState } from '../../../store/rtl.state';
|
||||
import { openAlert, openConfirmation } from '../../../store/rtl.actions';
|
||||
import { detachPeer } from '../../store/cln.actions';
|
||||
import { nodeInfoAndBalance, peers } from '../../store/cln.selector';
|
||||
import { clnPageSettings, nodeInfoAndBalance, peers } from '../../store/cln.selector';
|
||||
import { PageSettingsCLN, TableSetting } from '../../../shared/models/pageSettings';
|
||||
|
||||
@Component({
|
||||
selector: 'rtl-cln-peers',
|
||||
@ -36,6 +37,8 @@ export class CLNPeersComponent implements OnInit, AfterViewInit, OnDestroy {
|
||||
@ViewChild(MatSort, { static: false }) sort: MatSort | undefined;
|
||||
@ViewChild(MatPaginator, { static: false }) paginator: MatPaginator | undefined;
|
||||
public faUsers = faUsers;
|
||||
public PAGE_ID = 'peers/channels';
|
||||
public tableSetting: TableSetting = { tableId: 'peers', recordsPerPage: PAGE_SIZE, sortBy: 'alias', sortOrder: SortOrderEnum.DESCENDING };
|
||||
public newlyAddedPeer = '';
|
||||
public displayedColumns: any[] = [];
|
||||
public peerAddress: string | null = '';
|
||||
@ -51,19 +54,10 @@ export class CLNPeersComponent implements OnInit, AfterViewInit, OnDestroy {
|
||||
public selFilter = '';
|
||||
public apiCallStatus: ApiCallStatusPayload | null = null;
|
||||
public apiCallStatusEnum = APICallStatusEnum;
|
||||
private unSubs: Array<Subject<void>> = [new Subject(), new Subject(), new Subject(), new Subject()];
|
||||
private unSubs: Array<Subject<void>> = [new Subject(), new Subject(), new Subject(), new Subject(), new Subject(), new Subject()];
|
||||
|
||||
constructor(private logger: LoggerService, private store: Store<RTLState>, private rtlEffects: RTLEffects, private actions: Actions, private commonService: CommonService) {
|
||||
this.screenSize = this.commonService.getScreenSize();
|
||||
if (this.screenSize === ScreenSizeEnum.XS) {
|
||||
this.displayedColumns = ['alias', 'actions'];
|
||||
} else if (this.screenSize === ScreenSizeEnum.SM) {
|
||||
this.displayedColumns = ['alias', 'id', 'netaddr', 'actions'];
|
||||
} else if (this.screenSize === ScreenSizeEnum.MD) {
|
||||
this.displayedColumns = ['alias', 'id', 'netaddr', 'actions'];
|
||||
} else {
|
||||
this.displayedColumns = ['alias', 'id', 'netaddr', 'actions'];
|
||||
}
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
@ -72,7 +66,25 @@ export class CLNPeersComponent implements OnInit, AfterViewInit, OnDestroy {
|
||||
this.information = infoBalSelector.information;
|
||||
this.availableBalance = infoBalSelector.balance.totalBalance || 0;
|
||||
});
|
||||
this.store.select(peers).pipe(takeUntil(this.unSubs[1])).
|
||||
this.store.select(clnPageSettings).pipe(takeUntil(this.unSubs[1])).
|
||||
subscribe((settings: { pageSettings: PageSettingsCLN[], apiCallStatus: ApiCallStatusPayload }) => {
|
||||
this.errorMessage = '';
|
||||
this.apiCallStatus = settings.apiCallStatus;
|
||||
if (this.apiCallStatus.status === APICallStatusEnum.ERROR) {
|
||||
this.errorMessage = this.apiCallStatus.message || '';
|
||||
}
|
||||
this.tableSetting = settings.pageSettings.find((page) => page.pageId === this.PAGE_ID)?.tables.find((table) => table.tableId === this.tableSetting.tableId) || CLN_DEFAULT_PAGE_SETTINGS.find((page) => page.pageId === this.PAGE_ID)?.tables.find((table) => table.tableId === this.tableSetting.tableId)!;
|
||||
if (this.screenSize === ScreenSizeEnum.XS || this.screenSize === ScreenSizeEnum.SM) {
|
||||
this.displayedColumns = JSON.parse(JSON.stringify(this.tableSetting.columnSelectionSM));
|
||||
} else {
|
||||
this.displayedColumns = JSON.parse(JSON.stringify(this.tableSetting.columnSelection));
|
||||
}
|
||||
this.displayedColumns.unshift('connected');
|
||||
this.displayedColumns.push('actions');
|
||||
this.pageSize = this.tableSetting.recordsPerPage ? +this.tableSetting.recordsPerPage : PAGE_SIZE;
|
||||
this.logger.info(this.displayedColumns);
|
||||
});
|
||||
this.store.select(peers).pipe(takeUntil(this.unSubs[2])).
|
||||
subscribe((peersSeletor: { peers: Peer[], apiCallStatus: ApiCallStatusPayload }) => {
|
||||
this.errorMessage = '';
|
||||
this.apiCallStatus = peersSeletor.apiCallStatus;
|
||||
@ -87,7 +99,7 @@ export class CLNPeersComponent implements OnInit, AfterViewInit, OnDestroy {
|
||||
});
|
||||
this.actions.
|
||||
pipe(
|
||||
takeUntil(this.unSubs[2]),
|
||||
takeUntil(this.unSubs[3]),
|
||||
filter((action) => action.type === CLNActions.SET_PEERS_CLN)
|
||||
).subscribe((setPeers: any) => {
|
||||
this.peerAddress = null;
|
||||
@ -163,7 +175,7 @@ export class CLNPeersComponent implements OnInit, AfterViewInit, OnDestroy {
|
||||
}
|
||||
}));
|
||||
this.rtlEffects.closeConfirm.
|
||||
pipe(takeUntil(this.unSubs[3])).
|
||||
pipe(takeUntil(this.unSubs[4])).
|
||||
subscribe((confirmRes) => {
|
||||
if (confirmRes) {
|
||||
this.store.dispatch(detachPeer({ payload: { id: peerToDetach.id!, force: false } }));
|
||||
@ -191,6 +203,7 @@ export class CLNPeersComponent implements OnInit, AfterViewInit, OnDestroy {
|
||||
}
|
||||
};
|
||||
this.peers.sort = this.sort;
|
||||
this.peers.sort?.sort({ id: this.tableSetting.sortBy, start: this.tableSetting.sortOrder, disableClear: true });
|
||||
this.peers.filterPredicate = (peer: Peer, fltr: string) => JSON.stringify(peer).toLowerCase().includes(fltr);
|
||||
this.peers.paginator = this.paginator;
|
||||
this.applyFilter();
|
||||
|
@ -45,7 +45,7 @@
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="actions">
|
||||
<th mat-header-cell *matHeaderCellDef class="px-3">
|
||||
<div class="bordered-box table-actions-select">
|
||||
<div class="bordered-box table-actions-select" fxLayoutAlign="center center">
|
||||
<mat-select placeholder="Actions" tabindex="1" class="mr-0">
|
||||
<mat-select-trigger></mat-select-trigger>
|
||||
<mat-option (click)="onDownloadCSV()">Download CSV</mat-option>
|
||||
@ -53,7 +53,7 @@
|
||||
</div>
|
||||
</th>
|
||||
<td mat-cell *matCellDef="let fhEvent" class="px-3" fxLayoutAlign="end center">
|
||||
<button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onFailedEventClick(fhEvent)">View Info</button>
|
||||
<button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onFailedEventClick(fhEvent)"class="table-actions-button">View Info</button>
|
||||
</td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="no_event">
|
||||
|
@ -43,7 +43,7 @@
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="actions">
|
||||
<th mat-header-cell *matHeaderCellDef class="px-3">
|
||||
<div class="bordered-box table-actions-select">
|
||||
<div class="bordered-box table-actions-select" fxLayoutAlign="center center">
|
||||
<mat-select placeholder="Actions" tabindex="1" class="mr-0">
|
||||
<mat-select-trigger></mat-select-trigger>
|
||||
<mat-option (click)="onDownloadCSV()">Download CSV</mat-option>
|
||||
@ -51,7 +51,7 @@
|
||||
</div>
|
||||
</th>
|
||||
<td mat-cell *matCellDef="let fhEvent" class="px-3" fxLayoutAlign="end center">
|
||||
<button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onForwardingEventClick(fhEvent,$event)">View Info</button>
|
||||
<button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onForwardingEventClick(fhEvent,$event)"class="table-actions-button">View Info</button>
|
||||
</td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="no_event">
|
||||
|
@ -33,7 +33,7 @@
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="actions">
|
||||
<th mat-header-cell *matHeaderCellDef class="px-3">
|
||||
<div class="bordered-box table-actions-select">
|
||||
<div class="bordered-box table-actions-select" fxLayoutAlign="center center">
|
||||
<mat-select placeholder="Actions" tabindex="1" class="mr-0">
|
||||
<mat-select-trigger></mat-select-trigger>
|
||||
<mat-option (click)="onDownloadCSV()">Download CSV</mat-option>
|
||||
@ -41,7 +41,7 @@
|
||||
</div>
|
||||
</th>
|
||||
<td mat-cell *matCellDef="let fhEvent" class="px-3" fxLayoutAlign="end center">
|
||||
<button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onFailedLocalEventClick(fhEvent)">View Info</button>
|
||||
<button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onFailedLocalEventClick(fhEvent)"class="table-actions-button">View Info</button>
|
||||
</td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="no_event">
|
||||
|
@ -94,7 +94,7 @@
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="actions">
|
||||
<th mat-header-cell *matHeaderCellDef class="px-3">
|
||||
<div class="bordered-box table-actions-select">
|
||||
<div class="bordered-box table-actions-select" fxLayoutAlign="center center">
|
||||
<mat-select placeholder="Actions" tabindex="1" class="mr-0">
|
||||
<mat-select-trigger></mat-select-trigger>
|
||||
<mat-option (click)="onDownloadCSV()">Download CSV</mat-option>
|
||||
|
@ -228,7 +228,7 @@ export class CLNLightningInvoicesTableComponent implements OnInit, AfterViewInit
|
||||
this.invoices = (invs) ? new MatTableDataSource<Invoice>([...invs]) : new MatTableDataSource([]);
|
||||
this.invoices.sortingDataAccessor = (data: any, sortHeaderId: string) => ((data[sortHeaderId] && isNaN(data[sortHeaderId])) ? data[sortHeaderId].toLocaleLowerCase() : data[sortHeaderId] ? +data[sortHeaderId] : null);
|
||||
this.invoices.sort = this.sort;
|
||||
this.invoices.sort.sort({ id: this.tableSetting.sortBy, start: this.tableSetting.sortOrder, disableClear: true });
|
||||
this.invoices.sort?.sort({ id: this.tableSetting.sortBy, start: this.tableSetting.sortOrder, disableClear: true });
|
||||
this.invoices.filterPredicate = (rowData: Invoice, fltr: string) => {
|
||||
const newRowData = this.datePipe.transform(new Date((rowData.paid_at || 0) * 1000), 'dd/MMM/YYYY HH:mm')?.toLowerCase()! + (this.datePipe.transform(new Date((rowData.expires_at || 0) * 1000), 'dd/MMM/YYYY HH:mm')?.toLowerCase()) + ((rowData.bolt12) ? 'bolt12' : (rowData.bolt11) ? 'bolt11' : 'keysend') + JSON.stringify(rowData).toLowerCase();
|
||||
return newRowData.includes(fltr);
|
||||
|
@ -51,7 +51,7 @@
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="actions">
|
||||
<th mat-header-cell *matHeaderCellDef class="pr-3">
|
||||
<div class="bordered-box table-actions-select">
|
||||
<div class="bordered-box table-actions-select" fxLayoutAlign="center center">
|
||||
<mat-select placeholder="Actions" tabindex="1" class="mr-0">
|
||||
<mat-select-trigger></mat-select-trigger>
|
||||
<mat-option (click)="onDownloadCSV()">Download CSV</mat-option>
|
||||
|
@ -145,7 +145,7 @@ export class CLNOfferBookmarksTableComponent implements OnInit, AfterViewInit, O
|
||||
this.offersBookmarks = (OffrBMs) ? new MatTableDataSource<OfferBookmark>([...OffrBMs]) : new MatTableDataSource([]);
|
||||
this.offersBookmarks.sortingDataAccessor = (data: any, sortHeaderId: string) => ((data[sortHeaderId] && isNaN(data[sortHeaderId])) ? data[sortHeaderId].toLocaleLowerCase() : data[sortHeaderId] ? +data[sortHeaderId] : null);
|
||||
this.offersBookmarks.sort = this.sort;
|
||||
this.offersBookmarks.sort.sort({ id: this.tableSetting.sortBy, start: this.tableSetting.sortOrder, disableClear: true });
|
||||
this.offersBookmarks.sort?.sort({ id: this.tableSetting.sortBy, start: this.tableSetting.sortOrder, disableClear: true });
|
||||
this.offersBookmarks.filterPredicate = (Ofrbm: OfferBookmark, fltr: string) => JSON.stringify(Ofrbm).toLowerCase().includes(fltr);
|
||||
this.offersBookmarks.paginator = this.paginator;
|
||||
this.applyFilter();
|
||||
|
@ -54,7 +54,7 @@
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="actions">
|
||||
<th mat-header-cell *matHeaderCellDef class="px-3">
|
||||
<div class="bordered-box table-actions-select">
|
||||
<div class="bordered-box table-actions-select" fxLayoutAlign="center center">
|
||||
<mat-select placeholder="Actions" tabindex="1" class="mr-0">
|
||||
<mat-select-trigger></mat-select-trigger>
|
||||
<mat-option (click)="onDownloadCSV()">Download CSV</mat-option>
|
||||
|
@ -228,7 +228,7 @@ export class CLNOffersTableComponent implements OnInit, AfterViewInit, OnDestroy
|
||||
this.offers = (offrs) ? new MatTableDataSource<Offer>([...offrs]) : new MatTableDataSource([]);
|
||||
this.offers.sortingDataAccessor = (data: any, sortHeaderId: string) => ((data[sortHeaderId] && isNaN(data[sortHeaderId])) ? data[sortHeaderId].toLocaleLowerCase() : data[sortHeaderId] ? +data[sortHeaderId] : null);
|
||||
this.offers.sort = this.sort;
|
||||
this.offers.sort.sort({ id: this.tableSetting.sortBy, start: this.tableSetting.sortOrder, disableClear: true });
|
||||
this.offers.sort?.sort({ id: this.tableSetting.sortBy, start: this.tableSetting.sortOrder, disableClear: true });
|
||||
this.offers.filterPredicate = (rowData: Offer, fltr: string) => {
|
||||
const newRowData = ((rowData.active) ? ' active' : ' inactive') + ((rowData.used) ? ' used' : ' unused') + ((rowData.single_use) ? ' single' : ' multiple') + JSON.stringify(rowData).toLowerCase();
|
||||
if (fltr === 'active' || fltr === 'inactive' || fltr === 'used' || fltr === 'unused' || fltr === 'single' || fltr === 'multiple') {
|
||||
|
@ -94,7 +94,7 @@
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="actions">
|
||||
<th mat-header-cell *matHeaderCellDef class="pr-3">
|
||||
<div class="bordered-box table-actions-select">
|
||||
<div class="bordered-box table-actions-select" fxLayoutAlign="center center">
|
||||
<mat-select placeholder="Actions" tabindex="1" class="mr-0">
|
||||
<mat-select-trigger></mat-select-trigger>
|
||||
<mat-option (click)="onDownloadCSV()">Download CSV</mat-option>
|
||||
@ -102,7 +102,7 @@
|
||||
</div>
|
||||
</th>
|
||||
<td mat-cell *matCellDef="let payment" class="pr-3" fxLayoutAlign="end center">
|
||||
<button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onPaymentClick(payment)">View Info</button>
|
||||
<button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onPaymentClick(payment)"class="table-actions-button">View Info</button>
|
||||
</td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="no_payment">
|
||||
|
@ -18,12 +18,14 @@
|
||||
min-height: 4.8rem;
|
||||
|
||||
& .btn-mpp-expand {
|
||||
width: 9rem;
|
||||
min-width: 10rem;
|
||||
width: 10rem;
|
||||
}
|
||||
|
||||
& .btn-mpp-info {
|
||||
margin-top: 0.5rem;
|
||||
width: 9rem;
|
||||
margin-top: 0.5rem;
|
||||
min-width: 9rem;
|
||||
width: 9rem;
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -299,7 +299,7 @@ export class CLNLightningPaymentsComponent implements OnInit, AfterViewInit, OnD
|
||||
this.payments = (payments) ? new MatTableDataSource<Payment>([...payments]) : new MatTableDataSource([]);
|
||||
this.payments.sortingDataAccessor = (data: any, sortHeaderId: string) => ((data[sortHeaderId] && isNaN(data[sortHeaderId])) ? data[sortHeaderId].toLocaleLowerCase() : data[sortHeaderId] ? +data[sortHeaderId] : null);
|
||||
this.payments.sort = this.sort;
|
||||
this.payments.sort.sort({ id: this.tableSetting.sortBy, start: this.tableSetting.sortOrder, disableClear: true });
|
||||
this.payments.sort?.sort({ id: this.tableSetting.sortBy, start: this.tableSetting.sortOrder, disableClear: true });
|
||||
this.payments.filterPredicate = (rowData: Payment, fltr: string) => {
|
||||
const newRowData = ((rowData.created_at) ? this.datePipe.transform(new Date(rowData.created_at * 1000), 'dd/MMM/YYYY HH:mm')?.toLowerCase() : '') + ((rowData.bolt12) ? 'bolt12' : (rowData.bolt11) ? 'bolt11' : 'keysend') + JSON.stringify(rowData).toLowerCase();
|
||||
return newRowData.includes(fltr);
|
||||
|
@ -48,7 +48,7 @@
|
||||
<ng-container matColumnDef="actions">
|
||||
<th mat-header-cell *matHeaderCellDef class="pl-4 pr-3"><span fxLayoutAlign="end center">Actions</span></th>
|
||||
<td mat-cell *matCellDef="let hop" class="pl-4">
|
||||
<button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onHopClick(hop)">View Info</button>
|
||||
<button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onHopClick(hop)"class="table-actions-button">View Info</button>
|
||||
</td>
|
||||
</ng-container>
|
||||
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
|
||||
|
@ -1,6 +1,5 @@
|
||||
.mat-column-actions {
|
||||
flex: 0 0 5%;
|
||||
width: 5%;
|
||||
min-height: 4.8rem;
|
||||
}
|
||||
|
||||
.mat-column-pubkey_alias {
|
||||
|
@ -39,7 +39,7 @@
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="actions">
|
||||
<th mat-header-cell *matHeaderCellDef class="px-3">
|
||||
<div class="bordered-box table-actions-select">
|
||||
<div class="bordered-box table-actions-select" fxLayoutAlign="center center">
|
||||
<mat-select placeholder="Actions" tabindex="1" class="mr-0">
|
||||
<mat-select-trigger></mat-select-trigger>
|
||||
<mat-option (click)="onDownloadCSV()">Download CSV</mat-option>
|
||||
@ -47,7 +47,7 @@
|
||||
</div>
|
||||
</th>
|
||||
<td mat-cell *matCellDef="let transaction" class="pl-3" fxLayoutAlign="end center">
|
||||
<button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onTransactionClick(transaction, $event)">View Info</button>
|
||||
<button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onTransactionClick(transaction, $event)"class="table-actions-button">View Info</button>
|
||||
</td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="no_transaction">
|
||||
|
@ -51,7 +51,7 @@
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="actions">
|
||||
<th mat-header-cell *matHeaderCellDef class="pl-1">
|
||||
<div class="bordered-box table-actions-select">
|
||||
<div class="bordered-box table-actions-select" fxLayoutAlign="center center">
|
||||
<mat-select placeholder="Actions" tabindex="1" class="mr-0">
|
||||
<mat-select-trigger></mat-select-trigger>
|
||||
<mat-option (click)="onDownloadCSV()">Download CSV</mat-option>
|
||||
|
@ -35,10 +35,4 @@
|
||||
|
||||
.mat-column-actions {
|
||||
min-height: 4.8rem;
|
||||
& .bordered-box.table-actions-select {
|
||||
flex: 0 0 100%;
|
||||
@include for_screensize(phone) {
|
||||
flex: 0 0 80%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -57,7 +57,7 @@
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="actions">
|
||||
<th mat-header-cell *matHeaderCellDef class="pl-1">
|
||||
<div class="bordered-box table-actions-select">
|
||||
<div class="bordered-box table-actions-select" fxLayoutAlign="center center">
|
||||
<mat-select placeholder="Actions" tabindex="1" class="mr-0">
|
||||
<mat-select-trigger></mat-select-trigger>
|
||||
<mat-option (click)="onChannelUpdate('all')">Update Fee Policy</mat-option>
|
||||
|
@ -41,13 +41,4 @@
|
||||
|
||||
.mat-column-actions {
|
||||
min-height: 4.8rem;
|
||||
& .bordered-box.table-actions-select {
|
||||
flex: 0 0 100%;
|
||||
@include for_screensize(tab-port) {
|
||||
flex: 0 0 90%;
|
||||
}
|
||||
@include for_screensize(phone) {
|
||||
flex: 0 0 80%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -28,7 +28,7 @@
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="actions">
|
||||
<th mat-header-cell *matHeaderCellDef class="pl-1">
|
||||
<div class="bordered-box table-actions-select">
|
||||
<div class="bordered-box table-actions-select" fxLayoutAlign="center center">
|
||||
<mat-select placeholder="Actions" tabindex="1" class="mr-0">
|
||||
<mat-select-trigger></mat-select-trigger>
|
||||
<mat-option (click)="onDownloadCSV()">Download CSV</mat-option>
|
||||
@ -36,7 +36,7 @@
|
||||
</div>
|
||||
</th>
|
||||
<td mat-cell *matCellDef="let channel" class="pl-1" fxLayoutAlign="end center">
|
||||
<button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onChannelClick(channel, $event)">View Info</button>
|
||||
<button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onChannelClick(channel, $event)"class="table-actions-button">View Info</button>
|
||||
</td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="no_channel">
|
||||
|
@ -47,7 +47,7 @@
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="actions">
|
||||
<th mat-header-cell *matHeaderCellDef class="px-3">
|
||||
<div class="bordered-box table-actions-select">
|
||||
<div class="bordered-box table-actions-select" fxLayoutAlign="center center">
|
||||
<mat-select placeholder="Actions" tabindex="1" class="mr-0">
|
||||
<mat-select-trigger></mat-select-trigger>
|
||||
<mat-option (click)="onDownloadCSV()">Download CSV</mat-option>
|
||||
@ -55,7 +55,7 @@
|
||||
</div>
|
||||
</th>
|
||||
<td mat-cell *matCellDef="let peer" fxLayoutAlign="end center" class="px-3">
|
||||
<div class="bordered-box table-actions-select">
|
||||
<div class="bordered-box table-actions-select" fxLayoutAlign="center center">
|
||||
<mat-select placeholder="Actions" tabindex="1" class="mr-0">
|
||||
<mat-select-trigger></mat-select-trigger>
|
||||
<mat-option (click)="onPeerClick(peer, $event)">View Info</mat-option>
|
||||
|
@ -38,7 +38,7 @@
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="actions">
|
||||
<th mat-header-cell *matHeaderCellDef class="px-3">
|
||||
<div class="bordered-box table-actions-select">
|
||||
<div class="bordered-box table-actions-select" fxLayoutAlign="center center">
|
||||
<mat-select placeholder="Actions" tabindex="1" class="mr-0">
|
||||
<mat-select-trigger></mat-select-trigger>
|
||||
<mat-option (click)="onDownloadCSV()">Download CSV</mat-option>
|
||||
@ -46,7 +46,7 @@
|
||||
</div>
|
||||
</th>
|
||||
<td mat-cell *matCellDef="let fhEvent" class="px-3" fxLayoutAlign="end center">
|
||||
<button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onForwardingEventClick(fhEvent,$event)">View Info</button>
|
||||
<button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onForwardingEventClick(fhEvent,$event)"class="table-actions-button">View Info</button>
|
||||
</td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="no_event">
|
||||
|
@ -65,7 +65,7 @@
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="actions">
|
||||
<th mat-header-cell *matHeaderCellDef class="px-3">
|
||||
<div class="bordered-box table-actions-select">
|
||||
<div class="bordered-box table-actions-select" fxLayoutAlign="center center">
|
||||
<mat-select placeholder="Actions" tabindex="1" class="mr-0">
|
||||
<mat-select-trigger></mat-select-trigger>
|
||||
<mat-option (click)="onDownloadCSV()">Download CSV</mat-option>
|
||||
|
@ -53,7 +53,7 @@
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="actions">
|
||||
<th mat-header-cell *matHeaderCellDef class="px-3">
|
||||
<div class="bordered-box table-actions-select">
|
||||
<div class="bordered-box table-actions-select" fxLayoutAlign="center center">
|
||||
<mat-select placeholder="Actions" tabindex="1" class="mr-0">
|
||||
<mat-select-trigger></mat-select-trigger>
|
||||
<mat-option (click)="onDownloadCSV()">Download CSV</mat-option>
|
||||
@ -61,7 +61,7 @@
|
||||
</div>
|
||||
</th>
|
||||
<td mat-cell *matCellDef="let payment" class="px-3" fxLayoutAlign="end center">
|
||||
<button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onPaymentClick(payment)">View Info</button>
|
||||
<button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onPaymentClick(payment)"class="table-actions-button">View Info</button>
|
||||
</td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="no_payment">
|
||||
|
@ -33,7 +33,7 @@
|
||||
<ng-container matColumnDef="actions">
|
||||
<th mat-header-cell *matHeaderCellDef class="pr-3"><span fxLayoutAlign="end center">Actions</span></th>
|
||||
<td mat-cell *matCellDef="let channel" fxLayoutAlign="end center">
|
||||
<div class="bordered-box table-actions-select">
|
||||
<div class="bordered-box table-actions-select" fxLayoutAlign="center center">
|
||||
<mat-select placeholder="Actions" tabindex="1" class="mr-0">
|
||||
<mat-select-trigger></mat-select-trigger>
|
||||
<mat-option (click)="onChannelClick(channel, $event)">View Info</mat-option>
|
||||
|
@ -55,7 +55,7 @@
|
||||
<ng-container matColumnDef="actions">
|
||||
<th mat-header-cell *matHeaderCellDef class="pl-4 pr-3"><span fxLayoutAlign="end center">Actions</span></th>
|
||||
<td mat-cell *matCellDef="let hop" class="pl-4">
|
||||
<button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onHopClick(hop, $event)">View Info</button>
|
||||
<button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onHopClick(hop, $event)"class="table-actions-button">View Info</button>
|
||||
</td>
|
||||
</ng-container>
|
||||
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
|
||||
|
@ -1,6 +1,5 @@
|
||||
.mat-column-actions {
|
||||
flex: 0 0 5%;
|
||||
width: 5%;
|
||||
min-height: 4.8rem;
|
||||
}
|
||||
|
||||
.mat-column-pubkey_alias {
|
||||
|
@ -38,7 +38,7 @@
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="actions">
|
||||
<th mat-header-cell *matHeaderCellDef class="px-3">
|
||||
<div class="bordered-box table-actions-select">
|
||||
<div class="bordered-box table-actions-select" fxLayoutAlign="center center">
|
||||
<mat-select placeholder="Actions" tabindex="1" class="mr-0">
|
||||
<mat-select-trigger></mat-select-trigger>
|
||||
<mat-option (click)="onDownloadCSV()">Download CSV</mat-option>
|
||||
@ -46,7 +46,7 @@
|
||||
</div>
|
||||
</th>
|
||||
<td mat-cell *matCellDef="let transaction" class="pl-3" fxLayoutAlign="end center">
|
||||
<button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onTransactionClick(transaction)">View Info</button>
|
||||
<button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onTransactionClick(transaction)"class="table-actions-button">View Info</button>
|
||||
</td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="no_transaction">
|
||||
|
@ -44,7 +44,7 @@
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="actions">
|
||||
<th mat-header-cell *matHeaderCellDef class="px-3">
|
||||
<div class="bordered-box table-actions-select">
|
||||
<div class="bordered-box table-actions-select" fxLayoutAlign="center center">
|
||||
<mat-select placeholder="Actions" tabindex="1" class="mr-0">
|
||||
<mat-select-trigger></mat-select-trigger>
|
||||
<mat-option (click)="onDownloadCSV()">Download CSV</mat-option>
|
||||
|
@ -61,7 +61,7 @@
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="actions">
|
||||
<th mat-header-cell *matHeaderCellDef class="px-2">
|
||||
<div class="bordered-box table-actions-select">
|
||||
<div class="bordered-box table-actions-select" fxLayoutAlign="center center">
|
||||
<mat-select placeholder="Actions" tabindex="1" class="mr-0">
|
||||
<mat-select-trigger></mat-select-trigger>
|
||||
<mat-option (click)="onDownloadCSV()">Download CSV</mat-option>
|
||||
|
@ -19,11 +19,13 @@
|
||||
min-height: 4.8rem;
|
||||
|
||||
& .btn-htlc-expand {
|
||||
width: 9rem;
|
||||
min-width: 10rem;
|
||||
width: 10rem;
|
||||
}
|
||||
|
||||
& .btn-htlc-info {
|
||||
margin-top: 0.5rem;
|
||||
margin-top: 0.5rem;
|
||||
min-width: 9rem;
|
||||
width: 9rem;
|
||||
}
|
||||
}
|
||||
|
@ -38,7 +38,7 @@
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="actions">
|
||||
<th mat-header-cell *matHeaderCellDef class="pl-1">
|
||||
<div class="bordered-box table-actions-select">
|
||||
<div class="bordered-box table-actions-select" fxLayoutAlign="center center">
|
||||
<mat-select placeholder="Actions" tabindex="1" class="mr-0">
|
||||
<mat-select-trigger></mat-select-trigger>
|
||||
<mat-option (click)="onDownloadCSV()">Download CSV</mat-option>
|
||||
@ -47,7 +47,7 @@
|
||||
</th>
|
||||
<td mat-cell *matCellDef="let channel" class="pl-1">
|
||||
<span fxLayoutAlign="end center">
|
||||
<button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onClosedChannelClick(channel,$event)">View Info</button>
|
||||
<button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onClosedChannelClick(channel,$event)"class="table-actions-button">View Info</button>
|
||||
</span>
|
||||
</td>
|
||||
</ng-container>
|
||||
|
@ -43,13 +43,4 @@
|
||||
|
||||
.mat-column-actions {
|
||||
min-height: 4.8rem;
|
||||
& .bordered-box.table-actions-select {
|
||||
flex: 0 0 100%;
|
||||
@include for_screensize(tab-port) {
|
||||
flex: 0 0 90%;
|
||||
}
|
||||
@include for_screensize(phone) {
|
||||
flex: 0 0 80%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -76,7 +76,7 @@
|
||||
<ng-container matColumnDef="actions">
|
||||
<mat-header-cell fxLayoutAlign="end center" class="pl-4 pr-3" *matHeaderCellDef>Actions</mat-header-cell>
|
||||
<mat-cell fxLayoutAlign="end center" *matCellDef="let channel" class="pl-4">
|
||||
<button mat-stroked-button color="primary" type="button" tabindex="2" (click)="onForceClosingClick(channel)">View Info</button>
|
||||
<button mat-stroked-button color="primary" type="button" tabindex="2" (click)="onForceClosingClick(channel)"class="table-actions-button">View Info</button>
|
||||
</mat-cell>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="no_pending_force_closing">
|
||||
@ -125,7 +125,7 @@
|
||||
<ng-container matColumnDef="actions">
|
||||
<mat-header-cell fxLayoutAlign="end center" class="pl-4 pr-3" *matHeaderCellDef>Actions</mat-header-cell>
|
||||
<mat-cell fxLayoutAlign="end center" *matCellDef="let channel" class="pl-4">
|
||||
<button mat-stroked-button color="primary" type="button" tabindex="3" (click)="onClosingClick(channel)">View Info</button>
|
||||
<button mat-stroked-button color="primary" type="button" tabindex="3" (click)="onClosingClick(channel)"class="table-actions-button">View Info</button>
|
||||
</mat-cell>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="no_pending_closing">
|
||||
@ -180,7 +180,7 @@
|
||||
<ng-container matColumnDef="actions">
|
||||
<mat-header-cell fxLayoutAlign="end center" class="pl-4 pr-3" *matHeaderCellDef>Actions</mat-header-cell>
|
||||
<mat-cell fxLayoutAlign="end center" *matCellDef="let channel" class="pl-4">
|
||||
<button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onWaitClosingClick(channel)">View Info</button>
|
||||
<button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onWaitClosingClick(channel)"class="table-actions-button">View Info</button>
|
||||
</mat-cell>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="no_pending_wait_closing">
|
||||
|
@ -40,7 +40,7 @@
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="actions">
|
||||
<th mat-header-cell *matHeaderCellDef class="px-3">
|
||||
<div class="bordered-box table-actions-select">
|
||||
<div class="bordered-box table-actions-select" fxLayoutAlign="center center">
|
||||
<mat-select placeholder="Actions" tabindex="1" class="mr-0">
|
||||
<mat-select-trigger></mat-select-trigger>
|
||||
<mat-option (click)="onDownloadCSV()">Download CSV</mat-option>
|
||||
@ -48,7 +48,7 @@
|
||||
</div>
|
||||
</th>
|
||||
<td mat-cell *matCellDef="let peer" fxLayoutAlign="end center" class="px-3">
|
||||
<div class="bordered-box table-actions-select">
|
||||
<div class="bordered-box table-actions-select" fxLayoutAlign="center center">
|
||||
<mat-select placeholder="Actions" tabindex="1" class="mr-0">
|
||||
<mat-select-trigger></mat-select-trigger>
|
||||
<mat-option (click)="onPeerClick(peer, $event)">View Info</mat-option>
|
||||
|
@ -15,7 +15,6 @@
|
||||
|
||||
.mat-column-actions {
|
||||
min-height: 4.8rem;
|
||||
flex: 1 1 10%;
|
||||
}
|
||||
|
||||
.mat-column-sat_sent, .mat-column-sat_recv, .mat-column-ping_time {
|
||||
|
@ -35,7 +35,7 @@
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="actions">
|
||||
<th mat-header-cell *matHeaderCellDef class="px-3">
|
||||
<div class="bordered-box table-actions-select">
|
||||
<div class="bordered-box table-actions-select" fxLayoutAlign="center center">
|
||||
<mat-select placeholder="Actions" tabindex="1" class="mr-0">
|
||||
<mat-select-trigger></mat-select-trigger>
|
||||
<mat-option (click)="onDownloadCSV()">Download CSV</mat-option>
|
||||
@ -43,7 +43,7 @@
|
||||
</div>
|
||||
</th>
|
||||
<td mat-cell *matCellDef="let fhEvent" class="pl-3" fxLayoutAlign="end center">
|
||||
<button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onForwardingEventClick(fhEvent,$event)">View Info</button>
|
||||
<button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onForwardingEventClick(fhEvent,$event)"class="table-actions-button">View Info</button>
|
||||
</td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="no_event">
|
||||
|
@ -31,7 +31,7 @@
|
||||
<ng-container matColumnDef="actions">
|
||||
<th mat-header-cell *matHeaderCellDef class="pr-3"><span fxLayoutAlign="end center">Actions</span></th>
|
||||
<td mat-cell *matCellDef="let rPeer" class="pl-2" fxLayoutAlign="end center">
|
||||
<button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onRoutingPeerClick(rPeer, $event, 'in')">View Info</button>
|
||||
<button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onRoutingPeerClick(rPeer, $event, 'in')"class="table-actions-button">View Info</button>
|
||||
</td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="no_incoming_event">
|
||||
@ -78,7 +78,7 @@
|
||||
<ng-container matColumnDef="actions">
|
||||
<th mat-header-cell *matHeaderCellDef class="pr-3"><span fxLayoutAlign="end center">Actions</span></th>
|
||||
<td mat-cell *matCellDef="let rPeer" class="pl-2">
|
||||
<button mat-stroked-button color="primary" type="button" tabindex="5" (click)="onRoutingPeerClick(rPeer, $event, 'out')">View Info</button>
|
||||
<button mat-stroked-button color="primary" type="button" tabindex="5" (click)="onRoutingPeerClick(rPeer, $event, 'out')"class="table-actions-button">View Info</button>
|
||||
</td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="no_outgoing_event">
|
||||
|
@ -60,7 +60,7 @@
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="actions">
|
||||
<th mat-header-cell *matHeaderCellDef class="px-3">
|
||||
<div class="bordered-box table-actions-select">
|
||||
<div class="bordered-box table-actions-select" fxLayoutAlign="center center">
|
||||
<mat-select placeholder="Actions" tabindex="1" class="mr-0">
|
||||
<mat-select-trigger></mat-select-trigger>
|
||||
<mat-option (click)="onDownloadCSV()">Download CSV</mat-option>
|
||||
|
@ -57,7 +57,7 @@
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="actions">
|
||||
<th mat-header-cell *matHeaderCellDef class="px-2">
|
||||
<div class="bordered-box table-actions-select">
|
||||
<div class="bordered-box table-actions-select" fxLayoutAlign="center center">
|
||||
<mat-select placeholder="Actions" tabindex="1" class="mr-0">
|
||||
<mat-select-trigger></mat-select-trigger>
|
||||
<mat-option (click)="onDownloadCSV()">Download CSV</mat-option>
|
||||
@ -65,7 +65,7 @@
|
||||
</div>
|
||||
</th>
|
||||
<td mat-cell *matCellDef="let payment" class="px-2" fxLayoutAlign="end center">
|
||||
<button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onPaymentClick(payment)">View Info</button>
|
||||
<button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onPaymentClick(payment)"class="table-actions-button">View Info</button>
|
||||
</td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="no_payment">
|
||||
|
@ -14,12 +14,14 @@
|
||||
min-height: 4.8rem;
|
||||
|
||||
& .btn-htlc-expand {
|
||||
width: 9rem;
|
||||
min-width: 10rem;
|
||||
width: 10rem;
|
||||
}
|
||||
|
||||
& .btn-htlc-info {
|
||||
margin-top: 0.5rem;
|
||||
width: 9rem;
|
||||
margin-top: 0.5rem;
|
||||
min-width: 9rem;
|
||||
width: 9rem;
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -54,7 +54,7 @@
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="actions">
|
||||
<th mat-header-cell *matHeaderCellDef class="px-3">
|
||||
<div class="bordered-box table-actions-select">
|
||||
<div class="bordered-box table-actions-select" fxLayoutAlign="center center">
|
||||
<mat-select placeholder="Actions" tabindex="1" class="mr-0">
|
||||
<mat-select-trigger></mat-select-trigger>
|
||||
<mat-option (click)="onDownloadCSV()">Download CSV</mat-option>
|
||||
@ -63,7 +63,7 @@
|
||||
</th>
|
||||
<td mat-cell *matCellDef="let swap" class="pl-3" fxLayoutAlign="end center">
|
||||
<button mat-stroked-button color="primary" type="button" tabindex="4"
|
||||
(click)="onSwapClick(swap, $event)">View Info</button>
|
||||
(click)="onSwapClick(swap, $event)"class="table-actions-button">View Info</button>
|
||||
</td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="no_swap">
|
||||
|
@ -57,7 +57,7 @@
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="actions">
|
||||
<th mat-header-cell *matHeaderCellDef class="px-3">
|
||||
<div class="bordered-box table-actions-select">
|
||||
<div class="bordered-box table-actions-select" fxLayoutAlign="center center">
|
||||
<mat-select placeholder="Actions" tabindex="1" class="mr-0">
|
||||
<mat-select-trigger></mat-select-trigger>
|
||||
<mat-option (click)="onDownloadCSV()">Download CSV</mat-option>
|
||||
@ -66,7 +66,7 @@
|
||||
</th>
|
||||
<td mat-cell *matCellDef="let swap" class="pl-3" fxLayoutAlign="end center">
|
||||
<button mat-stroked-button color="primary" type="button" tabindex="4"
|
||||
(click)="onSwapClick(swap, $event)">View Info</button>
|
||||
(click)="onSwapClick(swap, $event)"class="table-actions-button">View Info</button>
|
||||
</td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="no_swap">
|
||||
|
@ -7,7 +7,7 @@
|
||||
<ng-container *ngIf="errorMessage && errorMessage.page === 'unknown'" [ngTemplateOutlet]="errorObjectBlock" [ngTemplateOutletContext]="{error: errorMessage}"></ng-container>
|
||||
<mat-expansion-panel fxLayout="column" class="flat-expansion-panel mt-1" [ngClass]="{'error-border': errorMessage?.page === page.pageId}" expanded="true" *ngFor="let page of pageSettings">
|
||||
<mat-expansion-panel-header>
|
||||
<mat-panel-title>{{page.pageId | titlecase}}</mat-panel-title>
|
||||
<mat-panel-title>{{page.pageId | camelcase}}</mat-panel-title>
|
||||
</mat-expansion-panel-header>
|
||||
<div fxLayout="column" fxLayoutAlign="start stretch" *ngFor="let table of page.tables" class="padding-gap-x-large table-setting-row">
|
||||
<div fxLayout="row" fxLayoutAlign="space-between center">
|
||||
@ -35,7 +35,7 @@
|
||||
</mat-form-field>
|
||||
<mat-form-field fxFlex="15">
|
||||
<mat-select [(ngModel)]="table.columnSelectionSM" placeholder="Column selection (Mobile)" name="{{table.tableId}}-columns-selection-sm" tabindex="5" multiple required>
|
||||
<mat-option *ngFor="let field of tableFieldsDef[table.tableId].allowedColumns" [value]="field" [disabled]="(table.columnSelectionSM.length <= 1 && table.columnSelectionSM.includes(field)) || (table.columnSelectionSM.length >= 2 && !table.columnSelectionSM.includes(field))">
|
||||
<mat-option *ngFor="let field of tableFieldsDef[table.tableId].allowedColumns" [value]="field" [disabled]="(table.columnSelectionSM.length <= 1 && table.columnSelectionSM.includes(field)) || (table.columnSelectionSM.length >= 3 && !table.columnSelectionSM.includes(field))">
|
||||
{{field | camelcaseWithReplace:'_'}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
|
@ -31,7 +31,7 @@
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="actions">
|
||||
<th mat-header-cell *matHeaderCellDef class="px-3">
|
||||
<div class="bordered-box table-actions-select">
|
||||
<div class="bordered-box table-actions-select" fxLayoutAlign="center center">
|
||||
<mat-select placeholder="Actions" tabindex="1" class="mr-0">
|
||||
<mat-select-trigger></mat-select-trigger>
|
||||
<mat-option (click)="onDownloadCSV()">Download CSV</mat-option>
|
||||
@ -39,7 +39,7 @@
|
||||
</div>
|
||||
</th>
|
||||
<td mat-cell *matCellDef="let transaction" class="px-3" fxLayoutAlign="end center">
|
||||
<button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onTransactionClick(transaction)">View Info</button>
|
||||
<button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onTransactionClick(transaction)"class="table-actions-button">View Info</button>
|
||||
</td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="no_transaction">
|
||||
|
@ -318,7 +318,8 @@ export interface Channel {
|
||||
their_channel_reserve_satoshis?: string;
|
||||
our_channel_reserve_satoshis?: string;
|
||||
spendable_msatoshi?: string;
|
||||
balancedness?: number; // Between -1 to +1
|
||||
direction?: number;
|
||||
balancedness?: number; // Between 0-1-0
|
||||
}
|
||||
|
||||
export interface ChannelEdge {
|
||||
|
@ -81,7 +81,7 @@ export interface Channel {
|
||||
uptime_str?: string;
|
||||
lifetime?: string;
|
||||
static_remote_key?: boolean;
|
||||
balancedness?: number; // Between -1 to +1
|
||||
balancedness?: number; // Between 0-1-0
|
||||
}
|
||||
|
||||
export interface PendingChannel {
|
||||
|
@ -683,6 +683,17 @@ export const CLN_DEFAULT_PAGE_SETTINGS: PageSettingsCLN[] = [
|
||||
columnSelectionSM: ['txid', 'value'],
|
||||
columnSelection: ['txid', 'output', 'value', 'blockheight'] }
|
||||
] },
|
||||
{ pageId: 'peers/channels', tables: [
|
||||
{ tableId: 'open_channels', recordsPerPage: PAGE_SIZE, sortBy: 'msatoshi_to_us', sortOrder: SortOrderEnum.DESCENDING,
|
||||
columnSelectionSM: ['alias', 'msatoshi_to_us', 'msatoshi_to_them'],
|
||||
columnSelection: ['short_channel_id', 'alias', 'msatoshi_to_us', 'msatoshi_to_them', 'balancedness'] },
|
||||
{ tableId: 'pending_inactive_channels', recordsPerPage: PAGE_SIZE, sortBy: 'state', sortOrder: SortOrderEnum.DESCENDING,
|
||||
columnSelectionSM: ['alias', 'state'],
|
||||
columnSelection: ['alias', 'connected', 'state', 'msatoshi_total'] },
|
||||
{ tableId: 'peers', recordsPerPage: PAGE_SIZE, sortBy: 'alias', sortOrder: SortOrderEnum.ASCENDING,
|
||||
columnSelectionSM: ['alias', 'id'],
|
||||
columnSelection: ['alias', 'id', 'netaddr'] }
|
||||
] },
|
||||
{ pageId: 'transactions', tables: [
|
||||
{ tableId: 'payments', recordsPerPage: PAGE_SIZE, sortBy: 'created_at', sortOrder: SortOrderEnum.DESCENDING,
|
||||
columnSelectionSM: ['created_at', 'msatoshi'],
|
||||
@ -708,6 +719,18 @@ export const CLN_TABLES_DEF = {
|
||||
maxColumns: 7,
|
||||
allowedColumns: ['txid', 'address', 'scriptpubkey', 'output', 'value', 'blockheight', 'reserved']
|
||||
},
|
||||
open_channels: {
|
||||
maxColumns: 8,
|
||||
allowedColumns: ['short_channel_id', 'alias', 'id', 'channel_id', 'funding_txid', 'connected', 'our_channel_reserve_satoshis', 'their_channel_reserve_satoshis', 'msatoshi_total', 'spendable_msatoshi', 'msatoshi_to_us', 'msatoshi_to_them', 'balancedness']
|
||||
},
|
||||
pending_inactive_channels: {
|
||||
maxColumns: 8,
|
||||
allowedColumns: ['alias', 'id', 'channel_id', 'funding_txid', 'connected', 'state', 'our_channel_reserve_satoshis', 'their_channel_reserve_satoshis', 'msatoshi_total', 'spendable_msatoshi', 'msatoshi_to_us', 'msatoshi_to_them']
|
||||
},
|
||||
peers: {
|
||||
maxColumns: 3,
|
||||
allowedColumns: ['alias', 'id', 'netaddr']
|
||||
},
|
||||
payments: {
|
||||
maxColumns: 5,
|
||||
allowedColumns: ['created_at', 'type', 'payment_hash', 'bolt11', 'destination', 'memo', 'label', 'msatoshi_sent', 'msatoshi']
|
||||
|
@ -286,6 +286,11 @@
|
||||
}
|
||||
}
|
||||
|
||||
.table-actions-button {
|
||||
min-width: 10rem;
|
||||
width: 10rem;
|
||||
}
|
||||
|
||||
.mat-select-panel .mat-option.mat-active {
|
||||
background: none;
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user