From d98064ca2c613a338df469252733dd800eeeb396 Mon Sep 17 00:00:00 2001 From: ShahanaFarooqui Date: Mon, 17 Oct 2022 18:33:32 -0700 Subject: [PATCH] CLN Offers and Bookmarks Page Layout CLN Offers and Bookmarks Page Layout --- backend/controllers/cln/offers.js | 3 -- server/controllers/cln/offers.ts | 3 -- .../utxo-tables/utxos/utxos.component.scss | 2 - .../utxo-tables/utxos/utxos.component.ts | 2 +- .../lightning-invoices-table.component.scss | 2 - .../lightning-invoices-table.component.ts | 4 +- .../offer-bookmarks-table.component.html | 20 +++++++-- .../offer-bookmarks-table.component.scss | 6 +-- .../offer-bookmarks-table.component.ts | 38 ++++++++++------ .../offers-table/offers-table.component.html | 21 +++++++-- .../offers-table/offers-table.component.scss | 10 +++-- .../offers-table/offers-table.component.ts | 39 ++++++++++------ .../lightning-payments.component.scss | 2 - .../payments/lightning-payments.component.ts | 4 +- .../page-settings.component.html | 21 ++++----- .../page-settings.component.scss | 3 +- .../page-settings/page-settings.component.ts | 7 +++ .../shared/services/consts-enums-functions.ts | 44 ++++++++++++------- 18 files changed, 148 insertions(+), 83 deletions(-) diff --git a/backend/controllers/cln/offers.js b/backend/controllers/cln/offers.js index d12a5a47..ad158bcb 100644 --- a/backend/controllers/cln/offers.js +++ b/backend/controllers/cln/offers.js @@ -11,9 +11,6 @@ export const listOfferBookmarks = (req, res, next) => { logger.log({ selectedNode: req.session.selectedNode, level: 'INFO', fileName: 'Offers', msg: 'Getting Offer Bookmarks..' }); databaseService.find(req.session.selectedNode, CollectionsEnum.OFFERS).then((offers) => { logger.log({ selectedNode: req.session.selectedNode, level: 'INFO', fileName: 'Offers', msg: 'Offer Bookmarks Received', data: offers }); - if (offers && offers.length > 0) { - offers = common.sortDescByKey(offers, 'lastUpdatedAt'); - } res.status(200).json(offers); }).catch((errRes) => { const err = common.handleError(errRes, 'Offers', 'Offer Bookmarks Error', req.session.selectedNode); diff --git a/server/controllers/cln/offers.ts b/server/controllers/cln/offers.ts index 43e8b20c..671a81dc 100644 --- a/server/controllers/cln/offers.ts +++ b/server/controllers/cln/offers.ts @@ -13,9 +13,6 @@ export const listOfferBookmarks = (req, res, next) => { logger.log({ selectedNode: req.session.selectedNode, level: 'INFO', fileName: 'Offers', msg: 'Getting Offer Bookmarks..' }); databaseService.find(req.session.selectedNode, CollectionsEnum.OFFERS).then((offers: Offer[]) => { logger.log({ selectedNode: req.session.selectedNode, level: 'INFO', fileName: 'Offers', msg: 'Offer Bookmarks Received', data: offers }); - if (offers && offers.length > 0) { - offers = common.sortDescByKey(offers, 'lastUpdatedAt'); - } res.status(200).json(offers); }).catch((errRes) => { const err = common.handleError(errRes, 'Offers', 'Offer Bookmarks Error', req.session.selectedNode); diff --git a/src/app/cln/on-chain/utxo-tables/utxos/utxos.component.scss b/src/app/cln/on-chain/utxo-tables/utxos/utxos.component.scss index 72dd32e8..9cbf811a 100644 --- a/src/app/cln/on-chain/utxo-tables/utxos/utxos.component.scss +++ b/src/app/cln/on-chain/utxo-tables/utxos/utxos.component.scss @@ -1,5 +1,3 @@ -@import '../../../../shared/theme/styles/mixins.scss'; - .mat-column-status { width: 6rem; } diff --git a/src/app/cln/on-chain/utxo-tables/utxos/utxos.component.ts b/src/app/cln/on-chain/utxo-tables/utxos/utxos.component.ts index 0d11a6fa..ca6777f0 100644 --- a/src/app/cln/on-chain/utxo-tables/utxos/utxos.component.ts +++ b/src/app/cln/on-chain/utxo-tables/utxos/utxos.component.ts @@ -33,7 +33,7 @@ export class CLNOnChainUtxosComponent implements OnInit, AfterViewInit, OnDestro @Input() numDustUTXOs = 0; @Input() isDustUTXO = false; public PAGE_ID = 'on-chain'; - public tableSetting: TableSetting = { tableId: 'utxos', recordsPerPage: 10, sortBy: 'status', sortOrder: SortOrderEnum.DESCENDING }; + public tableSetting: TableSetting = { tableId: 'utxos', recordsPerPage: PAGE_SIZE, sortBy: 'status', sortOrder: SortOrderEnum.DESCENDING }; public displayedColumns: any[] = []; public utxos: UTXO[]; public listUTXOs: any; 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 efc1003f..802276bd 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,5 +1,3 @@ -@import '../../../../shared/theme/styles/mixins.scss'; - .mat-column-status { width: 2rem; } 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 71e51b88..52d5cc55 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 @@ -40,8 +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 PAGE_ID = 'transactions'; + public tableSetting: TableSetting = { tableId: 'invoices', recordsPerPage: PAGE_SIZE, sortBy: 'expires_at', sortOrder: SortOrderEnum.DESCENDING }; public selNode: SelNodeChild | null = {}; public newlyAddedInvoiceMemo = ''; public newlyAddedInvoiceValue = 0; diff --git a/src/app/cln/transactions/offers/offer-bookmarks-table/offer-bookmarks-table.component.html b/src/app/cln/transactions/offers/offer-bookmarks-table/offer-bookmarks-table.component.html index 58d0902c..9f8f6b88 100644 --- a/src/app/cln/transactions/offers/offer-bookmarks-table/offer-bookmarks-table.component.html +++ b/src/app/cln/transactions/offers/offer-bookmarks-table/offer-bookmarks-table.component.html @@ -20,7 +20,7 @@ Title -
+
{{offersbookmark.title}}
@@ -32,13 +32,25 @@ Description -
+
{{offersbookmark.description}}
+ + Vendor + {{offersbookmark.vendor}} + + + Invoice + +
+ {{offersbookmark.bolt12}} +
+ +
- +
@@ -46,7 +58,7 @@
- +
diff --git a/src/app/cln/transactions/offers/offer-bookmarks-table/offer-bookmarks-table.component.scss b/src/app/cln/transactions/offers/offer-bookmarks-table/offer-bookmarks-table.component.scss index fe876dfd..c326d020 100644 --- a/src/app/cln/transactions/offers/offer-bookmarks-table/offer-bookmarks-table.component.scss +++ b/src/app/cln/transactions/offers/offer-bookmarks-table/offer-bookmarks-table.component.scss @@ -1,6 +1,6 @@ -.mat-column-title, .mat-column-description { - flex: 0 0 30%; - width: 30%; +.mat-column-title, .mat-column-description, .mat-column-bolt12 { + flex: 0 0 20%; + width: 20%; & .ellipsis-parent { display: flex; } diff --git a/src/app/cln/transactions/offers/offer-bookmarks-table/offer-bookmarks-table.component.ts b/src/app/cln/transactions/offers/offer-bookmarks-table/offer-bookmarks-table.component.ts index d765039b..cda1610f 100644 --- a/src/app/cln/transactions/offers/offer-bookmarks-table/offer-bookmarks-table.component.ts +++ b/src/app/cln/transactions/offers/offer-bookmarks-table/offer-bookmarks-table.component.ts @@ -7,7 +7,7 @@ import { MatPaginator, MatPaginatorIntl } from '@angular/material/paginator'; import { MatSort } from '@angular/material/sort'; import { MatTableDataSource } from '@angular/material/table'; -import { PAGE_SIZE, PAGE_SIZE_OPTIONS, getPaginatorLabel, ScreenSizeEnum, APICallStatusEnum, PaymentTypes, AlertTypeEnum } from '../../../../shared/services/consts-enums-functions'; +import { PAGE_SIZE, PAGE_SIZE_OPTIONS, getPaginatorLabel, ScreenSizeEnum, APICallStatusEnum, PaymentTypes, AlertTypeEnum, SortOrderEnum, CLN_DEFAULT_PAGE_SETTINGS } from '../../../../shared/services/consts-enums-functions'; import { ApiCallStatusPayload } from '../../../../shared/models/apiCallsPayload'; import { OfferBookmark } from '../../../../shared/models/clnModels'; import { LoggerService } from '../../../../shared/services/logger.service'; @@ -16,10 +16,11 @@ import { CommonService } from '../../../../shared/services/common.service'; import { RTLEffects } from '../../../../store/rtl.effects'; import { RTLState } from '../../../../store/rtl.state'; import { openAlert, openConfirmation } from '../../../../store/rtl.actions'; -import { offerBookmarks } from '../../../store/cln.selector'; +import { clnPageSettings, offerBookmarks } from '../../../store/cln.selector'; import { CLNOfferInformationComponent } from '../offer-information-modal/offer-information.component'; import { CLNLightningSendPaymentsComponent } from '../../send-payment-modal/send-payment.component'; import { deleteOfferBookmark } from '../../../store/cln.actions'; +import { PageSettingsCLN, TableSetting } from '../../../../shared/models/pageSettings'; @Component({ selector: 'rtl-cln-offer-bookmarks-table', @@ -34,6 +35,8 @@ export class CLNOfferBookmarksTableComponent implements OnInit, AfterViewInit, O @ViewChild(MatSort, { static: false }) sort: MatSort | undefined; @ViewChild(MatPaginator, { static: false }) paginator: MatPaginator | undefined; faHistory = faHistory; + public PAGE_ID = 'transactions'; + public tableSetting: TableSetting = { tableId: 'offer_bookmarks', recordsPerPage: PAGE_SIZE, sortBy: 'lastUpdatedAt', sortOrder: SortOrderEnum.DESCENDING }; public displayedColumns: any[] = []; public offersBookmarks: any; public offersBookmarksJSONArr: OfferBookmark[] = []; @@ -49,19 +52,27 @@ export class CLNOfferBookmarksTableComponent implements OnInit, AfterViewInit, O constructor(private logger: LoggerService, private store: Store, private commonService: CommonService, private rtlEffects: RTLEffects) { this.screenSize = this.commonService.getScreenSize(); - if (this.screenSize === ScreenSizeEnum.XS) { - this.displayedColumns = ['lastUpdatedAt', 'title', 'amountMSat', 'actions']; - } else if (this.screenSize === ScreenSizeEnum.SM) { - this.displayedColumns = ['lastUpdatedAt', 'title', 'amountMSat', 'actions']; - } else if (this.screenSize === ScreenSizeEnum.MD) { - this.displayedColumns = ['lastUpdatedAt', 'title', 'amountMSat', 'description', 'actions']; - } else { - this.displayedColumns = ['lastUpdatedAt', 'title', 'amountMSat', 'description', 'actions']; - } } ngOnInit() { - this.store.select(offerBookmarks).pipe(takeUntil(this.unSubs[0])). + this.store.select(clnPageSettings).pipe(takeUntil(this.unSubs[0])). + 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.push('actions'); + this.pageSize = this.tableSetting.recordsPerPage ? +this.tableSetting.recordsPerPage : PAGE_SIZE; + this.logger.info(this.displayedColumns); + }); + this.store.select(offerBookmarks).pipe(takeUntil(this.unSubs[1])). subscribe((offerBMsSeletor: { offersBookmarks: OfferBookmark[], apiCallStatus: ApiCallStatusPayload }) => { this.errorMessage = ''; this.apiCallStatus = offerBMsSeletor.apiCallStatus; @@ -106,7 +117,7 @@ export class CLNOfferBookmarksTableComponent implements OnInit, AfterViewInit, O } } })); - this.rtlEffects.closeConfirm.pipe(takeUntil(this.unSubs[1])).subscribe((confirmRes) => { + this.rtlEffects.closeConfirm.pipe(takeUntil(this.unSubs[2])).subscribe((confirmRes) => { if (confirmRes) { this.store.dispatch(deleteOfferBookmark({ payload: { bolt12: selOffer.bolt12! } })); } @@ -134,6 +145,7 @@ export class CLNOfferBookmarksTableComponent implements OnInit, AfterViewInit, O this.offersBookmarks = (OffrBMs) ? new MatTableDataSource([...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.filterPredicate = (Ofrbm: OfferBookmark, fltr: string) => JSON.stringify(Ofrbm).toLowerCase().includes(fltr); this.offersBookmarks.paginator = this.paginator; this.applyFilter(); diff --git a/src/app/cln/transactions/offers/offers-table/offers-table.component.html b/src/app/cln/transactions/offers/offers-table/offers-table.component.html index e53bf4a2..9c47131d 100644 --- a/src/app/cln/transactions/offers/offers-table/offers-table.component.html +++ b/src/app/cln/transactions/offers/offers-table/offers-table.component.html @@ -15,13 +15,18 @@
+ + + + + + + +
+ + + Offer ID -
+
- - {{offer.offer_id}}
@@ -37,6 +42,16 @@ {{offer.used ? 'Yes' : 'No'}}
Invoice +
+ + {{offer.bolt12}} + +
+
diff --git a/src/app/cln/transactions/offers/offers-table/offers-table.component.scss b/src/app/cln/transactions/offers/offers-table/offers-table.component.scss index 5652a1bc..0b755274 100644 --- a/src/app/cln/transactions/offers/offers-table/offers-table.component.scss +++ b/src/app/cln/transactions/offers/offers-table/offers-table.component.scss @@ -1,6 +1,10 @@ -.mat-column-offer_id { - flex: 0 0 65%; - width: 65%; +.mat-column-active { + width: 2rem; +} + +.mat-column-offer_id, .mat-column-bolt12 { + flex: 0 0 35%; + width: 35%; & .ellipsis-parent { display: flex; } diff --git a/src/app/cln/transactions/offers/offers-table/offers-table.component.ts b/src/app/cln/transactions/offers/offers-table/offers-table.component.ts index 5754fcb3..23b55bfd 100644 --- a/src/app/cln/transactions/offers/offers-table/offers-table.component.ts +++ b/src/app/cln/transactions/offers/offers-table/offers-table.component.ts @@ -11,7 +11,7 @@ import { MatTableDataSource } from '@angular/material/table'; import * as pdfMake from 'pdfmake/build/pdfmake'; import * as pdfFonts from 'pdfmake/build/vfs_fonts'; -import { PAGE_SIZE, PAGE_SIZE_OPTIONS, getPaginatorLabel, ScreenSizeEnum, APICallStatusEnum, AlertTypeEnum } from '../../../../shared/services/consts-enums-functions'; +import { PAGE_SIZE, PAGE_SIZE_OPTIONS, getPaginatorLabel, ScreenSizeEnum, APICallStatusEnum, AlertTypeEnum, SortOrderEnum, CLN_DEFAULT_PAGE_SETTINGS } from '../../../../shared/services/consts-enums-functions'; import { ApiCallStatusPayload } from '../../../../shared/models/apiCallsPayload'; import { SelNodeChild } from '../../../../shared/models/RTLconfig'; import { GetInfo, Offer, OfferRequest } from '../../../../shared/models/clnModels'; @@ -26,7 +26,8 @@ import { RTLEffects } from '../../../../store/rtl.effects'; import { RTLState } from '../../../../store/rtl.state'; import { openAlert, openConfirmation } from '../../../../store/rtl.actions'; import { disableOffer } from '../../../store/cln.actions'; -import { clnNodeInformation, clnNodeSettings, offers } from '../../../store/cln.selector'; +import { clnNodeInformation, clnNodeSettings, clnPageSettings, offers } from '../../../store/cln.selector'; +import { PageSettingsCLN, TableSetting } from '../../../../shared/models/pageSettings'; @Component({ selector: 'rtl-cln-offers-table', @@ -41,6 +42,8 @@ export class CLNOffersTableComponent implements OnInit, AfterViewInit, OnDestroy @ViewChild(MatSort, { static: false }) sort: MatSort | undefined; @ViewChild(MatPaginator, { static: false }) paginator: MatPaginator | undefined; faHistory = faHistory; + public PAGE_ID = 'transactions'; + public tableSetting: TableSetting = { tableId: 'offers', recordsPerPage: PAGE_SIZE, sortBy: 'offer_id', sortOrder: SortOrderEnum.DESCENDING }; public selNode: SelNodeChild | null = {}; public newlyAddedOfferMemo = ''; public newlyAddedOfferValue = 0; @@ -67,15 +70,6 @@ export class CLNOffersTableComponent implements OnInit, AfterViewInit, OnDestroy constructor(private logger: LoggerService, private store: Store, private commonService: CommonService, private rtlEffects: RTLEffects, private dataService: DataService, private decimalPipe: DecimalPipe, private datePipe: DatePipe) { this.screenSize = this.commonService.getScreenSize(); - if (this.screenSize === ScreenSizeEnum.XS) { - this.displayedColumns = ['offer_id', 'single_use', 'actions']; - } else if (this.screenSize === ScreenSizeEnum.SM) { - this.displayedColumns = ['offer_id', 'single_use', 'used', 'actions']; - } else if (this.screenSize === ScreenSizeEnum.MD) { - this.displayedColumns = ['offer_id', 'single_use', 'used', 'actions']; - } else { - this.displayedColumns = ['offer_id', 'single_use', 'used', 'actions']; - } } ngOnInit() { @@ -85,7 +79,25 @@ export class CLNOffersTableComponent implements OnInit, AfterViewInit, OnDestroy this.store.select(clnNodeInformation).pipe(takeUntil(this.unSubs[1])).subscribe((nodeInfo: GetInfo) => { this.information = nodeInfo; }); - this.store.select(offers).pipe(takeUntil(this.unSubs[2])). + 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.columnSelectionSM)); + } else { + this.displayedColumns = JSON.parse(JSON.stringify(this.tableSetting.columnSelection)); + } + this.displayedColumns.unshift('active'); + this.displayedColumns.push('actions'); + this.pageSize = this.tableSetting.recordsPerPage ? +this.tableSetting.recordsPerPage : PAGE_SIZE; + this.logger.info(this.displayedColumns); + }); + this.store.select(offers).pipe(takeUntil(this.unSubs[3])). subscribe((offersSeletor: { offers: Offer[], apiCallStatus: ApiCallStatusPayload }) => { this.errorMessage = ''; this.apiCallStatus = offersSeletor.apiCallStatus; @@ -149,7 +161,7 @@ export class CLNOffersTableComponent implements OnInit, AfterViewInit, OnDestroy } } })); - this.rtlEffects.closeConfirm.pipe(takeUntil(this.unSubs[3])).subscribe((confirmRes) => { + this.rtlEffects.closeConfirm.pipe(takeUntil(this.unSubs[4])).subscribe((confirmRes) => { if (confirmRes) { this.store.dispatch(disableOffer({ payload: { offer_id: selOffer.offer_id! } })); } @@ -216,6 +228,7 @@ export class CLNOffersTableComponent implements OnInit, AfterViewInit, OnDestroy this.offers = (offrs) ? new MatTableDataSource([...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.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') { diff --git a/src/app/cln/transactions/payments/lightning-payments.component.scss b/src/app/cln/transactions/payments/lightning-payments.component.scss index b6d08d11..02d06c0e 100644 --- a/src/app/cln/transactions/payments/lightning-payments.component.scss +++ b/src/app/cln/transactions/payments/lightning-payments.component.scss @@ -1,5 +1,3 @@ -@import '../../../shared/theme/styles/mixins.scss'; - .mat-column-status, .mat-column-group_status { width: 2rem; } diff --git a/src/app/cln/transactions/payments/lightning-payments.component.ts b/src/app/cln/transactions/payments/lightning-payments.component.ts index 833688af..7d5ee3ca 100644 --- a/src/app/cln/transactions/payments/lightning-payments.component.ts +++ b/src/app/cln/transactions/payments/lightning-payments.component.ts @@ -36,11 +36,11 @@ import { PageSettingsCLN, TableSetting } from '../../../shared/models/pageSettin }) export class CLNLightningPaymentsComponent implements OnInit, AfterViewInit, OnDestroy { - @Input() calledFrom = 'transactions'; // Transactions/home + @Input() calledFrom = 'transactions'; // transactions/home @ViewChild('sendPaymentForm', { static: false }) form; @ViewChild(MatSort, { static: false }) sort: MatSort | undefined; @ViewChild(MatPaginator, { static: false }) paginator: MatPaginator | undefined; - public PAGE_ID = 'payments'; + public PAGE_ID = 'transactions'; public tableSetting: TableSetting = { tableId: 'payments', recordsPerPage: PAGE_SIZE, sortBy: 'created_at', sortOrder: SortOrderEnum.DESCENDING }; public faHistory = faHistory; public newlyAddedPayment = ''; diff --git a/src/app/shared/components/node-config/page-settings/page-settings.component.html b/src/app/shared/components/node-config/page-settings/page-settings.component.html index 159a4b93..b5a0dec8 100644 --- a/src/app/shared/components/node-config/page-settings/page-settings.component.html +++ b/src/app/shared/components/node-config/page-settings/page-settings.component.html @@ -11,30 +11,30 @@
- Table {{table.tableId | camelcaseWithReplace:'_'}}: + {{table.tableId | camelcaseWithReplace:'_'}}: - + {{pageSizeOption}} - + {{field | camelcaseWithReplace:'_'}} - + {{so === 'desc' ? 'Descending' : 'Ascending'}} - - + + {{field | camelcaseWithReplace:'_'}} @@ -42,22 +42,23 @@ Columns (mobile) should be between 1 and 2 - + {{field | camelcaseWithReplace:'_'}} Column selection should be between 2 and {{tableFieldsDef[table.tableId].maxColumns}} +
- - - + + +
diff --git a/src/app/shared/components/node-config/page-settings/page-settings.component.scss b/src/app/shared/components/node-config/page-settings/page-settings.component.scss index d0257b87..02b6037b 100644 --- a/src/app/shared/components/node-config/page-settings/page-settings.component.scss +++ b/src/app/shared/components/node-config/page-settings/page-settings.component.scss @@ -5,4 +5,5 @@ &:not(:first-child) { margin: 3rem 0; } -} \ No newline at end of file +} + diff --git a/src/app/shared/components/node-config/page-settings/page-settings.component.ts b/src/app/shared/components/node-config/page-settings/page-settings.component.ts index b91d66f3..2bdaada1 100644 --- a/src/app/shared/components/node-config/page-settings/page-settings.component.ts +++ b/src/app/shared/components/node-config/page-settings/page-settings.component.ts @@ -73,6 +73,13 @@ export class PageSettingsComponent implements OnInit, OnDestroy { this.store.dispatch(savePageSettings({ payload: this.pageSettings })); } + onTableReset(currPageId: string, currTable: TableSetting) { + const pageIdx = this.pageSettings.findIndex((page) => page.pageId === currPageId); + const tableIdx = this.pageSettings[pageIdx].tables.findIndex((table) => table.tableId === currTable.tableId); + const tableToReplace = CLN_DEFAULT_PAGE_SETTINGS.find((page) => page.pageId === currPageId)?.tables.find((table) => table.tableId === currTable.tableId) || this.pageSettings.find((page) => page.pageId === currPageId)?.tables.find((table) => table.tableId === currTable.tableId); + this.pageSettings[pageIdx].tables.splice(tableIdx, 1, tableToReplace!); + } + onResetPageSettings(prev: string) { if (prev === 'current') { this.errorMessage = null; diff --git a/src/app/shared/services/consts-enums-functions.ts b/src/app/shared/services/consts-enums-functions.ts index b0595f60..56b722b7 100644 --- a/src/app/shared/services/consts-enums-functions.ts +++ b/src/app/shared/services/consts-enums-functions.ts @@ -675,16 +675,6 @@ export enum SortOrderEnum { export const SORT_ORDERS = ['asc', 'desc']; export const CLN_DEFAULT_PAGE_SETTINGS: PageSettingsCLN[] = [ - { pageId: 'payments', tables: [ - { tableId: 'payments', recordsPerPage: PAGE_SIZE, sortBy: 'created_at', sortOrder: SortOrderEnum.DESCENDING, - columnSelectionSM: ['created_at', 'msatoshi'], - columnSelection: ['created_at', 'type', 'payment_hash', 'msatoshi_sent', 'msatoshi'] } - ] }, - { pageId: 'invoices', tables: [ - { tableId: 'invoices', recordsPerPage: PAGE_SIZE, sortBy: 'expires_at', sortOrder: SortOrderEnum.DESCENDING, - columnSelectionSM: ['expires_at', 'msatoshi'], - columnSelection: ['expires_at', 'paid_at', 'type', 'description', 'msatoshi', 'msatoshi_received'] } - ] }, { pageId: 'on-chain', tables: [ { tableId: 'utxos', recordsPerPage: PAGE_SIZE, sortBy: 'blockheight', sortOrder: SortOrderEnum.DESCENDING, columnSelectionSM: ['txid', 'value'], @@ -692,10 +682,32 @@ export const CLN_DEFAULT_PAGE_SETTINGS: PageSettingsCLN[] = [ { tableId: 'dust_utxos', recordsPerPage: PAGE_SIZE, sortBy: 'blockheight', sortOrder: SortOrderEnum.DESCENDING, columnSelectionSM: ['txid', 'value'], columnSelection: ['txid', 'output', 'value', 'blockheight'] } + ] }, + { pageId: 'transactions', tables: [ + { tableId: 'payments', recordsPerPage: PAGE_SIZE, sortBy: 'created_at', sortOrder: SortOrderEnum.DESCENDING, + columnSelectionSM: ['created_at', 'msatoshi'], + columnSelection: ['created_at', 'type', 'payment_hash', 'msatoshi_sent', 'msatoshi'] }, + { tableId: 'invoices', recordsPerPage: PAGE_SIZE, sortBy: 'expires_at', sortOrder: SortOrderEnum.DESCENDING, + columnSelectionSM: ['expires_at', 'msatoshi'], + columnSelection: ['expires_at', 'paid_at', 'type', 'description', 'msatoshi', 'msatoshi_received'] }, + { tableId: 'offers', recordsPerPage: PAGE_SIZE, sortBy: 'offer_id', sortOrder: SortOrderEnum.DESCENDING, + columnSelectionSM: ['offer_id', 'single_use'], + columnSelection: ['offer_id', 'single_use', 'used'] }, + { tableId: 'offer_bookmarks', recordsPerPage: PAGE_SIZE, sortBy: 'lastUpdatedAt', sortOrder: SortOrderEnum.DESCENDING, + columnSelectionSM: ['lastUpdatedAt', 'amountMSat'], + columnSelection: ['lastUpdatedAt', 'title', 'amountMSat', 'description'] } ] } ]; export const CLN_TABLES_DEF = { + utxos: { + maxColumns: 7, + allowedColumns: ['txid', 'address', 'scriptpubkey', 'output', 'value', 'blockheight', 'reserved'] + }, + dust_utxos: { + maxColumns: 7, + allowedColumns: ['txid', 'address', 'scriptpubkey', 'output', 'value', 'blockheight', 'reserved'] + }, payments: { maxColumns: 5, allowedColumns: ['created_at', 'type', 'payment_hash', 'bolt11', 'destination', 'memo', 'label', 'msatoshi_sent', 'msatoshi'] @@ -704,12 +716,12 @@ export const CLN_TABLES_DEF = { maxColumns: 6, allowedColumns: ['expires_at', 'paid_at', 'type', 'description', 'label', 'payment_hash', 'bolt11', 'msatoshi', 'msatoshi_received'] }, - utxos: { - maxColumns: 7, - allowedColumns: ['txid', 'address', 'scriptpubkey', 'output', 'value', 'blockheight', 'reserved'] + offers: { + maxColumns: 4, + allowedColumns: ['offer_id', 'single_use', 'used', 'bolt12'] }, - dust_utxos: { - maxColumns: 7, - allowedColumns: ['txid', 'address', 'scriptpubkey', 'output', 'value', 'blockheight', 'reserved'] + offer_bookmarks: { + maxColumns: 5, + allowedColumns: ['lastUpdatedAt', 'title', 'amountMSat', 'description', 'vendor', 'bolt12'] } };