mirrors/Ride-The-Lightning-RTL
1
0
Fork 0
mirror of https://github.com/Ride-The-Lightning/RTL.git synced 2024-11-19 01:40:29 +01:00
Code Issues Projects Releases Wiki Activity

CLN Invoices Page Settings

Browse Source 
CLN Invoices Page Settings
This commit is contained in:
ShahanaFarooqui 2022-10-17 09:35:09 -07:00
parent d350f1c0f9
commit 149561dedb
5 changed files with 79 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
backend/controllers/cln/invoices.js
View File

@ -31,10 +31,6 @@ export const listInvoices = (req, res, next) => {
logger.log({ selectedNode: req.session.selectedNode, level: 'DEBUG', fileName: 'Invoice', msg: 'Invoices List URL', data: options.url });
request(options).then((body) => {
logger.log({ selectedNode: req.session.selectedNode, level: 'DEBUG', fileName: 'Invoice', msg: 'Invoices List Received', data: body });
if (body.invoices && body.invoices.length > 0) {
body.invoices = common.sortDescByKey(body.invoices, 'expires_at');
}
logger.log({ selectedNode: req.session.selectedNode, level: 'INFO', fileName: 'Invoice', msg: 'Sorted Invoices List Received', data: body });
res.status(200).json(body);
}).catch((errRes) => {
const err = common.handleError(errRes, 'Invoice', 'List Invoices Error', req.session.selectedNode);

4
server/controllers/cln/invoices.ts
View File

@ -29,10 +29,6 @@ export const listInvoices = (req, res, next) => {
logger.log({ selectedNode: req.session.selectedNode, level: 'DEBUG', fileName: 'Invoice', msg: 'Invoices List URL', data: options.url });
request(options).then((body) => {
logger.log({ selectedNode: req.session.selectedNode, level: 'DEBUG', fileName: 'Invoice', msg: 'Invoices List Received', data: body });
if (body.invoices && body.invoices.length > 0) {
body.invoices = common.sortDescByKey(body.invoices, 'expires_at');
}
logger.log({ selectedNode: req.session.selectedNode, level: 'INFO', fileName: 'Invoice', msg: 'Sorted Invoices List Received', data: body });
res.status(200).json(body);
}).catch((errRes) => {
const err = common.handleError(errRes, 'Invoice', 'List Invoices Error', req.session.selectedNode);

35
src/app/cln/transactions/invoices/invoices-table/lightning-invoices-table.component.html
View File

@ -30,12 +30,17 @@
<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 fxFlex="100" [dataSource]="invoices" matSort [ngClass]="{'overflow-auto error-border': errorMessage !== '','overflow-auto': true}">
<ng-container matColumnDef="expires_at">
<th mat-header-cell *matHeaderCellDef mat-sort-header> Expiry Date </th>
<ng-container matColumnDef="status">
<th mat-header-cell *matHeaderCellDef mat-sort-header></th>
<td mat-cell *matCellDef="let invoice">
<span *ngIf="invoice?.status === 'paid'" class="dot green" matTooltip="Paid" matTooltipPosition="right" [ngClass]="{'mr-0': screenSize === screenSizeEnum.XS}"></span>
<span *ngIf="invoice?.status === 'unpaid'" class="dot yellow" matTooltip="Unpaid" matTooltipPosition="right" [ngClass]="{'mr-0': screenSize === screenSizeEnum.XS}"></span>
<span *ngIf="invoice?.status === 'expired'" class="dot red" matTooltip="Expired" matTooltipPosition="right" [ngClass]="{'mr-0': screenSize === screenSizeEnum.XS}"></span>
</td>
</ng-container>
<ng-container matColumnDef="expires_at">
<th mat-header-cell *matHeaderCellDef mat-sort-header> Expiry Date </th>
<td mat-cell *matCellDef="let invoice">
{{(invoice?.expires_at * 1000) | date:'dd/MMM/y HH:mm'}}
</td>
</ng-container>
@ -50,11 +55,35 @@
<ng-container matColumnDef="description">
<th mat-header-cell *matHeaderCellDef mat-sort-header> Description </th>
<td mat-cell *matCellDef="let invoice">
<div class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '32rem'}">
<div class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '25rem'}">
<span class="ellipsis-child">{{invoice?.description}}</span>
</div>
</td>
</ng-container>
<ng-container matColumnDef="label">
<th mat-header-cell *matHeaderCellDef mat-sort-header> Label </th>
<td mat-cell *matCellDef="let invoice">
<div class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '25rem'}">
<span class="ellipsis-child">{{invoice?.label}}</span>
</div>
</td>
</ng-container>
<ng-container matColumnDef="payment_hash">
<th mat-header-cell *matHeaderCellDef mat-sort-header> Payment Hash </th>
<td mat-cell *matCellDef="let invoice">
<div class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '25rem'}">
<span class="ellipsis-child">{{invoice?.payment_hash}}</span>
</div>
</td>
</ng-container>
<ng-container matColumnDef="bolt11">
<th mat-header-cell *matHeaderCellDef mat-sort-header> Invoice </th>
<td mat-cell *matCellDef="let invoice">
<div class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '25rem'}">
<span class="ellipsis-child">{{invoice?.bolt11}}</span>
</div>
</td>
</ng-container>
<ng-container matColumnDef="msatoshi">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before"> Amount (Sats) </th>
<td mat-cell *matCellDef="let invoice"><span fxLayoutAlign="end center"> {{invoice?.msatoshi/1000 | number:invoice?.msatoshi < 1000 ? '1.0-4' : '1.0-0'}}</span></td>

24
src/app/cln/transactions/invoices/invoices-table/lightning-invoices-table.component.scss
View File

@ -1,4 +1,26 @@
.mat-column-description {
@import '../../../../shared/theme/styles/mixins.scss';
.mat-column-status {
max-width: 1rem;
& .dot {
@include for_screensize(tab-port) {
width:0.6rem;
height: 0.6rem;
left: 2.8rem;
margin-top: -0.3rem;
position: absolute;
}
@include for_screensize(phone) {
width:0.6rem;
height: 0.6rem;
left: 0.8rem;
margin-top: -0.3rem;
position: absolute;
}
}
}
.mat-column-description, .mat-column-label, .mat-column-payment_hash, .mat-column-bolt11 {
flex: 0 0 15%;
width: 15%;
& .ellipsis-parent {

35
src/app/cln/transactions/invoices/invoices-table/lightning-invoices-table.component.ts
View File

@ -9,7 +9,7 @@ import { MatPaginator, MatPaginatorIntl } from '@angular/material/paginator';
import { MatSort } from '@angular/material/sort';
import { MatTableDataSource } from '@angular/material/table';
import { CurrencyUnitEnum, CURRENCY_UNIT_FORMATS, PAGE_SIZE, PAGE_SIZE_OPTIONS, getPaginatorLabel, ScreenSizeEnum, APICallStatusEnum, UI_MESSAGES, CLNActions } from '../../../../shared/services/consts-enums-functions';
import { CurrencyUnitEnum, CURRENCY_UNIT_FORMATS, PAGE_SIZE, PAGE_SIZE_OPTIONS, getPaginatorLabel, ScreenSizeEnum, APICallStatusEnum, UI_MESSAGES, CLNActions, CLN_DEFAULT_PAGE_SETTINGS, SortOrderEnum } from '../../../../shared/services/consts-enums-functions';
import { ApiCallStatusPayload } from '../../../../shared/models/apiCallsPayload';
import { SelNodeChild } from '../../../../shared/models/RTLconfig';
import { GetInfo, Invoice, ListInvoices } from '../../../../shared/models/clnModels';
@ -23,7 +23,8 @@ import { RTLEffects } from '../../../../store/rtl.effects';
import { RTLState } from '../../../../store/rtl.state';
import { openAlert, openConfirmation } from '../../../../store/rtl.actions';
import { deleteExpiredInvoice, invoiceLookup, saveNewInvoice } from '../../../store/cln.actions';
import { clnNodeInformation, clnNodeSettings, listInvoices } from '../../../store/cln.selector';
import { clnNodeInformation, clnNodeSettings, clnPageSettings, listInvoices } from '../../../store/cln.selector';
import { PageSettingsCLN, TableSetting } from '../../../../shared/models/pageSettings';
@Component({
selector: 'rtl-cln-lightning-invoices-table',
@ -39,6 +40,8 @@ export class CLNLightningInvoicesTableComponent implements OnInit, AfterViewInit
@ViewChild(MatSort, { static: false }) sort: MatSort | undefined;
@ViewChild(MatPaginator, { static: false }) paginator: MatPaginator | undefined;
faHistory = faHistory;
public PAGE_ID = 'invoices';
public tableSetting: TableSetting = { tableId: 'invoices', recordsPerPage: 10, sortBy: 'expires_at', sortOrder: SortOrderEnum.DESCENDING };
public selNode: SelNodeChild | null = {};
public newlyAddedInvoiceMemo = '';
public newlyAddedInvoiceValue = 0;
@ -65,15 +68,6 @@ export class CLNLightningInvoicesTableComponent implements OnInit, AfterViewInit
constructor(private logger: LoggerService, private store: Store<RTLState>, private decimalPipe: DecimalPipe, private commonService: CommonService, private rtlEffects: RTLEffects, private datePipe: DatePipe, private actions: Actions) {
this.screenSize = this.commonService.getScreenSize();
if (this.screenSize === ScreenSizeEnum.XS) {
this.displayedColumns = ['expires_at', 'msatoshi', 'actions'];
} else if (this.screenSize === ScreenSizeEnum.SM) {
this.displayedColumns = ['expires_at', 'description', 'msatoshi', 'actions'];
} else if (this.screenSize === ScreenSizeEnum.MD) {
this.displayedColumns = ['expires_at', 'type', 'description', 'msatoshi', 'msatoshi_received', 'actions'];
} else {
this.displayedColumns = ['expires_at', 'paid_at', 'type', 'description', 'msatoshi', 'msatoshi_received', 'actions'];
}
}
ngOnInit() {
@ -83,6 +77,24 @@ export class CLNLightningInvoicesTableComponent implements OnInit, AfterViewInit
this.store.select(clnNodeInformation).pipe(takeUntil(this.unSubs[1])).subscribe((nodeInfo: GetInfo) => {
this.information = nodeInfo;
});
this.store.select(clnPageSettings).pipe(takeUntil(this.unSubs[2])).
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.showColumnsSM));
} else {
this.displayedColumns = JSON.parse(JSON.stringify(this.tableSetting.showColumns));
}
this.displayedColumns.unshift('status');
this.displayedColumns.push('actions');
this.pageSize = this.tableSetting.recordsPerPage ? +this.tableSetting.recordsPerPage : PAGE_SIZE;
this.logger.info(this.displayedColumns);
});
this.store.select(listInvoices).pipe(takeUntil(this.unSubs[2])).
subscribe((invoicesSeletor: { listInvoices: ListInvoices, apiCallStatus: ApiCallStatusPayload }) => {
this.errorMessage = '';
@ -216,6 +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.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);