diff --git a/backend/controllers/cln/invoices.js b/backend/controllers/cln/invoices.js index 0864a290..770cec12 100644 --- a/backend/controllers/cln/invoices.js +++ b/backend/controllers/cln/invoices.js @@ -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); diff --git a/server/controllers/cln/invoices.ts b/server/controllers/cln/invoices.ts index f5a0aaf3..32d3ce60 100644 --- a/server/controllers/cln/invoices.ts +++ b/server/controllers/cln/invoices.ts @@ -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); diff --git a/src/app/cln/transactions/invoices/invoices-table/lightning-invoices-table.component.html b/src/app/cln/transactions/invoices/invoices-table/lightning-invoices-table.component.html index f7a9deb8..6fd9ba4e 100644 --- a/src/app/cln/transactions/invoices/invoices-table/lightning-invoices-table.component.html +++ b/src/app/cln/transactions/invoices/invoices-table/lightning-invoices-table.component.html @@ -30,12 +30,17 @@
- - + + + + + + @@ -50,11 +55,35 @@ + + + + + + + + + + + + diff --git a/src/app/cln/transactions/invoices/invoices-table/lightning-invoices-table.component.scss b/src/app/cln/transactions/invoices/invoices-table/lightning-invoices-table.component.scss index 2ce046dc..3c18e915 100644 --- a/src/app/cln/transactions/invoices/invoices-table/lightning-invoices-table.component.scss +++ b/src/app/cln/transactions/invoices/invoices-table/lightning-invoices-table.component.scss @@ -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 { diff --git a/src/app/cln/transactions/invoices/invoices-table/lightning-invoices-table.component.ts b/src/app/cln/transactions/invoices/invoices-table/lightning-invoices-table.component.ts index cff28c0d..0bf71aa5 100644 --- a/src/app/cln/transactions/invoices/invoices-table/lightning-invoices-table.component.ts +++ b/src/app/cln/transactions/invoices/invoices-table/lightning-invoices-table.component.ts @@ -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, 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([...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);
Expiry Date + Expiry Date {{(invoice?.expires_at * 1000) | date:'dd/MMM/y HH:mm'}} Description -
+
{{invoice?.description}}
Label +
+ {{invoice?.label}} +
+
Payment Hash +
+ {{invoice?.payment_hash}} +
+
Invoice +
+ {{invoice?.bolt11}} +
+
Amount (Sats) {{invoice?.msatoshi/1000 | number:invoice?.msatoshi < 1000 ? '1.0-4' : '1.0-0'}}