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

Fixed grid paddings

Browse Source
This commit is contained in:
ShahanaFarooqui 2022-10-28 09:41:38 -07:00
parent 0ce5107e86
commit 2e54ba92ac
67 changed files with 528 additions and 413 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
backend/controllers/cln/offers.js
View File

@ -11,7 +11,7 @@ export const listOfferBookmarks = (req, res, next) => {
logger.log({ selectedNode: req.session.selectedNode, level: 'INFO', fileName: 'Offers', msg: 'Getting Offer Bookmarks..' }); logger.log({ selectedNode: req.session.selectedNode, level: 'INFO', fileName: 'Offers', msg: 'Getting Offer Bookmarks..' });
databaseService.find(req.session.selectedNode, CollectionsEnum.OFFERS).then((offers) => { 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 }); logger.log({ selectedNode: req.session.selectedNode, level: 'INFO', fileName: 'Offers', msg: 'Offer Bookmarks Received', data: offers });
res.status(200).json(offers); res.status(200).json(offers.Offers);
}).catch((errRes) => { }).catch((errRes) => {
const err = common.handleError(errRes, 'Offers', 'Offer Bookmarks Error', req.session.selectedNode); const err = common.handleError(errRes, 'Offers', 'Offer Bookmarks Error', req.session.selectedNode);
return res.status(err.statusCode).json({ message: err.message, error: err.error }); return res.status(err.statusCode).json({ message: err.message, error: err.error });

3
backend/models/database.model.js
View File

@ -134,3 +134,6 @@ export var CollectionsEnum;
CollectionsEnum["PAGE_SETTINGS"] = "PageSettings"; CollectionsEnum["PAGE_SETTINGS"] = "PageSettings";
})(CollectionsEnum || (CollectionsEnum = {})); })(CollectionsEnum || (CollectionsEnum = {}));
export const CollectionFieldsEnum = Object.assign(Object.assign(Object.assign({}, OfferFieldsEnum), PageSettingsFieldsEnum), TableSettingsFieldsEnum); export const CollectionFieldsEnum = Object.assign(Object.assign(Object.assign({}, OfferFieldsEnum), PageSettingsFieldsEnum), TableSettingsFieldsEnum);
export const LNDCollection = [CollectionsEnum.PAGE_SETTINGS];
export const ECLCollection = [CollectionsEnum.PAGE_SETTINGS];
export const CLNCollection = [CollectionsEnum.PAGE_SETTINGS, CollectionsEnum.OFFERS];

84
backend/utils/database.js
View File

@ -3,7 +3,7 @@ import { join, dirname, sep } from 'path';
import { fileURLToPath } from 'url'; import { fileURLToPath } from 'url';
import { Common } from '../utils/common.js'; import { Common } from '../utils/common.js';
import { Logger } from '../utils/logger.js'; import { Logger } from '../utils/logger.js';
import { validateDocument } from '../models/database.model.js'; import { validateDocument, LNDCollection, ECLCollection, CLNCollection } from '../models/database.model.js';
export class DatabaseService { export class DatabaseService {
constructor() { constructor() {
this.common = Common; this.common = Common;
@ -15,9 +15,10 @@ export class DatabaseService {
const { id, selectedNode } = session; const { id, selectedNode } = session;
try { try {
if (!this.nodeDatabase[selectedNode.index]) { if (!this.nodeDatabase[selectedNode.index]) {
this.nodeDatabase[selectedNode.index] = { adapter: null, data: null }; this.nodeDatabase[selectedNode.index] = { adapter: null, data: {} };
this.nodeDatabase[selectedNode.index].adapter = new DatabaseAdapter(this.dbDirectory, 'rtldb', selectedNode, id); this.nodeDatabase[selectedNode.index].adapter = new DatabaseAdapter(this.dbDirectory, selectedNode, id);
this.nodeDatabase[selectedNode.index].data = this.nodeDatabase[selectedNode.index].adapter.fetchData(); this.fetchNodeData(selectedNode);
this.logger.log({ selectedNode: selectedNode, level: 'DEBUG', fileName: 'Database', msg: 'Database Loaded', data: this.nodeDatabase[selectedNode.index].data });
} }
else { else {
this.nodeDatabase[selectedNode.index].adapter.insertSession(id); this.nodeDatabase[selectedNode.index].adapter.insertSession(id);
@ -27,6 +28,31 @@ export class DatabaseService {
this.logger.log({ selectedNode: selectedNode, level: 'ERROR', fileName: 'Database', msg: 'Database Load Error', error: err }); this.logger.log({ selectedNode: selectedNode, level: 'ERROR', fileName: 'Database', msg: 'Database Load Error', error: err });
} }
} }
fetchNodeData(selectedNode) {
switch (selectedNode.ln_implementation) {
case 'CLN':
for (const collectionName in CLNCollection) {
if (CLNCollection.hasOwnProperty(collectionName)) {
this.nodeDatabase[selectedNode.index].data[CLNCollection[collectionName]] = this.nodeDatabase[selectedNode.index].adapter.fetchData(CLNCollection[collectionName]);
}
}
break;
case 'ECL':
for (const collectionName in ECLCollection) {
if (ECLCollection.hasOwnProperty(collectionName)) {
this.nodeDatabase[selectedNode.index].data[ECLCollection[collectionName]] = this.nodeDatabase[selectedNode.index].adapter.fetchData(ECLCollection[collectionName]);
}
}
break;
default:
for (const collectionName in LNDCollection) {
if (LNDCollection.hasOwnProperty(collectionName)) {
this.nodeDatabase[selectedNode.index].data[LNDCollection[collectionName]] = this.nodeDatabase[selectedNode.index].adapter.fetchData(LNDCollection[collectionName]);
}
}
break;
}
}
validateDocument(collectionName, newDocument) { validateDocument(collectionName, newDocument) {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
const validationRes = validateDocument(collectionName, newDocument); const validationRes = validateDocument(collectionName, newDocument);
@ -161,36 +187,53 @@ export class DatabaseService {
} }
} }
export class DatabaseAdapter { export class DatabaseAdapter {
constructor(dbDirectoryPath, fileName, selNode = null, id = '') { constructor(dbDirectoryPath, selNode = null, id = '') {
this.dbDirectoryPath = dbDirectoryPath; this.dbDirectoryPath = dbDirectoryPath;
this.fileName = fileName;
this.selNode = selNode; this.selNode = selNode;
this.id = id; this.id = id;
this.dbFile = ''; this.logger = Logger;
this.common = Common;
this.dbFilePath = '';
this.userSessions = []; this.userSessions = [];
this.dbFile = dbDirectoryPath + sep + fileName + '-node-' + selNode.index + '.json'; this.dbFilePath = dbDirectoryPath + sep + 'node-' + selNode.index;
const oldFileName = dbDirectoryPath + sep + 'rtldb-node-' + selNode.index + '.json';
if (selNode.ln_implementation === 'CLN' && fs.existsSync(oldFileName)) {
this.renameOldDB(oldFileName, selNode);
}
this.insertSession(id); this.insertSession(id);
} }
fetchData() { renameOldDB(oldFileName, selNode = null) {
const newFileName = this.dbFilePath + sep + 'rtldb-' + selNode.ln_implementation + '-Offers.json';
try { try {
if (!fs.existsSync(this.dbDirectoryPath)) { this.common.createDirectory(this.dbFilePath);
fs.mkdirSync(this.dbDirectoryPath); fs.renameSync(oldFileName, newFileName);
}
catch (err) {
this.logger.log({ selectedNode: selNode, level: 'ERROR', fileName: 'Database', msg: 'Rename Old Database Error', error: err });
}
}
fetchData(collectionName) {
try {
if (!fs.existsSync(this.dbFilePath)) {
fs.mkdirSync(this.dbFilePath);
} }
} }
catch (err) { catch (err) {
return new Error('Unable to Create Directory Error ' + JSON.stringify(err)); return new Error('Unable to Create Directory Error ' + JSON.stringify(err));
} }
const collectionFileName = this.dbFilePath + sep + 'rtldb-' + this.selNode.ln_implementation + '-' + collectionName + '.json';
try { try {
if (!fs.existsSync(this.dbFile)) { if (!fs.existsSync(collectionFileName)) {
fs.writeFileSync(this.dbFile, '{}'); fs.writeFileSync(collectionFileName, '{}');
} }
} }
catch (err) { catch (err) {
return new Error('Unable to Create Database File Error ' + JSON.stringify(err)); return new Error('Unable to Create Database File Error ' + JSON.stringify(err));
} }
try { try {
const dataFromFile = fs.readFileSync(this.dbFile, 'utf-8'); const dataFromFile = fs.readFileSync(collectionFileName, 'utf-8');
return !dataFromFile ? null : JSON.parse(dataFromFile); const dataObj = !dataFromFile ? null : JSON.parse(dataFromFile);
return dataObj;
} }
catch (err) { catch (err) {
return new Error('Database Read Error ' + JSON.stringify(err)); return new Error('Database Read Error ' + JSON.stringify(err));
@ -202,9 +245,14 @@ export class DatabaseAdapter {
saveData(data) { saveData(data) {
try { try {
if (data) { if (data) {
const tempFile = this.dbFile + '.tmp'; for (const collectionName in data) {
fs.writeFileSync(tempFile, JSON.stringify(data, null, 2)); if (data.hasOwnProperty(collectionName)) {
fs.renameSync(tempFile, this.dbFile); const collectionFileName = this.dbFilePath + sep + 'rtldb-' + this.selNode.ln_implementation + '-' + collectionName + '.json';
const tempFile = collectionFileName + '.tmp';
fs.writeFileSync(tempFile, JSON.stringify(data, null, 2));
fs.renameSync(tempFile, collectionFileName);
}
}
} }
return true; return true;
} }

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

@ -11,9 +11,9 @@ const databaseService: DatabaseService = Database;
export const listOfferBookmarks = (req, res, next) => { export const listOfferBookmarks = (req, res, next) => {
logger.log({ selectedNode: req.session.selectedNode, level: 'INFO', fileName: 'Offers', msg: 'Getting Offer Bookmarks..' }); logger.log({ selectedNode: req.session.selectedNode, level: 'INFO', fileName: 'Offers', msg: 'Getting Offer Bookmarks..' });
databaseService.find(req.session.selectedNode, CollectionsEnum.OFFERS).then((offers: Offer[]) => { databaseService.find(req.session.selectedNode, CollectionsEnum.OFFERS).then((offers: any) => {
logger.log({ selectedNode: req.session.selectedNode, level: 'INFO', fileName: 'Offers', msg: 'Offer Bookmarks Received', data: offers }); logger.log({ selectedNode: req.session.selectedNode, level: 'INFO', fileName: 'Offers', msg: 'Offer Bookmarks Received', data: offers });
res.status(200).json(offers); res.status(200).json(offers.Offers);
}).catch((errRes) => { }).catch((errRes) => {
const err = common.handleError(errRes, 'Offers', 'Offer Bookmarks Error', req.session.selectedNode); const err = common.handleError(errRes, 'Offers', 'Offer Bookmarks Error', req.session.selectedNode);
return res.status(err.statusCode).json({ message: err.message, error: err.error }); return res.status(err.statusCode).json({ message: err.message, error: err.error });

4
server/models/database.model.ts
View File

@ -150,3 +150,7 @@ export type Collections = {
} }
export const CollectionFieldsEnum = { ...OfferFieldsEnum, ...PageSettingsFieldsEnum, ...TableSettingsFieldsEnum }; export const CollectionFieldsEnum = { ...OfferFieldsEnum, ...PageSettingsFieldsEnum, ...TableSettingsFieldsEnum };
export const LNDCollection = [CollectionsEnum.PAGE_SETTINGS];
export const ECLCollection = [CollectionsEnum.PAGE_SETTINGS];
export const CLNCollection = [CollectionsEnum.PAGE_SETTINGS, CollectionsEnum.OFFERS];

84
server/utils/database.ts
View File

@ -3,7 +3,7 @@ import { join, dirname, sep } from 'path';
import { fileURLToPath } from 'url'; import { fileURLToPath } from 'url';
import { Common, CommonService } from '../utils/common.js'; import { Common, CommonService } from '../utils/common.js';
import { Logger, LoggerService } from '../utils/logger.js'; import { Logger, LoggerService } from '../utils/logger.js';
import { Collections, CollectionsEnum, validateDocument } from '../models/database.model.js'; import { Collections, CollectionsEnum, validateDocument, LNDCollection, ECLCollection, CLNCollection } from '../models/database.model.js';
import { CommonSelectedNode } from '../models/config.model.js'; import { CommonSelectedNode } from '../models/config.model.js';
export class DatabaseService { export class DatabaseService {
@ -19,9 +19,10 @@ export class DatabaseService {
const { id, selectedNode } = session; const { id, selectedNode } = session;
try { try {
if (!this.nodeDatabase[selectedNode.index]) { if (!this.nodeDatabase[selectedNode.index]) {
this.nodeDatabase[selectedNode.index] = { adapter: null, data: null }; this.nodeDatabase[selectedNode.index] = { adapter: null, data: {} };
this.nodeDatabase[selectedNode.index].adapter = new DatabaseAdapter(this.dbDirectory, 'rtldb', selectedNode, id); this.nodeDatabase[selectedNode.index].adapter = new DatabaseAdapter(this.dbDirectory, selectedNode, id);
this.nodeDatabase[selectedNode.index].data = this.nodeDatabase[selectedNode.index].adapter.fetchData(); this.fetchNodeData(selectedNode);
this.logger.log({ selectedNode: selectedNode, level: 'DEBUG', fileName: 'Database', msg: 'Database Loaded', data: this.nodeDatabase[selectedNode.index].data });
} else { } else {
this.nodeDatabase[selectedNode.index].adapter.insertSession(id); this.nodeDatabase[selectedNode.index].adapter.insertSession(id);
} }
@ -30,6 +31,34 @@ export class DatabaseService {
} }
} }
fetchNodeData(selectedNode: CommonSelectedNode) {
switch (selectedNode.ln_implementation) {
case 'CLN':
for (const collectionName in CLNCollection) {
if (CLNCollection.hasOwnProperty(collectionName)) {
this.nodeDatabase[selectedNode.index].data[CLNCollection[collectionName]] = this.nodeDatabase[selectedNode.index].adapter.fetchData(CLNCollection[collectionName]);
}
}
break;
case 'ECL':
for (const collectionName in ECLCollection) {
if (ECLCollection.hasOwnProperty(collectionName)) {
this.nodeDatabase[selectedNode.index].data[ECLCollection[collectionName]] = this.nodeDatabase[selectedNode.index].adapter.fetchData(ECLCollection[collectionName]);
}
}
break;
default:
for (const collectionName in LNDCollection) {
if (LNDCollection.hasOwnProperty(collectionName)) {
this.nodeDatabase[selectedNode.index].data[LNDCollection[collectionName]] = this.nodeDatabase[selectedNode.index].adapter.fetchData(LNDCollection[collectionName]);
}
}
break;
}
}
validateDocument(collectionName, newDocument) { validateDocument(collectionName, newDocument) {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
const validationRes = validateDocument(collectionName, newDocument); const validationRes = validateDocument(collectionName, newDocument);
@ -164,32 +193,48 @@ export class DatabaseService {
export class DatabaseAdapter { export class DatabaseAdapter {
private dbFile = ''; private logger: LoggerService = Logger;
private common: CommonService = Common;
private dbFilePath = '';
private userSessions = []; private userSessions = [];
constructor(public dbDirectoryPath: string, public fileName: string, private selNode: CommonSelectedNode = null, private id: string = '') { constructor(public dbDirectoryPath: string, private selNode: CommonSelectedNode = null, private id: string = '') {
this.dbFile = dbDirectoryPath + sep + fileName + '-node-' + selNode.index + '.json'; this.dbFilePath = dbDirectoryPath + sep + 'node-' + selNode.index;
const oldFileName = dbDirectoryPath + sep + 'rtldb-node-' + selNode.index + '.json';
if (selNode.ln_implementation === 'CLN' && fs.existsSync(oldFileName)) { this.renameOldDB(oldFileName, selNode); }
this.insertSession(id); this.insertSession(id);
} }
fetchData() { renameOldDB(oldFileName: string, selNode: CommonSelectedNode = null) {
const newFileName = this.dbFilePath + sep + 'rtldb-' + selNode.ln_implementation + '-Offers.json';
try { try {
if (!fs.existsSync(this.dbDirectoryPath)) { this.common.createDirectory(this.dbFilePath);
fs.mkdirSync(this.dbDirectoryPath); fs.renameSync(oldFileName, newFileName);
} catch (err) {
this.logger.log({ selectedNode: selNode, level: 'ERROR', fileName: 'Database', msg: 'Rename Old Database Error', error: err });
}
}
fetchData(collectionName: string) {
try {
if (!fs.existsSync(this.dbFilePath)) {
fs.mkdirSync(this.dbFilePath);
} }
} catch (err) { } catch (err) {
return new Error('Unable to Create Directory Error ' + JSON.stringify(err)); return new Error('Unable to Create Directory Error ' + JSON.stringify(err));
} }
const collectionFileName = this.dbFilePath + sep + 'rtldb-' + this.selNode.ln_implementation + '-' + collectionName + '.json';
try { try {
if (!fs.existsSync(this.dbFile)) { if (!fs.existsSync(collectionFileName)) {
fs.writeFileSync(this.dbFile, '{}'); fs.writeFileSync(collectionFileName, '{}');
} }
} catch (err) { } catch (err) {
return new Error('Unable to Create Database File Error ' + JSON.stringify(err)); return new Error('Unable to Create Database File Error ' + JSON.stringify(err));
} }
try { try {
const dataFromFile = fs.readFileSync(this.dbFile, 'utf-8'); const dataFromFile = fs.readFileSync(collectionFileName, 'utf-8');
return !dataFromFile ? null : (<Collections>JSON.parse(dataFromFile)); const dataObj = !dataFromFile ? null : (<Collections>JSON.parse(dataFromFile));
return dataObj;
} catch (err) { } catch (err) {
return new Error('Database Read Error ' + JSON.stringify(err)); return new Error('Database Read Error ' + JSON.stringify(err));
} }
@ -202,9 +247,14 @@ export class DatabaseAdapter {
saveData(data: any) { saveData(data: any) {
try { try {
if (data) { if (data) {
const tempFile = this.dbFile + '.tmp'; for (const collectionName in data) {
fs.writeFileSync(tempFile, JSON.stringify(data, null, 2)); if (data.hasOwnProperty(collectionName)) {
fs.renameSync(tempFile, this.dbFile); const collectionFileName = this.dbFilePath + sep + 'rtldb-' + this.selNode.ln_implementation + '-' + collectionName + '.json';
const tempFile = collectionFileName + '.tmp';
fs.writeFileSync(tempFile, JSON.stringify(data, null, 2));
fs.renameSync(tempFile, collectionFileName);
}
}
} }
return true; return true;
} catch (err) { } catch (err) {

4
src/app/cln/graph/lookups/lookups.component.scss
View File

@ -8,7 +8,3 @@
margin-bottom: 0; margin-bottom: 0;
list-style-type: none; list-style-type: none;
} }
.pl-3 {
padding-left: 3rem;
}

4
src/app/cln/graph/lookups/node-lookup/node-lookup.component.html
View File

@ -39,10 +39,10 @@
<td mat-cell *matCellDef="let address"> {{address?.port}} </td> <td mat-cell *matCellDef="let address"> {{address?.port}} </td>
</ng-container> </ng-container>
<ng-container matColumnDef="actions"> <ng-container matColumnDef="actions">
<th mat-header-cell *matHeaderCellDef class="pl-1"> <th mat-header-cell *matHeaderCellDef>
<div class="bordered-box table-actions-select btn-action" fxLayoutAlign="center center">Actions</div> <div class="bordered-box table-actions-select btn-action" fxLayoutAlign="center center">Actions</div>
</th> </th>
<td mat-cell *matCellDef="let address" class="pl-1"> <td mat-cell *matCellDef="let address">
<span fxLayoutAlign="end center"> <span fxLayoutAlign="end center">
<button mat-stroked-button class="btn-action-copy" color="primary" type="button" tabindex="1" rtlClipboard [payload]="lookupResult?.nodeid + '@' + address.address + ':' + address.port" (copied)="onCopyNodeURI($event)">Copy Node URI</button> <button mat-stroked-button class="btn-action-copy" color="primary" type="button" tabindex="1" rtlClipboard [payload]="lookupResult?.nodeid + '@' + address.address + ':' + address.port" (copied)="onCopyNodeURI($event)">Copy Node URI</button>
</span> </span>

24
src/app/cln/graph/query-routes/query-routes.component.html
View File

@ -35,34 +35,34 @@
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="alias"> <ng-container matColumnDef="alias">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> Alias </th> <th mat-header-cell *matHeaderCellDef mat-sort-header> Alias </th>
<td mat-cell *matCellDef="let hop" class="pl-1"> <td mat-cell *matCellDef="let hop">
<div class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '12rem' : '40rem'}"> <div class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '12rem' : '40rem'}">
<span class="ellipsis-child">{{hop?.alias}}</span> <span class="ellipsis-child">{{hop?.alias}}</span>
</div> </div>
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="channel"> <ng-container matColumnDef="channel">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> Channel </th> <th mat-header-cell *matHeaderCellDef mat-sort-header> Channel </th>
<td mat-cell *matCellDef="let hop" class="pl-1"> {{hop?.channel}} </td> <td mat-cell *matCellDef="let hop"> {{hop?.channel}} </td>
</ng-container> </ng-container>
<ng-container matColumnDef="direction"> <ng-container matColumnDef="direction">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> Direction </th> <th mat-header-cell *matHeaderCellDef mat-sort-header> Direction </th>
<td mat-cell *matCellDef="let hop" class="pl-1"> {{hop?.direction}} </td> <td mat-cell *matCellDef="let hop"> {{hop?.direction}} </td>
</ng-container> </ng-container>
<ng-container matColumnDef="delay"> <ng-container matColumnDef="delay">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before" class="pl-1"> Delay </th> <th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before"> Delay </th>
<td mat-cell *matCellDef="let hop" class="pl-1"><span fxLayoutAlign="end center"> {{hop?.delay | number}} </span></td> <td mat-cell *matCellDef="let hop"><span fxLayoutAlign="end center"> {{hop?.delay | number}} </span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="msatoshi"> <ng-container matColumnDef="msatoshi">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before" class="pl-1"> Amount (Sats) </th> <th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before"> Amount (Sats) </th>
<td mat-cell *matCellDef="let hop" class="pl-1"><span fxLayoutAlign="end center"> {{hop?.msatoshi/1000 | number}}</span></td> <td mat-cell *matCellDef="let hop"><span fxLayoutAlign="end center"> {{hop?.msatoshi/1000 | number}}</span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="actions"> <ng-container matColumnDef="actions">
<th mat-header-cell *matHeaderCellDef class="pl-2 pr-3"> <th mat-header-cell *matHeaderCellDef>
<div class="bordered-box table-actions-select" fxLayoutAlign="center center">Actions</div> <div class="bordered-box table-actions-select" fxLayoutAlign="center center">Actions</div>
</th> </th>
<td mat-cell *matCellDef="let hop" class="pl-2 pr-3" fxLayoutAlign="end center"> <td mat-cell *matCellDef="let hop" fxLayoutAlign="end center">
<button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onHopClick(hop, $event)" class="table-actions-button">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> </td>
</ng-container> </ng-container>

36
src/app/cln/liquidity-ads/liquidity-ads-list/liquidity-ads-list.component.html
View File

@ -74,57 +74,57 @@
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="nodeid"> <ng-container matColumnDef="nodeid">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> Node Id </th> <th mat-header-cell *matHeaderCellDef mat-sort-header> Node Id </th>
<td mat-cell *matCellDef="let lqNode" class="pl-1"> <td mat-cell *matCellDef="let lqNode">
<div class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}"> <div class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}">
<span class="ellipsis-child">{{lqNode?.nodeid}}</span> <span class="ellipsis-child">{{lqNode?.nodeid}}</span>
</div> </div>
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="last_timestamp"> <ng-container matColumnDef="last_timestamp">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> Last Announcement At </th> <th mat-header-cell *matHeaderCellDef mat-sort-header> Last Announcement At </th>
<td mat-cell *matCellDef="let lqNode" class="pl-1">{{((lqNode?.last_timestamp * 1000) | date:'dd/MMM/y HH:mm') || '-'}}</td> <td mat-cell *matCellDef="let lqNode">{{((lqNode?.last_timestamp * 1000) | date:'dd/MMM/y HH:mm') || '-'}}</td>
</ng-container> </ng-container>
<ng-container matColumnDef="compact_lease"> <ng-container matColumnDef="compact_lease">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> Compact Lease </th> <th mat-header-cell *matHeaderCellDef mat-sort-header> Compact Lease </th>
<td mat-cell *matCellDef="let lqNode" class="pl-1">{{ lqNode?.option_will_fund?.compact_lease }}</td> <td mat-cell *matCellDef="let lqNode">{{ lqNode?.option_will_fund?.compact_lease }}</td>
</ng-container> </ng-container>
<!-- <ng-container matColumnDef="capacity_channels"> <!-- <ng-container matColumnDef="capacity_channels">
<th mat-header-cell *matHeaderCellDef class="pl-1"> Capacity/Channels </th> <th mat-header-cell *matHeaderCellDef> Capacity/Channels </th>
<td mat-cell *matCellDef="let lqNode" class="pl-1"> <td mat-cell *matCellDef="let lqNode">
{{lqNode?.node_capacity/100000000 | number:'1.0-2'}} BTC / {{lqNode?.channel_count | number:'1.0-0'}} {{lqNode?.node_capacity/100000000 | number:'1.0-2'}} BTC / {{lqNode?.channel_count | number:'1.0-0'}}
</td> </td>
</ng-container> --> </ng-container> -->
<ng-container matColumnDef="lease_fee"> <ng-container matColumnDef="lease_fee">
<th mat-header-cell *matHeaderCellDef class="pl-1"> Lease Fee </th> <th mat-header-cell *matHeaderCellDef> Lease Fee </th>
<td mat-cell *matCellDef="let lqNode" class="pl-1"> <td mat-cell *matCellDef="let lqNode">
{{lqNode?.option_will_fund?.lease_fee_base_msat/1000 | number:'1.0-0'}} Sats + {{(lqNode?.option_will_fund?.lease_fee_basis/100) | number:'1.2-2'}}% {{lqNode?.option_will_fund?.lease_fee_base_msat/1000 | number:'1.0-0'}} Sats + {{(lqNode?.option_will_fund?.lease_fee_basis/100) | number:'1.2-2'}}%
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="routing_fee"> <ng-container matColumnDef="routing_fee">
<th mat-header-cell *matHeaderCellDef class="pl-1"> Routing Fee </th> <th mat-header-cell *matHeaderCellDef> Routing Fee </th>
<td mat-cell *matCellDef="let lqNode" class="pl-1"> <td mat-cell *matCellDef="let lqNode">
{{lqNode?.option_will_fund?.channel_fee_max_base_msat/1000 | number:'1.0-0'}} Sats + {{lqNode?.option_will_fund?.channel_fee_max_proportional_thousandths * 1000 | number:'1.0-0'}} ppm {{lqNode?.option_will_fund?.channel_fee_max_base_msat/1000 | number:'1.0-0'}} Sats + {{lqNode?.option_will_fund?.channel_fee_max_proportional_thousandths * 1000 | number:'1.0-0'}} ppm
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="channel_opening_fee"> <ng-container matColumnDef="channel_opening_fee">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before" class="pl-1"> Channel Opening Fee (Sats) </th> <th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before"> Channel Opening Fee (Sats) </th>
<td mat-cell *matCellDef="let lqNode" class="pl-1"> <td mat-cell *matCellDef="let lqNode">
<span fxLayoutAlign="end center"> <span fxLayoutAlign="end center">
{{lqNode.channel_opening_fee | number:'1.0-0'}} {{lqNode.channel_opening_fee | number:'1.0-0'}}
</span> </span>
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="funding_weight"> <ng-container matColumnDef="funding_weight">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before" class="pl-1"> Funding Weight </th> <th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before"> Funding Weight </th>
<td mat-cell *matCellDef="let lqNode" class="pl-1"> <td mat-cell *matCellDef="let lqNode">
<span fxLayoutAlign="end center"> <span fxLayoutAlign="end center">
{{lqNode?.option_will_fund?.funding_weight | number:'1.0-0'}} {{lqNode?.option_will_fund?.funding_weight | number:'1.0-0'}}
</span> </span>
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="actions"> <ng-container matColumnDef="actions">
<th mat-header-cell *matHeaderCellDef class="px-3"> <th mat-header-cell *matHeaderCellDef>
<div 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 placeholder="Actions" tabindex="1" class="mr-0">
<mat-select-trigger></mat-select-trigger> <mat-select-trigger></mat-select-trigger>
@ -132,7 +132,7 @@
</mat-select> </mat-select>
</div> </div>
</th> </th>
<td mat-cell *matCellDef="let lqNode" fxLayoutAlign="end center" class="px-3"> <td mat-cell *matCellDef="let lqNode" fxLayoutAlign="end center">
<div 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 placeholder="Actions" tabindex="1" class="mr-0">
<mat-select-trigger></mat-select-trigger> <mat-select-trigger></mat-select-trigger>

6
src/app/cln/on-chain/utxo-tables/utxos/utxos.component.html
View File

@ -65,13 +65,13 @@
{{utxo?.blockheight | number}} </span></td> {{utxo?.blockheight | number}} </span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="reserved"> <ng-container matColumnDef="reserved">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-3"> Reserved </th> <th mat-header-cell *matHeaderCellDef mat-sort-header> Reserved </th>
<td mat-cell *matCellDef="let utxo" class="pl-3"> <td mat-cell *matCellDef="let utxo">
<span>{{utxo.reserved ? 'Yes' : 'No'}}</span> <span>{{utxo.reserved ? 'Yes' : 'No'}}</span>
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="actions"> <ng-container matColumnDef="actions">
<th mat-header-cell *matHeaderCellDef class="pr-3"> <th mat-header-cell *matHeaderCellDef>
<div 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 placeholder="Actions" tabindex="1" class="mr-0">
<mat-select-trigger></mat-select-trigger> <mat-select-trigger></mat-select-trigger>

56
src/app/cln/peers-channels/channels/channels-tables/channel-open-table/channel-open-table.component.html
View File

@ -16,82 +16,82 @@
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="short_channel_id"> <ng-container matColumnDef="short_channel_id">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> Short Channel ID </th> <th mat-header-cell *matHeaderCellDef mat-sort-header> Short Channel ID </th>
<td mat-cell *matCellDef="let channel" class="pl-1"> <td mat-cell *matCellDef="let channel">
<div class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '12rem' : '22rem'}"> <div class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '12rem' : '22rem'}">
<span class="ellipsis-child">{{channel?.short_channel_id}}</span> <span class="ellipsis-child">{{channel?.short_channel_id}}</span>
</div> </div>
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="alias"> <ng-container matColumnDef="alias">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> Alias </th> <th mat-header-cell *matHeaderCellDef mat-sort-header> Alias </th>
<td mat-cell *matCellDef="let channel" class="pl-1"> <td mat-cell *matCellDef="let channel">
<div class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '12rem' : '22rem'}"> <div class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '12rem' : '22rem'}">
<span class="ellipsis-child">{{channel?.alias}}</span> <span class="ellipsis-child">{{channel?.alias}}</span>
</div> </div>
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="id"> <ng-container matColumnDef="id">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> Id </th> <th mat-header-cell *matHeaderCellDef mat-sort-header> Id </th>
<td mat-cell *matCellDef="let channel" class="pl-1"> <td mat-cell *matCellDef="let channel">
<div class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '12rem' : '22rem'}"> <div class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '12rem' : '22rem'}">
<span class="ellipsis-child">{{channel?.id}}</span> <span class="ellipsis-child">{{channel?.id}}</span>
</div> </div>
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="channel_id"> <ng-container matColumnDef="channel_id">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> Channel Id </th> <th mat-header-cell *matHeaderCellDef mat-sort-header> Channel Id </th>
<td mat-cell *matCellDef="let channel" class="pl-1"> <td mat-cell *matCellDef="let channel">
<div class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '12rem' : '22rem'}"> <div class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '12rem' : '22rem'}">
<span class="ellipsis-child">{{channel?.channel_id}}</span> <span class="ellipsis-child">{{channel?.channel_id}}</span>
</div> </div>
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="funding_txid"> <ng-container matColumnDef="funding_txid">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> Funding Transaction Id </th> <th mat-header-cell *matHeaderCellDef mat-sort-header> Funding Transaction Id </th>
<td mat-cell *matCellDef="let channel" class="pl-1"> <td mat-cell *matCellDef="let channel">
<div class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '12rem' : '22rem'}"> <div class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '12rem' : '22rem'}">
<span class="ellipsis-child">{{channel?.funding_txid}}</span> <span class="ellipsis-child">{{channel?.funding_txid}}</span>
</div> </div>
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="connected"> <ng-container matColumnDef="connected">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> Connected </th> <th mat-header-cell *matHeaderCellDef mat-sort-header> Connected </th>
<td mat-cell *matCellDef="let channel" class="pl-1"> {{(channel?.connected) ? 'Connected' : 'Disconnected'}} </td> <td mat-cell *matCellDef="let channel"> {{(channel?.connected) ? 'Connected' : 'Disconnected'}} </td>
</ng-container> </ng-container>
<ng-container matColumnDef="our_channel_reserve_satoshis"> <ng-container matColumnDef="our_channel_reserve_satoshis">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before" class="pl-1"> Local Reserve (Sats) </th> <th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before"> Local Reserve (Sats) </th>
<td mat-cell *matCellDef="let channel" class="pl-1"><span fxLayoutAlign="end center"> <td mat-cell *matCellDef="let channel"><span fxLayoutAlign="end center">
{{channel?.our_channel_reserve_satoshis | number:'1.0-0'}} </span></td> {{channel?.our_channel_reserve_satoshis | number:'1.0-0'}} </span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="their_channel_reserve_satoshis"> <ng-container matColumnDef="their_channel_reserve_satoshis">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before" class="pl-1"> Remote Reserve (Sats) </th> <th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before"> Remote Reserve (Sats) </th>
<td mat-cell *matCellDef="let channel" class="pl-1"><span fxLayoutAlign="end center"> <td mat-cell *matCellDef="let channel"><span fxLayoutAlign="end center">
{{channel?.their_channel_reserve_satoshis | number:'1.0-0'}} </span></td> {{channel?.their_channel_reserve_satoshis | number:'1.0-0'}} </span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="msatoshi_total"> <ng-container matColumnDef="msatoshi_total">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before" class="pl-1"> Total (Sats) </th> <th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before"> Total (Sats) </th>
<td mat-cell *matCellDef="let channel" class="pl-1"><span fxLayoutAlign="end center"> <td mat-cell *matCellDef="let channel"><span fxLayoutAlign="end center">
{{channel?.msatoshi_total/1000 | number:channel?.msatoshi_to_us < 1000 ? '1.0-4' : '1.0-0'}} </span></td> {{channel?.msatoshi_total/1000 | number:channel?.msatoshi_to_us < 1000 ? '1.0-4' : '1.0-0'}} </span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="spendable_msatoshi"> <ng-container matColumnDef="spendable_msatoshi">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before" class="pl-1"> Spendable (Sats) </th> <th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before"> Spendable (Sats) </th>
<td mat-cell *matCellDef="let channel" class="pl-1"><span fxLayoutAlign="end center"> <td mat-cell *matCellDef="let channel"><span fxLayoutAlign="end center">
{{channel?.spendable_msatoshi/1000 | number:channel?.msatoshi_to_us < 1000 ? '1.0-4' : '1.0-0'}} </span></td> {{channel?.spendable_msatoshi/1000 | number:channel?.msatoshi_to_us < 1000 ? '1.0-4' : '1.0-0'}} </span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="msatoshi_to_us"> <ng-container matColumnDef="msatoshi_to_us">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before" class="pl-1"> Local Balance (Sats) </th> <th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before"> Local Balance (Sats) </th>
<td mat-cell *matCellDef="let channel" class="pl-1"><span fxLayoutAlign="end center"> <td mat-cell *matCellDef="let channel"><span fxLayoutAlign="end center">
{{channel?.msatoshi_to_us/1000 | number:channel?.msatoshi_to_us < 1000 ? '1.0-4' : '1.0-0'}} </span></td> {{channel?.msatoshi_to_us/1000 | number:channel?.msatoshi_to_us < 1000 ? '1.0-4' : '1.0-0'}} </span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="msatoshi_to_them"> <ng-container matColumnDef="msatoshi_to_them">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before" class="pl-1"> Remote Balance (Sats) </th> <th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before"> Remote Balance (Sats) </th>
<td mat-cell *matCellDef="let channel" class="pl-1"><span fxLayoutAlign="end center"> <td mat-cell *matCellDef="let channel"><span fxLayoutAlign="end center">
{{channel?.msatoshi_to_them/1000 | number:channel?.msatoshi_to_them < 1000 ? '1.0-4' : '1.0-0'}} </span></td> {{channel?.msatoshi_to_them/1000 | number:channel?.msatoshi_to_them < 1000 ? '1.0-4' : '1.0-0'}} </span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="balancedness"> <ng-container matColumnDef="balancedness">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-2">Balance Score </th> <th mat-header-cell *matHeaderCellDef mat-sort-header>Balance Score </th>
<td mat-cell *matCellDef="let channel" class="pl-2"> <td mat-cell *matCellDef="let channel">
<div fxLayout="row"> <div fxLayout="row">
<mat-hint fxFlex="100" fxLayoutAlign="center center" class="font-size-80">{{channel.balancedness || 0 | number}}</mat-hint> <mat-hint fxFlex="100" fxLayoutAlign="center center" class="font-size-80">{{channel.balancedness || 0 | number}}</mat-hint>
</div> </div>
@ -99,7 +99,7 @@
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="actions"> <ng-container matColumnDef="actions">
<th mat-header-cell *matHeaderCellDef class="pl-1"> <th mat-header-cell *matHeaderCellDef>
<div 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 placeholder="Actions" tabindex="1" class="mr-0">
<mat-select-trigger></mat-select-trigger> <mat-select-trigger></mat-select-trigger>
@ -108,7 +108,7 @@
</mat-select> </mat-select>
</div> </div>
</th> </th>
<td mat-cell *matCellDef="let channel" fxLayoutAlign="end center" class="pl-1"> <td mat-cell *matCellDef="let channel" fxLayoutAlign="end center">
<div class="bordered-box table-actions-select" fxLayoutAlign="center center"> <div class="bordered-box table-actions-select" fxLayoutAlign="center center">
<mat-select placeholder="Actions" tabindex="2" class="mr-0"> <mat-select placeholder="Actions" tabindex="2" class="mr-0">
<mat-select-trigger></mat-select-trigger> <mat-select-trigger></mat-select-trigger>

48
src/app/cln/peers-channels/channels/channels-tables/channel-pending-table/channel-pending-table.component.html
View File

@ -16,77 +16,77 @@
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="alias"> <ng-container matColumnDef="alias">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> Alias </th> <th mat-header-cell *matHeaderCellDef mat-sort-header> Alias </th>
<td mat-cell *matCellDef="let channel" class="pl-1"> <td mat-cell *matCellDef="let channel">
<div class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '12rem' : '22rem'}"> <div class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '12rem' : '22rem'}">
<span class="ellipsis-child">{{channel?.alias}}</span> <span class="ellipsis-child">{{channel?.alias}}</span>
</div> </div>
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="id"> <ng-container matColumnDef="id">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> Id </th> <th mat-header-cell *matHeaderCellDef mat-sort-header> Id </th>
<td mat-cell *matCellDef="let channel" class="pl-1"> <td mat-cell *matCellDef="let channel">
<div class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '12rem' : '22rem'}"> <div class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '12rem' : '22rem'}">
<span class="ellipsis-child">{{channel?.id}}</span> <span class="ellipsis-child">{{channel?.id}}</span>
</div> </div>
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="channel_id"> <ng-container matColumnDef="channel_id">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> Channel Id </th> <th mat-header-cell *matHeaderCellDef mat-sort-header> Channel Id </th>
<td mat-cell *matCellDef="let channel" class="pl-1"> <td mat-cell *matCellDef="let channel">
<div class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '12rem' : '22rem'}"> <div class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '12rem' : '22rem'}">
<span class="ellipsis-child">{{channel?.channel_id}}</span> <span class="ellipsis-child">{{channel?.channel_id}}</span>
</div> </div>
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="funding_txid"> <ng-container matColumnDef="funding_txid">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> Funding Transaction Id </th> <th mat-header-cell *matHeaderCellDef mat-sort-header> Funding Transaction Id </th>
<td mat-cell *matCellDef="let channel" class="pl-1"> <td mat-cell *matCellDef="let channel">
<div class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '12rem' : '22rem'}"> <div class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '12rem' : '22rem'}">
<span class="ellipsis-child">{{channel?.funding_txid}}</span> <span class="ellipsis-child">{{channel?.funding_txid}}</span>
</div> </div>
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="connected"> <ng-container matColumnDef="connected">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> Connected </th> <th mat-header-cell *matHeaderCellDef mat-sort-header> Connected </th>
<td mat-cell *matCellDef="let channel" class="pl-1"> {{(channel?.connected) ? 'Connected' : 'Disconnected'}} </td> <td mat-cell *matCellDef="let channel"> {{(channel?.connected) ? 'Connected' : 'Disconnected'}} </td>
</ng-container> </ng-container>
<ng-container matColumnDef="state"> <ng-container matColumnDef="state">
<th mat-header-cell *matHeaderCellDef mat-sort-header> State </th> <th mat-header-cell *matHeaderCellDef mat-sort-header> State </th>
<td mat-cell *matCellDef="let channel" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '12rem' : '22rem'}"> {{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>
<ng-container matColumnDef="our_channel_reserve_satoshis"> <ng-container matColumnDef="our_channel_reserve_satoshis">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before" class="pl-1"> Local Reserve (Sats) </th> <th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before"> Local Reserve (Sats) </th>
<td mat-cell *matCellDef="let channel" class="pl-1"><span fxLayoutAlign="end center"> <td mat-cell *matCellDef="let channel"><span fxLayoutAlign="end center">
{{channel?.our_channel_reserve_satoshis | number:'1.0-0'}} </span></td> {{channel?.our_channel_reserve_satoshis | number:'1.0-0'}} </span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="their_channel_reserve_satoshis"> <ng-container matColumnDef="their_channel_reserve_satoshis">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before" class="pl-1"> Remote Reserve (Sats) </th> <th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before"> Remote Reserve (Sats) </th>
<td mat-cell *matCellDef="let channel" class="pl-1"><span fxLayoutAlign="end center"> <td mat-cell *matCellDef="let channel"><span fxLayoutAlign="end center">
{{channel?.their_channel_reserve_satoshis | number:'1.0-0'}} </span></td> {{channel?.their_channel_reserve_satoshis | number:'1.0-0'}} </span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="msatoshi_total"> <ng-container matColumnDef="msatoshi_total">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before" class="pl-1"> Total (Sats) </th> <th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before"> Total (Sats) </th>
<td mat-cell *matCellDef="let channel" class="pl-1"><span fxLayoutAlign="end center"> <td mat-cell *matCellDef="let channel"><span fxLayoutAlign="end center">
{{channel?.msatoshi_total/1000 | number:channel?.msatoshi_to_us < 1000 ? '1.0-4' : '1.0-0'}} </span></td> {{channel?.msatoshi_total/1000 | number:channel?.msatoshi_to_us < 1000 ? '1.0-4' : '1.0-0'}} </span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="spendable_msatoshi"> <ng-container matColumnDef="spendable_msatoshi">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before" class="pl-1"> Spendable (Sats) </th> <th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before"> Spendable (Sats) </th>
<td mat-cell *matCellDef="let channel" class="pl-1"><span fxLayoutAlign="end center"> <td mat-cell *matCellDef="let channel"><span fxLayoutAlign="end center">
{{channel?.spendable_msatoshi/1000 | number:channel?.msatoshi_to_us < 1000 ? '1.0-4' : '1.0-0'}} </span></td> {{channel?.spendable_msatoshi/1000 | number:channel?.msatoshi_to_us < 1000 ? '1.0-4' : '1.0-0'}} </span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="msatoshi_to_us"> <ng-container matColumnDef="msatoshi_to_us">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before" class="pl-1"> Local Balance (Sats) </th> <th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before"> Local Balance (Sats) </th>
<td mat-cell *matCellDef="let channel" class="pl-1"><span fxLayoutAlign="end center"> <td mat-cell *matCellDef="let channel"><span fxLayoutAlign="end center">
{{channel?.msatoshi_to_us/1000 | number:channel?.msatoshi_to_us < 1000 ? '1.0-4' : '1.0-0'}} </span></td> {{channel?.msatoshi_to_us/1000 | number:channel?.msatoshi_to_us < 1000 ? '1.0-4' : '1.0-0'}} </span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="msatoshi_to_them"> <ng-container matColumnDef="msatoshi_to_them">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before" class="pl-1"> Remote Balance (Sats) </th> <th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before"> Remote Balance (Sats) </th>
<td mat-cell *matCellDef="let channel" class="pl-1"><span fxLayoutAlign="end center"> <td mat-cell *matCellDef="let channel"><span fxLayoutAlign="end center">
{{channel?.msatoshi_to_them/1000 | number:channel?.msatoshi_to_them < 1000 ? '1.0-4' : '1.0-0'}} </span></td> {{channel?.msatoshi_to_them/1000 | number:channel?.msatoshi_to_them < 1000 ? '1.0-4' : '1.0-0'}} </span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="actions"> <ng-container matColumnDef="actions">
<th mat-header-cell *matHeaderCellDef class="px-2"> <th mat-header-cell *matHeaderCellDef>
<div 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 placeholder="Actions" tabindex="1" class="mr-0">
<mat-select-trigger></mat-select-trigger> <mat-select-trigger></mat-select-trigger>
@ -94,7 +94,7 @@
</mat-select> </mat-select>
</div> </div>
</th> </th>
<td mat-cell *matCellDef="let channel" fxLayoutAlign="end center" class="px-2"> <td mat-cell *matCellDef="let channel" fxLayoutAlign="end center">
<div class="bordered-box table-actions-select" fxLayoutAlign="center center"> <div class="bordered-box table-actions-select" fxLayoutAlign="center center">
<mat-select placeholder="Actions" tabindex="4" class="mr-0"> <mat-select placeholder="Actions" tabindex="4" class="mr-0">
<mat-select-trigger></mat-select-trigger> <mat-select-trigger></mat-select-trigger>

12
src/app/cln/peers-channels/peers/peers.component.html
View File

@ -33,23 +33,23 @@
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="id"> <ng-container matColumnDef="id">
<th mat-header-cell *matHeaderCellDef class="pl-2" mat-sort-header> ID </th> <th mat-header-cell *matHeaderCellDef mat-sort-header> ID </th>
<td mat-cell *matCellDef="let peer" class="pl-2"> <td mat-cell *matCellDef="let peer">
<div class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '12rem' : '40rem'}"> <div class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '12rem' : '40rem'}">
<span class="ellipsis-child">{{peer?.id}}</span> <span class="ellipsis-child">{{peer?.id}}</span>
</div> </div>
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="netaddr"> <ng-container matColumnDef="netaddr">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-2"> Network Address </th> <th mat-header-cell *matHeaderCellDef mat-sort-header> Network Address </th>
<td mat-cell *matCellDef="let peer" class="pl-2"> <td mat-cell *matCellDef="let peer">
<div class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '12rem' : '40rem'}"> <div class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '12rem' : '40rem'}">
<span class="ellipsis-child" *ngFor="let addr of peer?.netaddr; last as isLast">{{addr}}<span *ngIf="!isLast">,<br></span></span> <span class="ellipsis-child" *ngFor="let addr of peer?.netaddr; last as isLast">{{addr}}<span *ngIf="!isLast">,<br></span></span>
</div> </div>
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="actions"> <ng-container matColumnDef="actions">
<th mat-header-cell *matHeaderCellDef class="px-3"> <th mat-header-cell *matHeaderCellDef>
<div 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 placeholder="Actions" tabindex="1" class="mr-0">
<mat-select-trigger></mat-select-trigger> <mat-select-trigger></mat-select-trigger>
@ -57,7 +57,7 @@
</mat-select> </mat-select>
</div> </div>
</th> </th>
<td mat-cell *matCellDef="let peer" fxLayoutAlign="end center" class="px-3"> <td mat-cell *matCellDef="let peer" fxLayoutAlign="end center">
<div 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 placeholder="Actions" tabindex="1" class="mr-0">
<mat-select-trigger></mat-select-trigger> <mat-select-trigger></mat-select-trigger>

4
src/app/cln/routing/failed-transactions/failed-transactions.component.html
View File

@ -60,7 +60,7 @@
<td mat-cell *matCellDef="let fhEvent"><span fxLayoutAlign="end center">{{fhEvent?.fee | number:'1.0-0'}}</span></td> <td mat-cell *matCellDef="let fhEvent"><span fxLayoutAlign="end center">{{fhEvent?.fee | number:'1.0-0'}}</span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="actions"> <ng-container matColumnDef="actions">
<th mat-header-cell *matHeaderCellDef class="px-3"> <th mat-header-cell *matHeaderCellDef>
<div 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 placeholder="Actions" tabindex="1" class="mr-0">
<mat-select-trigger></mat-select-trigger> <mat-select-trigger></mat-select-trigger>
@ -68,7 +68,7 @@
</mat-select> </mat-select>
</div> </div>
</th> </th>
<td mat-cell *matCellDef="let fhEvent" class="px-3" fxLayoutAlign="end center"> <td mat-cell *matCellDef="let fhEvent" fxLayoutAlign="end center">
<button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onFailedEventClick(fhEvent)" class="table-actions-button">View Info</button> <button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onFailedEventClick(fhEvent)" class="table-actions-button">View Info</button>
</td> </td>
</ng-container> </ng-container>

40
src/app/cln/routing/forwarding-history/forwarding-history.component.html
View File

@ -14,55 +14,55 @@
<td mat-cell *matCellDef="let fhEvent">{{(fhEvent?.received_time * 1000) | date:'dd/MMM/y HH:mm'}}</td> <td mat-cell *matCellDef="let fhEvent">{{(fhEvent?.received_time * 1000) | date:'dd/MMM/y HH:mm'}}</td>
</ng-container> </ng-container>
<ng-container matColumnDef="resolved_time"> <ng-container matColumnDef="resolved_time">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1">Resolved Time</th> <th mat-header-cell *matHeaderCellDef mat-sort-header>Resolved Time</th>
<td mat-cell *matCellDef="let fhEvent" class="pl-1">{{(fhEvent?.resolved_time * 1000) | date:'dd/MMM/y HH:mm'}}</td> <td mat-cell *matCellDef="let fhEvent">{{(fhEvent?.resolved_time * 1000) | date:'dd/MMM/y HH:mm'}}</td>
</ng-container> </ng-container>
<ng-container matColumnDef="in_channel"> <ng-container matColumnDef="in_channel">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1">In Channel Id</th> <th mat-header-cell *matHeaderCellDef mat-sort-header>In Channel Id</th>
<td mat-cell *matCellDef="let fhEvent" class="pl-1">{{fhEvent?.in_channel}}</td> <td mat-cell *matCellDef="let fhEvent">{{fhEvent?.in_channel}}</td>
</ng-container> </ng-container>
<ng-container matColumnDef="in_channel_alias"> <ng-container matColumnDef="in_channel_alias">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1">In Channel</th> <th mat-header-cell *matHeaderCellDef mat-sort-header>In Channel</th>
<td mat-cell *matCellDef="let fhEvent" class="pl-1"> <td mat-cell *matCellDef="let fhEvent">
<div class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}"> <div class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}">
<span class="ellipsis-child">{{fhEvent?.in_channel_alias}}</span> <span class="ellipsis-child">{{fhEvent?.in_channel_alias}}</span>
</div> </div>
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="out_channel"> <ng-container matColumnDef="out_channel">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1">Out Channel Id</th> <th mat-header-cell *matHeaderCellDef mat-sort-header>Out Channel Id</th>
<td mat-cell *matCellDef="let fhEvent" class="pl-1">{{fhEvent?.out_channel}}</td> <td mat-cell *matCellDef="let fhEvent">{{fhEvent?.out_channel}}</td>
</ng-container> </ng-container>
<ng-container matColumnDef="out_channel_alias"> <ng-container matColumnDef="out_channel_alias">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1">Out Channel</th> <th mat-header-cell *matHeaderCellDef mat-sort-header>Out Channel</th>
<td mat-cell *matCellDef="let fhEvent" class="pl-1"> <td mat-cell *matCellDef="let fhEvent">
<div class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}"> <div class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}">
<span class="ellipsis-child">{{fhEvent?.out_channel_alias}}</span> <span class="ellipsis-child">{{fhEvent?.out_channel_alias}}</span>
</div> </div>
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="payment_hash"> <ng-container matColumnDef="payment_hash">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1">Payment Hash</th> <th mat-header-cell *matHeaderCellDef mat-sort-header>Payment Hash</th>
<td mat-cell *matCellDef="let fhEvent" class="pl-1"> <td mat-cell *matCellDef="let fhEvent">
<div class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}"> <div class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}">
<span class="ellipsis-child">{{fhEvent?.payment_hash}}</span> <span class="ellipsis-child">{{fhEvent?.payment_hash}}</span>
</div> </div>
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="in_msatoshi"> <ng-container matColumnDef="in_msatoshi">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before" class="pl-1">Amount In (Sats)</th> <th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Amount In (Sats)</th>
<td mat-cell *matCellDef="let fhEvent" class="pl-1"><span fxLayoutAlign="end center">{{fhEvent?.in_msatoshi/1000 | number:fhEvent?.in_msatoshi < 1000 ? '1.0-4' : '1.0-0'}}</span></td> <td mat-cell *matCellDef="let fhEvent"><span fxLayoutAlign="end center">{{fhEvent?.in_msatoshi/1000 | number:fhEvent?.in_msatoshi < 1000 ? '1.0-4' : '1.0-0'}}</span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="out_msatoshi"> <ng-container matColumnDef="out_msatoshi">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before" class="pl-1">Amount Out (Sats)</th> <th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Amount Out (Sats)</th>
<td mat-cell *matCellDef="let fhEvent" class="pl-1"><span fxLayoutAlign="end center">{{fhEvent?.out_msatoshi/1000 | number:fhEvent?.out_msatoshi < 1000 ? '1.0-4' : '1.0-0'}}</span></td> <td mat-cell *matCellDef="let fhEvent"><span fxLayoutAlign="end center">{{fhEvent?.out_msatoshi/1000 | number:fhEvent?.out_msatoshi < 1000 ? '1.0-4' : '1.0-0'}}</span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="fee"> <ng-container matColumnDef="fee">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before" class="pl-1">Fee (mSat)</th> <th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Fee (mSat)</th>
<td mat-cell *matCellDef="let fhEvent" class="pl-1"><span fxLayoutAlign="end center">{{fhEvent?.fee | number}}</span></td> <td mat-cell *matCellDef="let fhEvent"><span fxLayoutAlign="end center">{{fhEvent?.fee | number}}</span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="actions"> <ng-container matColumnDef="actions">
<th mat-header-cell *matHeaderCellDef class="pl-1 pr-3"> <th mat-header-cell *matHeaderCellDef>
<div 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 placeholder="Actions" tabindex="1" class="mr-0">
<mat-select-trigger></mat-select-trigger> <mat-select-trigger></mat-select-trigger>
@ -70,7 +70,7 @@
</mat-select> </mat-select>
</div> </div>
</th> </th>
<td mat-cell *matCellDef="let fhEvent" class="pl-1 pr-3" fxLayoutAlign="end center"> <td mat-cell *matCellDef="let fhEvent" fxLayoutAlign="end center">
<button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onForwardingEventClick(fhEvent,$event)" class="table-actions-button">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> </td>
</ng-container> </ng-container>

12
src/app/cln/routing/local-failed-transactions/local-failed-transactions.component.html
View File

@ -48,15 +48,15 @@
<td mat-cell *matCellDef="let fhEvent"><span fxLayoutAlign="end center">{{fhEvent?.in_msatoshi/1000 | number:fhEvent?.in_msatoshi < 1000 ? '1.0-4' : '1.0-0'}}</span></td> <td mat-cell *matCellDef="let fhEvent"><span fxLayoutAlign="end center">{{fhEvent?.in_msatoshi/1000 | number:fhEvent?.in_msatoshi < 1000 ? '1.0-4' : '1.0-0'}}</span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="style"> <ng-container matColumnDef="style">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1">Style</th> <th mat-header-cell *matHeaderCellDef mat-sort-header>Style</th>
<td mat-cell *matCellDef="let fhEvent" class="pl-1">{{fhEvent?.style}}</td> <td mat-cell *matCellDef="let fhEvent">{{fhEvent?.style}}</td>
</ng-container> </ng-container>
<ng-container matColumnDef="failreason"> <ng-container matColumnDef="failreason">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1">Fail Reason</th> <th mat-header-cell *matHeaderCellDef mat-sort-header>Fail Reason</th>
<td mat-cell *matCellDef="let fhEvent" class="pl-1">{{CLNFailReason[fhEvent?.failreason]}}</td> <td mat-cell *matCellDef="let fhEvent">{{CLNFailReason[fhEvent?.failreason]}}</td>
</ng-container> </ng-container>
<ng-container matColumnDef="actions"> <ng-container matColumnDef="actions">
<th mat-header-cell *matHeaderCellDef class="px-3"> <th mat-header-cell *matHeaderCellDef>
<div 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 placeholder="Actions" tabindex="1" class="mr-0">
<mat-select-trigger></mat-select-trigger> <mat-select-trigger></mat-select-trigger>
@ -64,7 +64,7 @@
</mat-select> </mat-select>
</div> </div>
</th> </th>
<td mat-cell *matCellDef="let fhEvent" class="px-3" fxLayoutAlign="end center"> <td mat-cell *matCellDef="let fhEvent" fxLayoutAlign="end center">
<button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onFailedLocalEventClick(fhEvent)" class="table-actions-button">View Info</button> <button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onFailedLocalEventClick(fhEvent)" class="table-actions-button">View Info</button>
</td> </td>
</ng-container> </ng-container>

2
src/app/cln/store/cln.reducers.ts
View File

@ -221,7 +221,7 @@ export const CLNReducer = createReducer(initCLNState,
on(setPageSettings, (state, { payload }) => { on(setPageSettings, (state, { payload }) => {
const newPageSettings: PageSettings[] = []; const newPageSettings: PageSettings[] = [];
CLN_DEFAULT_PAGE_SETTINGS.forEach((defaultPage) => { CLN_DEFAULT_PAGE_SETTINGS.forEach((defaultPage) => {
const pageSetting = payload.find((p) => p.pageId === defaultPage.pageId) || null; const pageSetting = payload && Object.keys(payload).length > 0 ? payload.find((p) => p.pageId === defaultPage.pageId) : null;
if (pageSetting) { if (pageSetting) {
const tablesSettings = JSON.parse(JSON.stringify(pageSetting.tables)); const tablesSettings = JSON.parse(JSON.stringify(pageSetting.tables));
pageSetting.tables = []; // To maintain settings order pageSetting.tables = []; // To maintain settings order

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

@ -93,7 +93,7 @@
<td mat-cell *matCellDef="let invoice"><span fxLayoutAlign="end center"> {{invoice?.msatoshi_received/1000 | number:invoice?.msatoshi_received < 1000 ? '1.0-4' : '1.0-0'}}</span></td> <td mat-cell *matCellDef="let invoice"><span fxLayoutAlign="end center"> {{invoice?.msatoshi_received/1000 | number:invoice?.msatoshi_received < 1000 ? '1.0-4' : '1.0-0'}}</span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="actions"> <ng-container matColumnDef="actions">
<th mat-header-cell *matHeaderCellDef class="px-3"> <th mat-header-cell *matHeaderCellDef>
<div 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 placeholder="Actions" tabindex="1" class="mr-0">
<mat-select-trigger></mat-select-trigger> <mat-select-trigger></mat-select-trigger>
@ -101,7 +101,7 @@
</mat-select> </mat-select>
</div> </div>
</th> </th>
<td mat-cell *matCellDef="let invoice" [ngClass]="{'px-3': screenSize !== screenSizeEnum.XS}" fxLayoutAlign="end center"> <td mat-cell *matCellDef="let invoice" fxLayoutAlign="end center">
<div class="bordered-box table-actions-select" fxLayoutAlign="center center"> <div class="bordered-box table-actions-select" fxLayoutAlign="center center">
<mat-select placeholder="Actions" tabindex="4" class="mr-0"> <mat-select placeholder="Actions" tabindex="4" class="mr-0">
<mat-select-trigger></mat-select-trigger> <mat-select-trigger></mat-select-trigger>

12
src/app/cln/transactions/offers/offer-bookmarks-table/offer-bookmarks-table.component.html
View File

@ -26,8 +26,8 @@
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="amountMSat"> <ng-container matColumnDef="amountMSat">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before" class="pr-2"> Amount (Sats) </th> <th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before"> Amount (Sats) </th>
<td mat-cell *matCellDef="let offersbookmark" class="pr-2"><span fxLayoutAlign="end center">{{(offersbookmark.amountMSat === 0) ? 'Open' : (offersbookmark.amountMSat / 1000) | number}}</span></td> <td mat-cell *matCellDef="let offersbookmark"><span fxLayoutAlign="end center">{{(offersbookmark.amountMSat === 0) ? 'Open' : (offersbookmark.amountMSat / 1000) | number}}</span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="description"> <ng-container matColumnDef="description">
<th mat-header-cell *matHeaderCellDef mat-sort-header> Description </th> <th mat-header-cell *matHeaderCellDef mat-sort-header> Description </th>
@ -42,15 +42,15 @@
<td mat-cell *matCellDef="let offersbookmark">{{offersbookmark.vendor}}</td> <td mat-cell *matCellDef="let offersbookmark">{{offersbookmark.vendor}}</td>
</ng-container> </ng-container>
<ng-container matColumnDef="bolt12"> <ng-container matColumnDef="bolt12">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> Invoice </th> <th mat-header-cell *matHeaderCellDef mat-sort-header> Invoice </th>
<td mat-cell *matCellDef="let offersbookmark" class="pl-1"> <td mat-cell *matCellDef="let offersbookmark">
<div class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '20rem' : '30rem'}"> <div class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '20rem' : '30rem'}">
<span class="ellipsis-child">{{offersbookmark.bolt12}}</span> <span class="ellipsis-child">{{offersbookmark.bolt12}}</span>
</div> </div>
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="actions"> <ng-container matColumnDef="actions">
<th mat-header-cell *matHeaderCellDef class="pr-3"> <th mat-header-cell *matHeaderCellDef>
<div 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 placeholder="Actions" tabindex="1" class="mr-0">
<mat-select-trigger></mat-select-trigger> <mat-select-trigger></mat-select-trigger>
@ -58,7 +58,7 @@
</mat-select> </mat-select>
</div> </div>
</th> </th>
<td mat-cell *matCellDef="let offer" [ngClass]="{'pr-3': screenSize !== screenSizeEnum.XS}" fxLayoutAlign="end center"> <td mat-cell *matCellDef="let offer" fxLayoutAlign="end center">
<div class="bordered-box table-actions-select" fxLayoutAlign="center center"> <div class="bordered-box table-actions-select" fxLayoutAlign="center center">
<mat-select placeholder="Actions" tabindex="4" class="mr-0"> <mat-select placeholder="Actions" tabindex="4" class="mr-0">
<mat-select-trigger></mat-select-trigger> <mat-select-trigger></mat-select-trigger>

4
src/app/cln/transactions/offers/offer-bookmarks-table/offer-bookmarks-table.component.ts
View File

@ -80,7 +80,7 @@ export class CLNOfferBookmarksTableComponent implements OnInit, AfterViewInit, O
this.errorMessage = !this.apiCallStatus.message ? '' : (typeof (this.apiCallStatus.message) === 'object') ? JSON.stringify(this.apiCallStatus.message) : this.apiCallStatus.message; this.errorMessage = !this.apiCallStatus.message ? '' : (typeof (this.apiCallStatus.message) === 'object') ? JSON.stringify(this.apiCallStatus.message) : this.apiCallStatus.message;
} }
this.offersBookmarksJSONArr = offerBMsSeletor.offersBookmarks || []; this.offersBookmarksJSONArr = offerBMsSeletor.offersBookmarks || [];
if (this.offersBookmarksJSONArr && this.offersBookmarksJSONArr.length > 0 && this.sort && this.paginator && this.displayedColumns.length > 0) { if (this.offersBookmarksJSONArr && this.offersBookmarksJSONArr.length > 0 && this.sort && this.paginator && this.displayedColumns.length > 0) {
this.loadOffersTable(this.offersBookmarksJSONArr); this.loadOffersTable(this.offersBookmarksJSONArr);
} }
this.logger.info(offerBMsSeletor); this.logger.info(offerBMsSeletor);
@ -88,7 +88,7 @@ export class CLNOfferBookmarksTableComponent implements OnInit, AfterViewInit, O
} }
ngAfterViewInit() { ngAfterViewInit() {
if (this.offersBookmarksJSONArr && this.offersBookmarksJSONArr.length > 0 && this.sort && this.paginator && this.displayedColumns.length > 0) { if (this.offersBookmarksJSONArr && this.offersBookmarksJSONArr.length > 0 && this.sort && this.paginator && this.displayedColumns.length > 0) {
this.loadOffersTable(this.offersBookmarksJSONArr); this.loadOffersTable(this.offersBookmarksJSONArr);
} }
} }

4
src/app/cln/transactions/offers/offers-table/offers-table.component.html
View File

@ -53,7 +53,7 @@
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="actions"> <ng-container matColumnDef="actions">
<th mat-header-cell *matHeaderCellDef class="px-3"> <th mat-header-cell *matHeaderCellDef>
<div 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 placeholder="Actions" tabindex="1" class="mr-0">
<mat-select-trigger></mat-select-trigger> <mat-select-trigger></mat-select-trigger>
@ -61,7 +61,7 @@
</mat-select> </mat-select>
</div> </div>
</th> </th>
<td mat-cell *matCellDef="let offer" [ngClass]="{'px-3': screenSize !== screenSizeEnum.XS}" fxLayoutAlign="end center"> <td mat-cell *matCellDef="let offer" fxLayoutAlign="end center">
<div class="bordered-box table-actions-select" fxLayoutAlign="center center"> <div class="bordered-box table-actions-select" fxLayoutAlign="center center">
<mat-select placeholder="Actions" tabindex="4" class="mr-0"> <mat-select placeholder="Actions" tabindex="4" class="mr-0">
<mat-select-trigger></mat-select-trigger> <mat-select-trigger></mat-select-trigger>

4
src/app/cln/transactions/offers/offers-table/offers-table.component.ts
View File

@ -105,7 +105,7 @@ export class CLNOffersTableComponent implements OnInit, AfterViewInit, OnDestroy
this.errorMessage = !this.apiCallStatus.message ? '' : (typeof (this.apiCallStatus.message) === 'object') ? JSON.stringify(this.apiCallStatus.message) : this.apiCallStatus.message; this.errorMessage = !this.apiCallStatus.message ? '' : (typeof (this.apiCallStatus.message) === 'object') ? JSON.stringify(this.apiCallStatus.message) : this.apiCallStatus.message;
} }
this.offerJSONArr = offersSeletor.offers || []; this.offerJSONArr = offersSeletor.offers || [];
if (this.offerJSONArr && this.offerJSONArr.length > 0 && this.sort && this.paginator && this.displayedColumns.length > 0) { if (this.offerJSONArr && this.offerJSONArr.length > 0 && this.sort && this.paginator && this.displayedColumns.length > 0) {
this.loadOffersTable(this.offerJSONArr); this.loadOffersTable(this.offerJSONArr);
} }
this.logger.info(offersSeletor); this.logger.info(offersSeletor);
@ -113,7 +113,7 @@ export class CLNOffersTableComponent implements OnInit, AfterViewInit, OnDestroy
} }
ngAfterViewInit() { ngAfterViewInit() {
if (this.offerJSONArr && this.offerJSONArr.length > 0 && this.sort && this.paginator && this.displayedColumns.length > 0) { if (this.offerJSONArr && this.offerJSONArr.length > 0 && this.sort && this.paginator && this.displayedColumns.length > 0) {
this.loadOffersTable(this.offerJSONArr); this.loadOffersTable(this.offerJSONArr);
} }
} }

22
src/app/cln/transactions/payments/lightning-payments.component.html
View File

@ -85,15 +85,15 @@
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="msatoshi_sent"> <ng-container matColumnDef="msatoshi_sent">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before" class="px-1">Sats Sent</th> <th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Sats Sent</th>
<td mat-cell *matCellDef="let payment" class="px-1"><span fxLayoutAlign="end center">{{payment?.msatoshi_sent/1000 | number:payment?.msatoshi_sent < 1000 ? '1.0-4' : '1.0-0'}}</span></td> <td mat-cell *matCellDef="let payment"><span fxLayoutAlign="end center">{{payment?.msatoshi_sent/1000 | number:payment?.msatoshi_sent < 1000 ? '1.0-4' : '1.0-0'}}</span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="msatoshi"> <ng-container matColumnDef="msatoshi">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before" class="px-1">Sats Received</th> <th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Sats Received</th>
<td mat-cell *matCellDef="let payment" class="px-1"><span fxLayoutAlign="end center">{{payment?.msatoshi/1000 | number:payment?.msatoshi < 1000 ? '1.0-4' : '1.0-0'}}</span></td> <td mat-cell *matCellDef="let payment"><span fxLayoutAlign="end center">{{payment?.msatoshi/1000 | number:payment?.msatoshi < 1000 ? '1.0-4' : '1.0-0'}}</span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="actions"> <ng-container matColumnDef="actions">
<th mat-header-cell *matHeaderCellDef class="pr-3"> <th mat-header-cell *matHeaderCellDef>
<div 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 placeholder="Actions" tabindex="1" class="mr-0">
<mat-select-trigger></mat-select-trigger> <mat-select-trigger></mat-select-trigger>
@ -101,7 +101,7 @@
</mat-select> </mat-select>
</div> </div>
</th> </th>
<td mat-cell *matCellDef="let payment" class="pr-3" fxLayoutAlign="end center"> <td mat-cell *matCellDef="let payment" fxLayoutAlign="end center">
<button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onPaymentClick(payment)" class="table-actions-button">View Info</button> <button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onPaymentClick(payment)" class="table-actions-button">View Info</button>
</td> </td>
</ng-container> </ng-container>
@ -121,7 +121,7 @@
<span *ngIf="payment.status !== 'complete'" class="dot yellow" matTooltip="Incomplete/Failed" matTooltipPosition="right"></span> <span *ngIf="payment.status !== 'complete'" class="dot yellow" matTooltip="Incomplete/Failed" matTooltipPosition="right"></span>
</span> </span>
<ng-container *ngIf="payment.is_expanded"> <ng-container *ngIf="payment.is_expanded">
<span *ngFor="let mpp of payment?.mpps" fxLayoutAlign="start center" class="mpp-row-span pl-3"> <span *ngFor="let mpp of payment?.mpps" fxLayoutAlign="start center" class="mpp-row-span">
<span *ngIf="mpp.status === 'complete'" class="dot green" matTooltip="Completed" matTooltipPosition="right"></span> <span *ngIf="mpp.status === 'complete'" class="dot green" matTooltip="Completed" matTooltipPosition="right"></span>
<span *ngIf="mpp.status !== 'complete'" class="dot yellow" matTooltip="Incomplete/Failed" matTooltipPosition="right"></span> <span *ngIf="mpp.status !== 'complete'" class="dot yellow" matTooltip="Incomplete/Failed" matTooltipPosition="right"></span>
</span> </span>
@ -134,7 +134,7 @@
Total Attempts: {{payment?.total_parts}} Total Attempts: {{payment?.total_parts}}
</span> </span>
<ng-container *ngIf="payment.is_expanded"> <ng-container *ngIf="payment.is_expanded">
<span *ngFor="let mpp of payment?.mpps" fxLayoutAlign="start center" class="mpp-row-span pl-3"> <span *ngFor="let mpp of payment?.mpps" fxLayoutAlign="start center" class="mpp-row-span">
{{(mpp.created_at * 1000) | date:'dd/MMM/y HH:mm'}} {{(mpp.created_at * 1000) | date:'dd/MMM/y HH:mm'}}
</span> </span>
</ng-container> </ng-container>
@ -207,7 +207,7 @@
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="group_msatoshi_sent"> <ng-container matColumnDef="group_msatoshi_sent">
<td mat-cell *matCellDef="let payment" class="px-1"> <td mat-cell *matCellDef="let payment">
<span fxLayoutAlign="end center" class="mpp-row-span">{{payment?.msatoshi_sent/1000 | number:payment?.msatoshi_sent < 1000 ? '1.0-4' : '1.0-0'}}</span> <span fxLayoutAlign="end center" class="mpp-row-span">{{payment?.msatoshi_sent/1000 | number:payment?.msatoshi_sent < 1000 ? '1.0-4' : '1.0-0'}}</span>
<span *ngIf="payment.is_expanded"> <span *ngIf="payment.is_expanded">
<span *ngFor="let mpp of payment?.mpps" fxLayoutAlign="end center" class="mpp-row-span"> <span *ngFor="let mpp of payment?.mpps" fxLayoutAlign="end center" class="mpp-row-span">
@ -217,7 +217,7 @@
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="group_msatoshi"> <ng-container matColumnDef="group_msatoshi">
<td mat-cell *matCellDef="let payment" class="px-1"> <td mat-cell *matCellDef="let payment">
<span fxLayoutAlign="end center" class="mpp-row-span">{{payment?.msatoshi/1000 | number:payment?.msatoshi < 1000 ? '1.0-4' : '1.0-0'}}</span> <span fxLayoutAlign="end center" class="mpp-row-span">{{payment?.msatoshi/1000 | number:payment?.msatoshi < 1000 ? '1.0-4' : '1.0-0'}}</span>
<span *ngIf="payment.is_expanded"> <span *ngIf="payment.is_expanded">
<span *ngFor="let mpp of payment?.mpps" fxLayoutAlign="end center" class="mpp-row-span"> <span *ngFor="let mpp of payment?.mpps" fxLayoutAlign="end center" class="mpp-row-span">
@ -227,7 +227,7 @@
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="group_actions"> <ng-container matColumnDef="group_actions">
<td mat-cell *matCellDef="let payment" class="pr-3"> <td mat-cell *matCellDef="let payment">
<span fxLayoutAlign="end center"> <span fxLayoutAlign="end center">
<button mat-flat-button class="btn-mpp-expand" color="primary" type="button" tabindex="5" (click)="payment.is_expanded = !payment.is_expanded">{{payment.is_expanded ? 'Hide' : 'Show'}}</button> <button mat-flat-button class="btn-mpp-expand" color="primary" type="button" tabindex="5" (click)="payment.is_expanded = !payment.is_expanded">{{payment.is_expanded ? 'Hide' : 'Show'}}</button>
</span> </span>

3
src/app/cln/transactions/payments/lightning-payments.component.scss
View File

@ -34,6 +34,9 @@
min-height: 4.2rem; min-height: 4.2rem;
place-content: center flex-start; place-content: center flex-start;
align-items: center; align-items: center;
&:not(:first-of-type) {
padding-left: 3rem;
}
&.ellipsis-parent { &.ellipsis-parent {
display: flex; display: flex;
} }

4
src/app/eclair/graph/lookups/lookups.component.scss
View File

@ -8,7 +8,3 @@
margin-bottom: 0; margin-bottom: 0;
list-style-type: none; list-style-type: none;
} }
.pl-3 {
padding-left: 3rem;
}

4
src/app/eclair/graph/lookups/node-lookup/node-lookup.component.html
View File

@ -38,10 +38,10 @@
<td mat-cell *matCellDef="let address"> {{address}} </td> <td mat-cell *matCellDef="let address"> {{address}} </td>
</ng-container> </ng-container>
<ng-container matColumnDef="actions"> <ng-container matColumnDef="actions">
<th mat-header-cell *matHeaderCellDef class="pl-1"> <th mat-header-cell *matHeaderCellDef>
<div class="bordered-box table-actions-select btn-action" fxLayoutAlign="center center">Actions</div> <div class="bordered-box table-actions-select btn-action" fxLayoutAlign="center center">Actions</div>
</th> </th>
<td mat-cell *matCellDef="let address" class="pl-1"> <td mat-cell *matCellDef="let address">
<span fxLayoutAlign="end center"> <span fxLayoutAlign="end center">
<button mat-stroked-button class="btn-action-copy" color="primary" type="button" tabindex="1" rtlClipboard [payload]="lookupResult?.nodeId + '@' + address" (copied)="onCopyNodeURI($event)">Copy Node URI</button> <button mat-stroked-button class="btn-action-copy" color="primary" type="button" tabindex="1" rtlClipboard [payload]="lookupResult?.nodeId + '@' + address" (copied)="onCopyNodeURI($event)">Copy Node URI</button>
</span> </span>

4
src/app/eclair/graph/query-routes/query-routes.component.html
View File

@ -50,10 +50,10 @@
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="actions"> <ng-container matColumnDef="actions">
<th mat-header-cell *matHeaderCellDef class="pl-4 pr-3"> <th mat-header-cell *matHeaderCellDef>
<div class="bordered-box table-actions-select" fxLayoutAlign="center center">Actions</div> <div class="bordered-box table-actions-select" fxLayoutAlign="center center">Actions</div>
</th> </th>
<td mat-cell *matCellDef="let hop" class="pl-4 pr-3" fxLayoutAlign="end center"> <td mat-cell *matCellDef="let hop" fxLayoutAlign="end center">
<button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onHopClick(hop)" class="table-actions-button">View Info</button> <button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onHopClick(hop)" class="table-actions-button">View Info</button>
</td> </td>
</ng-container> </ng-container>

8
src/app/eclair/on-chain/on-chain-transaction-history/on-chain-transaction-history.component.html
View File

@ -29,8 +29,8 @@
<td mat-cell *matCellDef="let transaction"><span fxLayoutAlign="end center">{{transaction?.fees | number}}</span></td> <td mat-cell *matCellDef="let transaction"><span fxLayoutAlign="end center">{{transaction?.fees | number}}</span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="confirmations"> <ng-container matColumnDef="confirmations">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before" class="pr-2"> Confirmations </th> <th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before"> Confirmations </th>
<td mat-cell *matCellDef="let transaction" class="pr-2"><span fxLayoutAlign="end center"> <td mat-cell *matCellDef="let transaction"><span fxLayoutAlign="end center">
{{transaction?.confirmations | number}} </span></td> {{transaction?.confirmations | number}} </span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="address"> <ng-container matColumnDef="address">
@ -58,7 +58,7 @@
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="actions"> <ng-container matColumnDef="actions">
<th mat-header-cell *matHeaderCellDef class="px-3"> <th mat-header-cell *matHeaderCellDef>
<div 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 placeholder="Actions" tabindex="1" class="mr-0">
<mat-select-trigger></mat-select-trigger> <mat-select-trigger></mat-select-trigger>
@ -66,7 +66,7 @@
</mat-select> </mat-select>
</div> </div>
</th> </th>
<td mat-cell *matCellDef="let transaction" class="pl-3" fxLayoutAlign="end center"> <td mat-cell *matCellDef="let transaction" fxLayoutAlign="end center">
<button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onTransactionClick(transaction, $event)" class="table-actions-button">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> </td>
</ng-container> </ng-container>

8
src/app/eclair/peers-channels/channels/channels-tables/channel-inactive-table/channel-inactive-table.component.html
View File

@ -71,8 +71,8 @@
{{channel?.feeRatePerKw | number:'1.0-0'}} </span></td> {{channel?.feeRatePerKw | number:'1.0-0'}} </span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="balancedness"> <ng-container matColumnDef="balancedness">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-3">Balance Score </th> <th mat-header-cell *matHeaderCellDef mat-sort-header>Balance Score </th>
<td mat-cell *matCellDef="let channel" class="pl-3"> <td mat-cell *matCellDef="let channel">
<div fxLayout="row"> <div fxLayout="row">
<mat-hint fxFlex="100" fxLayoutAlign="center center" class="font-size-80">{{channel?.balancedness || 0 | number}}</mat-hint> <mat-hint fxFlex="100" fxLayoutAlign="center center" class="font-size-80">{{channel?.balancedness || 0 | number}}</mat-hint>
</div> </div>
@ -80,7 +80,7 @@
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="actions"> <ng-container matColumnDef="actions">
<th mat-header-cell *matHeaderCellDef class="pl-1"> <th mat-header-cell *matHeaderCellDef>
<div 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 placeholder="Actions" tabindex="1" class="mr-0">
<mat-select-trigger></mat-select-trigger> <mat-select-trigger></mat-select-trigger>
@ -88,7 +88,7 @@
</mat-select> </mat-select>
</div> </div>
</th> </th>
<td mat-cell *matCellDef="let channel" class="pl-1" fxLayoutAlign="end center"> <td mat-cell *matCellDef="let channel" fxLayoutAlign="end center">
<div class="bordered-box table-actions-select" fxLayoutAlign="center center"> <div class="bordered-box table-actions-select" fxLayoutAlign="center center">
<mat-select placeholder="Actions" tabindex="2" class="mr-0"> <mat-select placeholder="Actions" tabindex="2" class="mr-0">
<mat-select-trigger></mat-select-trigger> <mat-select-trigger></mat-select-trigger>

8
src/app/eclair/peers-channels/channels/channels-tables/channel-open-table/channel-open-table.component.html
View File

@ -77,8 +77,8 @@
{{channel?.feeRatePerKw | number:'1.0-0'}} </span></td> {{channel?.feeRatePerKw | number:'1.0-0'}} </span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="balancedness"> <ng-container matColumnDef="balancedness">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-3">Balance Score </th> <th mat-header-cell *matHeaderCellDef mat-sort-header>Balance Score </th>
<td mat-cell *matCellDef="let channel" class="pl-3"> <td mat-cell *matCellDef="let channel">
<div fxLayout="row"> <div fxLayout="row">
<mat-hint fxFlex="100" fxLayoutAlign="center center" class="font-size-80">{{channel?.balancedness || 0 | number}}</mat-hint> <mat-hint fxFlex="100" fxLayoutAlign="center center" class="font-size-80">{{channel?.balancedness || 0 | number}}</mat-hint>
</div> </div>
@ -86,7 +86,7 @@
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="actions"> <ng-container matColumnDef="actions">
<th mat-header-cell *matHeaderCellDef class="pl-1"> <th mat-header-cell *matHeaderCellDef>
<div 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 placeholder="Actions" tabindex="1" class="mr-0">
<mat-select-trigger></mat-select-trigger> <mat-select-trigger></mat-select-trigger>
@ -95,7 +95,7 @@
</mat-select> </mat-select>
</div> </div>
</th> </th>
<td mat-cell *matCellDef="let channel" fxLayoutAlign="end center" class="pl-1"> <td mat-cell *matCellDef="let channel" fxLayoutAlign="end center">
<div class="bordered-box table-actions-select" fxLayoutAlign="center center"> <div class="bordered-box table-actions-select" fxLayoutAlign="center center">
<mat-select placeholder="Actions" tabindex="2" class="mr-0"> <mat-select placeholder="Actions" tabindex="2" class="mr-0">
<mat-select-trigger></mat-select-trigger> <mat-select-trigger></mat-select-trigger>

4
src/app/eclair/peers-channels/channels/channels-tables/channel-pending-table/channel-pending-table.component.html
View File

@ -63,7 +63,7 @@
{{channel?.feeRatePerKw | number:'1.0-0'}} </span></td> {{channel?.feeRatePerKw | number:'1.0-0'}} </span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="actions"> <ng-container matColumnDef="actions">
<th mat-header-cell *matHeaderCellDef class="pl-1"> <th mat-header-cell *matHeaderCellDef>
<div 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 placeholder="Actions" tabindex="1" class="mr-0">
<mat-select-trigger></mat-select-trigger> <mat-select-trigger></mat-select-trigger>
@ -71,7 +71,7 @@
</mat-select> </mat-select>
</div> </div>
</th> </th>
<td mat-cell *matCellDef="let channel" class="pl-1" fxLayoutAlign="end center"> <td mat-cell *matCellDef="let channel" fxLayoutAlign="end center">
<button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onChannelClick(channel, $event)" class="table-actions-button">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> </td>
</ng-container> </ng-container>

20
src/app/eclair/peers-channels/peers/peers.component.html
View File

@ -25,33 +25,33 @@
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="alias"> <ng-container matColumnDef="alias">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> Alias </th> <th mat-header-cell *matHeaderCellDef mat-sort-header> Alias </th>
<td mat-cell *matCellDef="let peer" class="pl-1"> <td mat-cell *matCellDef="let peer">
<div class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '25rem'}"> <div class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '25rem'}">
<span class="ellipsis-child">{{peer?.alias}}</span> <span class="ellipsis-child">{{peer?.alias}}</span>
</div> </div>
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="nodeId"> <ng-container matColumnDef="nodeId">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> ID </th> <th mat-header-cell *matHeaderCellDef mat-sort-header> ID </th>
<td mat-cell *matCellDef="let peer" class="pl-1"> <td mat-cell *matCellDef="let peer">
<div class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '25rem'}"> <div class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '25rem'}">
<span class="ellipsis-child">{{peer?.nodeId}}</span> <span class="ellipsis-child">{{peer?.nodeId}}</span>
</div> </div>
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="address"> <ng-container matColumnDef="address">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> Network Address </th> <th mat-header-cell *matHeaderCellDef mat-sort-header> Network Address </th>
<td mat-cell *matCellDef="let peer" class="pl-1"> <td mat-cell *matCellDef="let peer">
{{peer?.address}} {{peer?.address}}
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="channels"> <ng-container matColumnDef="channels">
<th mat-header-cell class="pl-1" *matHeaderCellDef mat-sort-header> Channels </th> <th mat-header-cell *matHeaderCellDef mat-sort-header> Channels </th>
<td mat-cell class="pl-1" *matCellDef="let peer"> {{peer?.channels}} </td> <td mat-cell *matCellDef="let peer"> {{peer?.channels}} </td>
</ng-container> </ng-container>
<ng-container matColumnDef="actions"> <ng-container matColumnDef="actions">
<th mat-header-cell *matHeaderCellDef class="px-1"> <th mat-header-cell *matHeaderCellDef>
<div 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 placeholder="Actions" tabindex="1" class="mr-0">
<mat-select-trigger></mat-select-trigger> <mat-select-trigger></mat-select-trigger>
@ -59,7 +59,7 @@
</mat-select> </mat-select>
</div> </div>
</th> </th>
<td mat-cell *matCellDef="let peer" fxLayoutAlign="end center" class="px-1"> <td mat-cell *matCellDef="let peer" fxLayoutAlign="end center">
<div 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 placeholder="Actions" tabindex="1" class="mr-0">
<mat-select-trigger></mat-select-trigger> <mat-select-trigger></mat-select-trigger>

24
src/app/eclair/routing/forwarding-history/forwarding-history.component.html
View File

@ -26,8 +26,8 @@
<td mat-cell *matCellDef="let fhEvent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}">{{fhEvent?.fromChannelId}}</td> <td mat-cell *matCellDef="let fhEvent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}">{{fhEvent?.fromChannelId}}</td>
</ng-container> </ng-container>
<ng-container matColumnDef="fromShortChannelId"> <ng-container matColumnDef="fromShortChannelId">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1">In Channel Short Id</th> <th mat-header-cell *matHeaderCellDef mat-sort-header>In Channel Short Id</th>
<td mat-cell *matCellDef="let fhEvent" class="pl-1">{{fhEvent?.fromShortChannelId}}</td> <td mat-cell *matCellDef="let fhEvent">{{fhEvent?.fromShortChannelId}}</td>
</ng-container> </ng-container>
<ng-container matColumnDef="fromChannelAlias"> <ng-container matColumnDef="fromChannelAlias">
<th mat-header-cell *matHeaderCellDef mat-sort-header>In Channel</th> <th mat-header-cell *matHeaderCellDef mat-sort-header>In Channel</th>
@ -38,31 +38,31 @@
<td mat-cell *matCellDef="let fhEvent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}">{{fhEvent?.toChannelId}}</td> <td mat-cell *matCellDef="let fhEvent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}">{{fhEvent?.toChannelId}}</td>
</ng-container> </ng-container>
<ng-container matColumnDef="toShortChannelId"> <ng-container matColumnDef="toShortChannelId">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1">Out Channel Short Id</th> <th mat-header-cell *matHeaderCellDef mat-sort-header>Out Channel Short Id</th>
<td mat-cell *matCellDef="let fhEvent" class="pl-1">{{fhEvent?.toShortChannelId}}</td> <td mat-cell *matCellDef="let fhEvent">{{fhEvent?.toShortChannelId}}</td>
</ng-container> </ng-container>
<ng-container matColumnDef="toChannelAlias"> <ng-container matColumnDef="toChannelAlias">
<th mat-header-cell *matHeaderCellDef mat-sort-header>Out Channel</th> <th mat-header-cell *matHeaderCellDef mat-sort-header>Out Channel</th>
<td mat-cell *matCellDef="let fhEvent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}">{{fhEvent?.toChannelAlias}}</td> <td mat-cell *matCellDef="let fhEvent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}">{{fhEvent?.toChannelAlias}}</td>
</ng-container> </ng-container>
<ng-container matColumnDef="amountIn"> <ng-container matColumnDef="amountIn">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before" class="pl-1">Amount In (Sats)</th> <th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Amount In (Sats)</th>
<td mat-cell *matCellDef="let fhEvent" class="pl-1"><span fxLayoutAlign="end center">{{fhEvent?.amountIn | number}}</span></td> <td mat-cell *matCellDef="let fhEvent"><span fxLayoutAlign="end center">{{fhEvent?.amountIn | number}}</span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="amountOut"> <ng-container matColumnDef="amountOut">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before" class="pl-1">Amount Out (Sats)</th> <th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Amount Out (Sats)</th>
<td mat-cell *matCellDef="let fhEvent" class="pl-1"><span fxLayoutAlign="end center">{{fhEvent?.amountOut | number}}</span></td> <td mat-cell *matCellDef="let fhEvent"><span fxLayoutAlign="end center">{{fhEvent?.amountOut | number}}</span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="fee"> <ng-container matColumnDef="fee">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before" class="pl-1">Fee Earned (Sats)</th> <th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Fee Earned (Sats)</th>
<td mat-cell *matCellDef="let fhEvent" class="pl-1"><span fxLayoutAlign="end center">{{(fhEvent?.amountIn - fhEvent?.amountOut) | number}}</span></td> <td mat-cell *matCellDef="let fhEvent"><span fxLayoutAlign="end center">{{(fhEvent?.amountIn - fhEvent?.amountOut) | number}}</span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="paymentHash"> <ng-container matColumnDef="paymentHash">
<th mat-header-cell *matHeaderCellDef mat-sort-header>Payment Hash</th> <th mat-header-cell *matHeaderCellDef mat-sort-header>Payment Hash</th>
<td mat-cell *matCellDef="let fhEvent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}">{{fhEvent?.paymentHash}}</td> <td mat-cell *matCellDef="let fhEvent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}">{{fhEvent?.paymentHash}}</td>
</ng-container> </ng-container>
<ng-container matColumnDef="actions"> <ng-container matColumnDef="actions">
<th mat-header-cell *matHeaderCellDef class="pl-2"> <th mat-header-cell *matHeaderCellDef>
<div 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 placeholder="Actions" tabindex="1" class="mr-0">
<mat-select-trigger></mat-select-trigger> <mat-select-trigger></mat-select-trigger>
@ -70,7 +70,7 @@
</mat-select> </mat-select>
</div> </div>
</th> </th>
<td mat-cell *matCellDef="let fhEvent" class="pl-3" fxLayoutAlign="end center"> <td mat-cell *matCellDef="let fhEvent" fxLayoutAlign="end center">
<button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onForwardingEventClick(fhEvent,$event)" class="table-actions-button">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> </td>
</ng-container> </ng-container>

6
src/app/eclair/routing/forwarding-history/forwarding-history.component.scss
View File

@ -7,10 +7,10 @@
} }
} }
.mat-column-fromChannelId, .mat-column-fromAlias, .mat-column-toChannelId, .mat-column-toAlias, .mat-column-paymentHash { .mat-column-fromChannelId, .mat-column-fromChannelAlias, .mat-column-toChannelId, .mat-column-toChannelAlias, .mat-column-paymentHash {
padding-left: 1rem; padding-left: 1rem;
flex: 1 1 15%; flex: 0 0 25%;
width: 15%; width: 25%;
white-space: nowrap; white-space: nowrap;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;

2
src/app/eclair/store/ecl.reducers.ts
View File

@ -218,7 +218,7 @@ export const ECLReducer = createReducer(initECLState,
on(setPageSettings, (state, { payload }) => { on(setPageSettings, (state, { payload }) => {
const newPageSettings: PageSettings[] = []; const newPageSettings: PageSettings[] = [];
ECL_DEFAULT_PAGE_SETTINGS.forEach((defaultPage) => { ECL_DEFAULT_PAGE_SETTINGS.forEach((defaultPage) => {
const pageSetting = payload.find((p) => p.pageId === defaultPage.pageId) || null; const pageSetting = payload && Object.keys(payload).length > 0 ? payload.find((p) => p.pageId === defaultPage.pageId) : null;
if (pageSetting) { if (pageSetting) {
const tablesSettings = JSON.parse(JSON.stringify(pageSetting.tables)); const tablesSettings = JSON.parse(JSON.stringify(pageSetting.tables));
pageSetting.tables = []; // To maintain settings order pageSetting.tables = []; // To maintain settings order

34
src/app/eclair/transactions/invoices/lightning-invoices.component.html
View File

@ -39,55 +39,55 @@
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="timestamp"> <ng-container matColumnDef="timestamp">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> Date Created </th> <th mat-header-cell *matHeaderCellDef mat-sort-header> Date Created </th>
<td mat-cell *matCellDef="let invoice" class="pl-1">{{(invoice?.timestamp * 1000) | date:'dd/MMM/y HH:mm'}}</td> <td mat-cell *matCellDef="let invoice">{{(invoice?.timestamp * 1000) | date:'dd/MMM/y HH:mm'}}</td>
</ng-container> </ng-container>
<ng-container matColumnDef="expiresAt"> <ng-container matColumnDef="expiresAt">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> Date Expiry </th> <th mat-header-cell *matHeaderCellDef mat-sort-header> Date Expiry </th>
<td mat-cell *matCellDef="let invoice" class="pl-1">{{((invoice?.expiresAt * 1000) | date:'dd/MMM/y HH:mm') || '-'}}</td> <td mat-cell *matCellDef="let invoice">{{((invoice?.expiresAt * 1000) | date:'dd/MMM/y HH:mm') || '-'}}</td>
</ng-container> </ng-container>
<ng-container matColumnDef="receivedAt"> <ng-container matColumnDef="receivedAt">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> Date Settled </th> <th mat-header-cell *matHeaderCellDef mat-sort-header> Date Settled </th>
<td mat-cell *matCellDef="let invoice" class="pl-1">{{((invoice?.receivedAt * 1000) | date:'dd/MMM/y HH:mm') || '-'}}</td> <td mat-cell *matCellDef="let invoice">{{((invoice?.receivedAt * 1000) | date:'dd/MMM/y HH:mm') || '-'}}</td>
</ng-container> </ng-container>
<ng-container matColumnDef="nodeId"> <ng-container matColumnDef="nodeId">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> Node Id </th> <th mat-header-cell *matHeaderCellDef mat-sort-header> Node Id </th>
<td mat-cell *matCellDef="let invoice" class="pl-1"> <td mat-cell *matCellDef="let invoice">
<div class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}"> <div class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}">
<span class="ellipsis-child">{{invoice?.nodeId}}</span> <span class="ellipsis-child">{{invoice?.nodeId}}</span>
</div> </div>
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="description"> <ng-container matColumnDef="description">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> Description </th> <th mat-header-cell *matHeaderCellDef mat-sort-header> Description </th>
<td mat-cell *matCellDef="let invoice" class="pl-1"> <td mat-cell *matCellDef="let invoice">
<div class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}"> <div class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}">
<span class="ellipsis-child">{{invoice?.description}}</span> <span class="ellipsis-child">{{invoice?.description}}</span>
</div> </div>
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="paymentHash"> <ng-container matColumnDef="paymentHash">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> Payment Hash </th> <th mat-header-cell *matHeaderCellDef mat-sort-header> Payment Hash </th>
<td mat-cell *matCellDef="let invoice" class="pl-1"> <td mat-cell *matCellDef="let invoice">
<div class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}"> <div class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}">
<span class="ellipsis-child">{{invoice?.paymentHash}}</span> <span class="ellipsis-child">{{invoice?.paymentHash}}</span>
</div> </div>
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="amount"> <ng-container matColumnDef="amount">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before" class="pl-1"> Amount (Sats) </th> <th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before"> Amount (Sats) </th>
<td mat-cell *matCellDef="let invoice" class="pl-1"> <td mat-cell *matCellDef="let invoice">
<span fxLayoutAlign="end center"> {{invoice?.amount ? (invoice?.amount | number:'1.0-0') : '-'}}</span> <span fxLayoutAlign="end center"> {{invoice?.amount ? (invoice?.amount | number:'1.0-0') : '-'}}</span>
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="amountSettled"> <ng-container matColumnDef="amountSettled">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before" class="p1-3"> Amount Settled (Sats) </th> <th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before" class="p1-3"> Amount Settled (Sats) </th>
<td mat-cell *matCellDef="let invoice" class="pl-1"> <td mat-cell *matCellDef="let invoice">
<span fxLayoutAlign="end center"> {{invoice?.amountSettled ? (invoice?.amountSettled | number:'1.0-0') : '-'}}</span> <span fxLayoutAlign="end center"> {{invoice?.amountSettled ? (invoice?.amountSettled | number:'1.0-0') : '-'}}</span>
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="actions"> <ng-container matColumnDef="actions">
<th mat-header-cell *matHeaderCellDef class="pl-1 pr-3"> <th mat-header-cell *matHeaderCellDef>
<div 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 placeholder="Actions" tabindex="1" class="mr-0">
<mat-select-trigger></mat-select-trigger> <mat-select-trigger></mat-select-trigger>
@ -95,7 +95,7 @@
</mat-select> </mat-select>
</div> </div>
</th> </th>
<td mat-cell *matCellDef="let invoice" [ngClass]="{'pl-1 pr-3': screenSize !== screenSizeEnum.XS}" fxLayoutAlign="end center"> <td mat-cell *matCellDef="let invoice" fxLayoutAlign="end center">
<div class="bordered-box table-actions-select" fxLayoutAlign="center center"> <div class="bordered-box table-actions-select" fxLayoutAlign="center center">
<mat-select placeholder="Actions" tabindex="4" class="mr-0"> <mat-select placeholder="Actions" tabindex="4" class="mr-0">
<mat-select-trigger></mat-select-trigger> <mat-select-trigger></mat-select-trigger>

8
src/app/eclair/transactions/payments/lightning-payments.component.html
View File

@ -84,7 +84,7 @@
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="actions"> <ng-container matColumnDef="actions">
<th mat-header-cell *matHeaderCellDef class="px-3"> <th mat-header-cell *matHeaderCellDef>
<div 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 placeholder="Actions" tabindex="1" class="mr-0">
<mat-select-trigger></mat-select-trigger> <mat-select-trigger></mat-select-trigger>
@ -92,7 +92,7 @@
</mat-select> </mat-select>
</div> </div>
</th> </th>
<td mat-cell *matCellDef="let payment" class="px-3" fxLayoutAlign="end center"> <td mat-cell *matCellDef="let payment" fxLayoutAlign="end center">
<button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onPaymentClick(payment)" class="table-actions-button">View Info</button> <button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onPaymentClick(payment)" class="table-actions-button">View Info</button>
</td> </td>
</ng-container> </ng-container>
@ -111,7 +111,7 @@
Total Attempts: {{payment?.parts?.length || 0}} Total Attempts: {{payment?.parts?.length || 0}}
</span> </span>
<ng-container *ngIf="payment?.is_expanded"> <ng-container *ngIf="payment?.is_expanded">
<span *ngFor="let part of payment?.parts" fxLayoutAlign="start center" class="part-row-span pl-3"> <span *ngFor="let part of payment?.parts" fxLayoutAlign="start center" class="part-row-span">
{{part.timestamp | date:'dd/MMM/y HH:mm'}} {{part.timestamp | date:'dd/MMM/y HH:mm'}}
</span> </span>
</ng-container> </ng-container>
@ -212,7 +212,7 @@
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="group_actions"> <ng-container matColumnDef="group_actions">
<td mat-cell *matCellDef="let payment" class="px-3"> <td mat-cell *matCellDef="let payment">
<span fxLayoutAlign="end start"> <span fxLayoutAlign="end start">
<button mat-flat-button class="btn-part-expand" color="primary" type="button" tabindex="5" (click)="payment.is_expanded = !payment.is_expanded">{{payment?.is_expanded ? 'Hide' : 'Show'}}</button> <button mat-flat-button class="btn-part-expand" color="primary" type="button" tabindex="5" (click)="payment.is_expanded = !payment.is_expanded">{{payment?.is_expanded ? 'Hide' : 'Show'}}</button>
</span> </span>

5
src/app/eclair/transactions/payments/lightning-payments.component.scss
View File

@ -34,7 +34,10 @@
.part-row-span { .part-row-span {
min-height: 4.2rem; min-height: 4.2rem;
place-content: center flex-start; place-content: center flex-start;
align-items: center; align-items: center;
&:not(:first-of-type) {
padding-left: 3rem;
}
&.ellipsis-parent { &.ellipsis-parent {
display: flex; display: flex;
} }

4
src/app/lnd/graph/lookups/lookups.component.scss
View File

@ -8,7 +8,3 @@
margin-bottom: 0; margin-bottom: 0;
list-style-type: none; list-style-type: none;
} }
.pl-3 {
padding-left: 3rem;
}

4
src/app/lnd/graph/lookups/node-lookup/node-lookup.component.html
View File

@ -46,10 +46,10 @@
<td mat-cell *matCellDef="let address"> {{address?.addr}} </td> <td mat-cell *matCellDef="let address"> {{address?.addr}} </td>
</ng-container> </ng-container>
<ng-container matColumnDef="actions"> <ng-container matColumnDef="actions">
<th mat-header-cell *matHeaderCellDef class="pl-1"> <th mat-header-cell *matHeaderCellDef>
<div class="bordered-box table-actions-select btn-action" fxLayoutAlign="center center">Actions</div> <div class="bordered-box table-actions-select btn-action" fxLayoutAlign="center center">Actions</div>
</th> </th>
<td mat-cell *matCellDef="let address" class="pl-1"> <td mat-cell *matCellDef="let address">
<span fxLayoutAlign="end center"> <span fxLayoutAlign="end center">
<button mat-stroked-button class="btn-action-copy" color="primary" type="button" tabindex="1" rtlClipboard [payload]="lookupResult.node.pub_key + '@' + address.addr" (copied)="onCopyNodeURI($event)">Copy Node URI</button> <button mat-stroked-button class="btn-action-copy" color="primary" type="button" tabindex="1" rtlClipboard [payload]="lookupResult.node.pub_key + '@' + address.addr" (copied)="onCopyNodeURI($event)">Copy Node URI</button>
</span> </span>

8
src/app/lnd/graph/query-routes/query-routes.component.html
View File

@ -39,8 +39,8 @@
<td mat-cell *matCellDef="let hop" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}"> {{hop?.pub_key}} </td> <td mat-cell *matCellDef="let hop" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}"> {{hop?.pub_key}} </td>
</ng-container> </ng-container>
<ng-container matColumnDef="chan_id"> <ng-container matColumnDef="chan_id">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> Channel </th> <th mat-header-cell *matHeaderCellDef mat-sort-header> Channel </th>
<td mat-cell *matCellDef="let hop" class="pl-1" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}"> {{hop?.chan_id}} </td> <td mat-cell *matCellDef="let hop" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}"> {{hop?.chan_id}} </td>
</ng-container> </ng-container>
<ng-container matColumnDef="tlv_payload"> <ng-container matColumnDef="tlv_payload">
<th mat-header-cell *matHeaderCellDef mat-sort-header> TLV Payload </th> <th mat-header-cell *matHeaderCellDef mat-sort-header> TLV Payload </th>
@ -65,10 +65,10 @@
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="actions"> <ng-container matColumnDef="actions">
<th mat-header-cell *matHeaderCellDef class="pl-2"> <th mat-header-cell *matHeaderCellDef>
<div class="bordered-box table-actions-select" fxLayoutAlign="center center">Actions</div> <div class="bordered-box table-actions-select" fxLayoutAlign="center center">Actions</div>
</th> </th>
<td mat-cell *matCellDef="let hop" class="pl-2" fxLayoutAlign="end center"> <td mat-cell *matCellDef="let hop" fxLayoutAlign="end center">
<button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onHopClick(hop, $event)" class="table-actions-button">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> </td>
</ng-container> </ng-container>

4
src/app/lnd/on-chain/utxo-tables/on-chain-transaction-history/on-chain-transaction-history.component.html
View File

@ -45,7 +45,7 @@
{{transaction?.num_confirmations | number}} </span></td> {{transaction?.num_confirmations | number}} </span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="actions"> <ng-container matColumnDef="actions">
<th mat-header-cell *matHeaderCellDef class="px-3"> <th mat-header-cell *matHeaderCellDef>
<div 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 placeholder="Actions" tabindex="1" class="mr-0">
<mat-select-trigger></mat-select-trigger> <mat-select-trigger></mat-select-trigger>
@ -53,7 +53,7 @@
</mat-select> </mat-select>
</div> </div>
</th> </th>
<td mat-cell *matCellDef="let transaction" class="pl-3" fxLayoutAlign="end center"> <td mat-cell *matCellDef="let transaction" fxLayoutAlign="end center">
<button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onTransactionClick(transaction)" class="table-actions-button">View Info</button> <button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onTransactionClick(transaction)" class="table-actions-button">View Info</button>
</td> </td>
</ng-container> </ng-container>

12
src/app/lnd/on-chain/utxo-tables/utxos/utxos.component.html
View File

@ -32,8 +32,8 @@
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="label"> <ng-container matColumnDef="label">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> Label </th> <th mat-header-cell *matHeaderCellDef mat-sort-header> Label </th>
<td mat-cell *matCellDef="let utxo" class="pl-1"> <td mat-cell *matCellDef="let utxo">
<span fxLayout="row" class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}"> <span fxLayout="row" class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}">
<span class="ellipsis-child">{{utxo.label}}</span> <span class="ellipsis-child">{{utxo.label}}</span>
</span> </span>
@ -48,8 +48,8 @@
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="address"> <ng-container matColumnDef="address">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> Address </th> <th mat-header-cell *matHeaderCellDef mat-sort-header> Address </th>
<td mat-cell *matCellDef="let utxo" class="pl-1"> <td mat-cell *matCellDef="let utxo">
<span fxLayout="row" class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}"> <span fxLayout="row" class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}">
<span class="ellipsis-child">{{utxo?.address}}</span> <span class="ellipsis-child">{{utxo?.address}}</span>
</span> </span>
@ -66,7 +66,7 @@
<td mat-cell *matCellDef="let utxo"><span fxLayoutAlign="end center">{{(utxo.confirmations || 0) | number}}</span></td> <td mat-cell *matCellDef="let utxo"><span fxLayoutAlign="end center">{{(utxo.confirmations || 0) | number}}</span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="actions"> <ng-container matColumnDef="actions">
<th mat-header-cell *matHeaderCellDef class="px-3"> <th mat-header-cell *matHeaderCellDef>
<div 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 placeholder="Actions" tabindex="1" class="mr-0">
<mat-select-trigger></mat-select-trigger> <mat-select-trigger></mat-select-trigger>
@ -74,7 +74,7 @@
</mat-select> </mat-select>
</div> </div>
</th> </th>
<td mat-cell *matCellDef="let utxo" fxLayoutAlign="end center" class="pl-3"> <td mat-cell *matCellDef="let utxo" fxLayoutAlign="end center">
<div class="bordered-box table-actions-select" fxLayoutAlign="center center"> <div class="bordered-box table-actions-select" fxLayoutAlign="center center">
<mat-select placeholder="Actions" tabindex="2" class="mr-0"> <mat-select placeholder="Actions" tabindex="2" class="mr-0">
<mat-select-trigger></mat-select-trigger> <mat-select-trigger></mat-select-trigger>

10
src/app/lnd/peers-channels/channels/channels-tables/channel-active-htlcs-table/channel-active-htlcs-table.component.html
View File

@ -16,7 +16,7 @@
Active HTLCs: {{channel?.pending_htlcs?.length}} Active HTLCs: {{channel?.pending_htlcs?.length}}
</span> </span>
<span *ngIf="channel.is_expanded"> <span *ngIf="channel.is_expanded">
<span *ngFor="let htlc of channel?.pending_htlcs; index as i" fxLayoutAlign="start center" class="htlc-row-span pl-3"> <span *ngFor="let htlc of channel?.pending_htlcs; index as i" fxLayoutAlign="start center" class="htlc-row-span">
{{htlc?.amount | number}} {{htlc?.amount | number}}
</span> </span>
</span> </span>
@ -84,10 +84,10 @@
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="hash_lock"> <ng-container matColumnDef="hash_lock">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before" class="pl-3 htlc-row-span"> <th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before" class="htlc-row-span">
<span fxLayoutAlign="end center" class="htlc-row-span">Hash Lock</span> <span fxLayoutAlign="end center" class="htlc-row-span">Hash Lock</span>
</th> </th>
<td mat-cell *matCellDef="let channel" class="pl-3"> <td mat-cell *matCellDef="let channel">
<span fxLayoutAlign="end center" class="htlc-row-span">{{' '}}</span> <span fxLayoutAlign="end center" class="htlc-row-span">{{' '}}</span>
<span *ngIf="channel.is_expanded"> <span *ngIf="channel.is_expanded">
<span *ngFor="let htlc of channel?.pending_htlcs" fxLayoutAlign="end center" class="htlc-row-span"> <span *ngFor="let htlc of channel?.pending_htlcs" fxLayoutAlign="end center" class="htlc-row-span">
@ -97,7 +97,7 @@
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="actions"> <ng-container matColumnDef="actions">
<th mat-header-cell *matHeaderCellDef class="px-2"> <th mat-header-cell *matHeaderCellDef>
<div 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 placeholder="Actions" tabindex="1" class="mr-0">
<mat-select-trigger></mat-select-trigger> <mat-select-trigger></mat-select-trigger>
@ -105,7 +105,7 @@
</mat-select> </mat-select>
</div> </div>
</th> </th>
<td mat-cell *matCellDef="let channel" class="px-2"> <td mat-cell *matCellDef="let channel">
<span fxLayoutAlign="end center"> <span fxLayoutAlign="end center">
<button mat-flat-button class="btn-htlc-expand" color="primary" type="button" tabindex="5" (click)="channel.is_expanded = !channel.is_expanded">{{channel.is_expanded ? 'Hide' : 'Show'}}</button> <button mat-flat-button class="btn-htlc-expand" color="primary" type="button" tabindex="5" (click)="channel.is_expanded = !channel.is_expanded">{{channel.is_expanded ? 'Hide' : 'Show'}}</button>
</span> </span>

3
src/app/lnd/peers-channels/channels/channels-tables/channel-active-htlcs-table/channel-active-htlcs-table.component.scss
View File

@ -13,6 +13,9 @@
min-height: 4.2rem; min-height: 4.2rem;
place-content: center flex-start; place-content: center flex-start;
align-items: center; align-items: center;
&:not(:first-of-type) {
padding-left: 3rem;
}
} }
.mat-column-actions { .mat-column-actions {

4
src/app/lnd/peers-channels/channels/channels-tables/channel-closed-table/channel-closed-table.component.html
View File

@ -70,7 +70,7 @@
</span></td> </span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="actions"> <ng-container matColumnDef="actions">
<th mat-header-cell *matHeaderCellDef class="pl-1"> <th mat-header-cell *matHeaderCellDef>
<div 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 placeholder="Actions" tabindex="1" class="mr-0">
<mat-select-trigger></mat-select-trigger> <mat-select-trigger></mat-select-trigger>
@ -78,7 +78,7 @@
</mat-select> </mat-select>
</div> </div>
</th> </th>
<td mat-cell *matCellDef="let channel" class="pl-1"> <td mat-cell *matCellDef="let channel">
<span fxLayoutAlign="end center"> <span fxLayoutAlign="end center">
<button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onClosedChannelClick(channel,$event)" class="table-actions-button">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> </span>

8
src/app/lnd/peers-channels/channels/channels-tables/channel-open-table/channel-open-table.component.html
View File

@ -119,8 +119,8 @@
<td mat-cell *matCellDef="let channel"><span fxLayoutAlign="end center">{{channel.remote_balance | number}} </span></td> <td mat-cell *matCellDef="let channel"><span fxLayoutAlign="end center">{{channel.remote_balance | number}} </span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="balancedness"> <ng-container matColumnDef="balancedness">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-2">Balance Score </th> <th mat-header-cell *matHeaderCellDef mat-sort-header>Balance Score </th>
<td mat-cell *matCellDef="let channel" class="pl-2"> <td mat-cell *matCellDef="let channel">
<div fxLayout="row"> <div fxLayout="row">
<mat-hint fxFlex="100" fxLayoutAlign="center center" class="font-size-80">{{channel.balancedness || 0 | number}}</mat-hint> <mat-hint fxFlex="100" fxLayoutAlign="center center" class="font-size-80">{{channel.balancedness || 0 | number}}</mat-hint>
</div> </div>
@ -128,7 +128,7 @@
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="actions"> <ng-container matColumnDef="actions">
<th mat-header-cell *matHeaderCellDef class="pl-1"> <th mat-header-cell *matHeaderCellDef>
<div 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 placeholder="Actions" tabindex="1" class="mr-0">
<mat-select-trigger></mat-select-trigger> <mat-select-trigger></mat-select-trigger>
@ -137,7 +137,7 @@
</mat-select> </mat-select>
</div> </div>
</th> </th>
<td mat-cell *matCellDef="let channel" fxLayoutAlign="end center" class="pl-1"> <td mat-cell *matCellDef="let channel" fxLayoutAlign="end center">
<div class="bordered-box table-actions-select" fxLayoutAlign="center center"> <div class="bordered-box table-actions-select" fxLayoutAlign="center center">
<mat-select placeholder="Actions" tabindex="2" class="mr-0"> <mat-select placeholder="Actions" tabindex="2" class="mr-0">
<mat-select-trigger></mat-select-trigger> <mat-select-trigger></mat-select-trigger>

2
src/app/lnd/peers-channels/channels/channels-tables/channel-open-table/channel-open-table.component.scss
View File

@ -3,11 +3,9 @@
.mat-column-active { .mat-column-active {
max-width: 1.2rem; max-width: 1.2rem;
width:1.2rem; width:1.2rem;
padding-right: 0.5rem;
} }
.mat-column-private { .mat-column-private {
padding-right: 0.5rem;
max-width: 1.6rem; max-width: 1.6rem;
width:1.6rem; width:1.6rem;
} }

58
src/app/lnd/peers-channels/channels/channels-tables/channel-pending-table/channel-pending-table.component.html
View File

@ -43,37 +43,37 @@
</ng-container> </ng-container>
<ng-container matColumnDef="confirmation_height"> <ng-container matColumnDef="confirmation_height">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Confirmation Height</th> <th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Confirmation Height</th>
<td mat-cell *matCellDef="let channel" class="pl-1"><span fxLayoutAlign="end center"> {{channel.confirmation_height | number}}</span></td> <td mat-cell *matCellDef="let channel"><span fxLayoutAlign="end center"> {{channel.confirmation_height | number}}</span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="commit_fee"> <ng-container matColumnDef="commit_fee">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Commit Fee (Sats) </th> <th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Commit Fee (Sats) </th>
<td mat-cell *matCellDef="let channel" class="pl-1"><span fxLayoutAlign="end center">{{channel.commit_fee | number}}</span></td> <td mat-cell *matCellDef="let channel"><span fxLayoutAlign="end center">{{channel.commit_fee | number}}</span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="commit_weight"> <ng-container matColumnDef="commit_weight">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Commit Weight </th> <th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Commit Weight </th>
<td mat-cell *matCellDef="let channel" class="pl-1"><span fxLayoutAlign="end center">{{channel.commit_weight | number}}</span></td> <td mat-cell *matCellDef="let channel"><span fxLayoutAlign="end center">{{channel.commit_weight | number}}</span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="fee_per_kw"> <ng-container matColumnDef="fee_per_kw">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Fee/KW</th> <th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Fee/KW</th>
<td mat-cell *matCellDef="let channel" class="pl-1"><span fxLayoutAlign="end center">{{channel.fee_per_kw | number}}</span></td> <td mat-cell *matCellDef="let channel"><span fxLayoutAlign="end center">{{channel.fee_per_kw | number}}</span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="capacity"> <ng-container matColumnDef="capacity">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Capacity (Sats)</th> <th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Capacity (Sats)</th>
<td mat-cell *matCellDef="let channel" class="pl-1"><span fxLayoutAlign="end center">{{channel.channel.capacity | number}}</span></td> <td mat-cell *matCellDef="let channel"><span fxLayoutAlign="end center">{{channel.channel.capacity | number}}</span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="local_balance"> <ng-container matColumnDef="local_balance">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Local Balance (Sats)</th> <th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Local Balance (Sats)</th>
<td mat-cell *matCellDef="let channel" class="pl-1"><span fxLayoutAlign="end center">{{channel.channel.local_balance | number}}</span></td> <td mat-cell *matCellDef="let channel"><span fxLayoutAlign="end center">{{channel.channel.local_balance | number}}</span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="remote_balance"> <ng-container matColumnDef="remote_balance">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Remote Balance (Sats)</th> <th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Remote Balance (Sats)</th>
<td mat-cell *matCellDef="let channel" class="pl-1"><span fxLayoutAlign="end center">{{channel.channel.remote_balance | number}}</span></td> <td mat-cell *matCellDef="let channel"><span fxLayoutAlign="end center">{{channel.channel.remote_balance | number}}</span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="actions"> <ng-container matColumnDef="actions">
<th mat-header-cell *matHeaderCellDef class="pl-2"> <th mat-header-cell *matHeaderCellDef>
<div class="bordered-box table-actions-select" fxLayoutAlign="center center">Actions</div> <div class="bordered-box table-actions-select" fxLayoutAlign="center center">Actions</div>
</th> </th>
<td mat-cell fxLayoutAlign="end center" *matCellDef="let channel" class="pl-2"> <td mat-cell fxLayoutAlign="end center" *matCellDef="let channel">
<div 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 placeholder="Actions" tabindex="1" class="mr-0">
<mat-select-trigger></mat-select-trigger> <mat-select-trigger></mat-select-trigger>
@ -145,37 +145,37 @@
</ng-container> </ng-container>
<ng-container matColumnDef="limbo_balance"> <ng-container matColumnDef="limbo_balance">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Limbo Balance (Sats) </th> <th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Limbo Balance (Sats) </th>
<td mat-cell *matCellDef="let channel" class="pl-1"><span fxLayoutAlign="end center">{{channel.limbo_balance | number}}</span></td> <td mat-cell *matCellDef="let channel"><span fxLayoutAlign="end center">{{channel.limbo_balance | number}}</span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="maturity_height"> <ng-container matColumnDef="maturity_height">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Maturity Height</th> <th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Maturity Height</th>
<td mat-cell *matCellDef="let channel" class="pl-1"><span fxLayoutAlign="end center">{{channel.maturity_height | number}}</span></td> <td mat-cell *matCellDef="let channel"><span fxLayoutAlign="end center">{{channel.maturity_height | number}}</span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="blocks_til_maturity"> <ng-container matColumnDef="blocks_til_maturity">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Blocks till Maturity</th> <th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Blocks till Maturity</th>
<td mat-cell *matCellDef="let channel" class="pl-1"><span fxLayoutAlign="end center">{{channel.blocks_til_maturity | number}}</span></td> <td mat-cell *matCellDef="let channel"><span fxLayoutAlign="end center">{{channel.blocks_til_maturity | number}}</span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="recovered_balance"> <ng-container matColumnDef="recovered_balance">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Recovered Balance (Sats) </th> <th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Recovered Balance (Sats) </th>
<td mat-cell *matCellDef="let channel" class="pl-1"><span fxLayoutAlign="end center">{{channel.recovered_balance | number}}</span></td> <td mat-cell *matCellDef="let channel"><span fxLayoutAlign="end center">{{channel.recovered_balance | number}}</span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="capacity"> <ng-container matColumnDef="capacity">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Capacity (Sats) </th> <th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Capacity (Sats) </th>
<td mat-cell *matCellDef="let channel" class="pl-1"><span fxLayoutAlign="end center">{{channel.channel.capacity | number}}</span></td> <td mat-cell *matCellDef="let channel"><span fxLayoutAlign="end center">{{channel.channel.capacity | number}}</span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="local_balance"> <ng-container matColumnDef="local_balance">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Local Balance (Sats)</th> <th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Local Balance (Sats)</th>
<td mat-cell *matCellDef="let channel" class="pl-1"><span fxLayoutAlign="end center">{{channel.channel.local_balance | number}}</span></td> <td mat-cell *matCellDef="let channel"><span fxLayoutAlign="end center">{{channel.channel.local_balance | number}}</span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="remote_balance"> <ng-container matColumnDef="remote_balance">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Remote Balance (Sats)</th> <th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Remote Balance (Sats)</th>
<td mat-cell *matCellDef="let channel" class="pl-1"><span fxLayoutAlign="end center">{{channel.channel.remote_balance | number}}</span></td> <td mat-cell *matCellDef="let channel"><span fxLayoutAlign="end center">{{channel.channel.remote_balance | number}}</span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="actions"> <ng-container matColumnDef="actions">
<th mat-header-cell *matHeaderCellDef class="pl-2"> <th mat-header-cell *matHeaderCellDef>
<div class="bordered-box table-actions-select" fxLayoutAlign="center center">Actions</div> <div class="bordered-box table-actions-select" fxLayoutAlign="center center">Actions</div>
</th> </th>
<td mat-cell fxLayoutAlign="end center" *matCellDef="let channel" class="pl-2"> <td mat-cell fxLayoutAlign="end center" *matCellDef="let channel">
<button mat-stroked-button color="primary" type="button" tabindex="2" (click)="onForceClosingClick(channel)" class="table-actions-button">View Info</button> <button mat-stroked-button color="primary" type="button" tabindex="2" (click)="onForceClosingClick(channel)" class="table-actions-button">View Info</button>
</td> </td>
</ng-container> </ng-container>
@ -241,21 +241,21 @@
</ng-container> </ng-container>
<ng-container matColumnDef="capacity"> <ng-container matColumnDef="capacity">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Capacity (Sats) </th> <th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Capacity (Sats) </th>
<td mat-cell *matCellDef="let channel" class="pl-1"><span fxLayoutAlign="end center">{{channel.channel.capacity | number}}</span></td> <td mat-cell *matCellDef="let channel"><span fxLayoutAlign="end center">{{channel.channel.capacity | number}}</span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="local_balance"> <ng-container matColumnDef="local_balance">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Local Balance (Sats)</th> <th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Local Balance (Sats)</th>
<td mat-cell *matCellDef="let channel" class="pl-1"><span fxLayoutAlign="end center">{{channel.channel.local_balance | number}}</span></td> <td mat-cell *matCellDef="let channel"><span fxLayoutAlign="end center">{{channel.channel.local_balance | number}}</span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="remote_balance"> <ng-container matColumnDef="remote_balance">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Remote Balance (Sats)</th> <th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Remote Balance (Sats)</th>
<td mat-cell *matCellDef="let channel" class="pl-1"><span fxLayoutAlign="end center">{{channel.channel.remote_balance | number}}</span></td> <td mat-cell *matCellDef="let channel"><span fxLayoutAlign="end center">{{channel.channel.remote_balance | number}}</span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="actions"> <ng-container matColumnDef="actions">
<th mat-header-cell *matHeaderCellDef class="pl-2"> <th mat-header-cell *matHeaderCellDef>
<div class="bordered-box table-actions-select" fxLayoutAlign="center center">Actions</div> <div class="bordered-box table-actions-select" fxLayoutAlign="center center">Actions</div>
</th> </th>
<td mat-cell fxLayoutAlign="end center" *matCellDef="let channel" class="pl-2"> <td mat-cell fxLayoutAlign="end center" *matCellDef="let channel">
<button mat-stroked-button color="primary" type="button" tabindex="3" (click)="onClosingClick(channel)" class="table-actions-button">View Info</button> <button mat-stroked-button color="primary" type="button" tabindex="3" (click)="onClosingClick(channel)" class="table-actions-button">View Info</button>
</td> </td>
</ng-container> </ng-container>
@ -313,25 +313,25 @@
</ng-container> </ng-container>
<ng-container matColumnDef="limbo_balance"> <ng-container matColumnDef="limbo_balance">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Limbo Balance (Sats) </th> <th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Limbo Balance (Sats) </th>
<td mat-cell *matCellDef="let channel" class="pl-1"><span fxLayoutAlign="end center">{{channel.limbo_balance | number}}</span></td> <td mat-cell *matCellDef="let channel"><span fxLayoutAlign="end center">{{channel.limbo_balance | number}}</span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="capacity"> <ng-container matColumnDef="capacity">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Capacity (Sats) </th> <th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Capacity (Sats) </th>
<td mat-cell *matCellDef="let channel" class="pl-1"><span fxLayoutAlign="end center">{{channel.channel.capacity | number}}</span></td> <td mat-cell *matCellDef="let channel"><span fxLayoutAlign="end center">{{channel.channel.capacity | number}}</span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="local_balance"> <ng-container matColumnDef="local_balance">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Local Balance (Sats)</th> <th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Local Balance (Sats)</th>
<td mat-cell *matCellDef="let channel" class="pl-1"><span fxLayoutAlign="end center">{{channel.channel.local_balance | number}}</span></td> <td mat-cell *matCellDef="let channel"><span fxLayoutAlign="end center">{{channel.channel.local_balance | number}}</span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="remote_balance"> <ng-container matColumnDef="remote_balance">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Remote Balance (Sats)</th> <th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Remote Balance (Sats)</th>
<td mat-cell *matCellDef="let channel" class="pl-1"><span fxLayoutAlign="end center">{{channel.channel.remote_balance | number}}</span></td> <td mat-cell *matCellDef="let channel"><span fxLayoutAlign="end center">{{channel.channel.remote_balance | number}}</span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="actions"> <ng-container matColumnDef="actions">
<th mat-header-cell fxLayoutAlign="end center" class="pl-2" *matHeaderCellDef> <th mat-header-cell fxLayoutAlign="end center" *matHeaderCellDef>
<div class="bordered-box table-actions-select" fxLayoutAlign="center center">Actions</div> <div class="bordered-box table-actions-select" fxLayoutAlign="center center">Actions</div>
</th> </th>
<td mat-cell fxLayoutAlign="end center" *matCellDef="let channel" class="pl-2"> <td mat-cell fxLayoutAlign="end center" *matCellDef="let channel">
<button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onWaitClosingClick(channel)" class="table-actions-button">View Info</button> <button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onWaitClosingClick(channel)" class="table-actions-button">View Info</button>
</td> </td>
</ng-container> </ng-container>

36
src/app/lnd/peers-channels/peers/peers.component.html
View File

@ -24,41 +24,41 @@
<td mat-cell *matCellDef="let peer" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '25rem'}"> {{peer?.pub_key}} </td> <td mat-cell *matCellDef="let peer" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '25rem'}"> {{peer?.pub_key}} </td>
</ng-container> </ng-container>
<ng-container matColumnDef="address"> <ng-container matColumnDef="address">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> Address </th> <th mat-header-cell *matHeaderCellDef mat-sort-header> Address </th>
<td mat-cell *matCellDef="let peer" class="pl-1" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '25rem'}"> {{peer?.address}} </td> <td mat-cell *matCellDef="let peer" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '25rem'}"> {{peer?.address}} </td>
</ng-container> </ng-container>
<ng-container matColumnDef="sync_type"> <ng-container matColumnDef="sync_type">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> Sync Type </th> <th mat-header-cell *matHeaderCellDef mat-sort-header> Sync Type </th>
<td mat-cell *matCellDef="let peer" class="pl-1">{{peer?.sync_type | camelcaseWithReplace:'sync':'_'}}</td> <td mat-cell *matCellDef="let peer">{{peer?.sync_type | camelcaseWithReplace:'sync':'_'}}</td>
</ng-container> </ng-container>
<ng-container matColumnDef="inbound"> <ng-container matColumnDef="inbound">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> Inbound </th> <th mat-header-cell *matHeaderCellDef mat-sort-header> Inbound </th>
<td mat-cell *matCellDef="let peer" class="pl-1">{{peer?.inbound ? 'Yes' : 'No'}}</td> <td mat-cell *matCellDef="let peer">{{peer?.inbound ? 'Yes' : 'No'}}</td>
</ng-container> </ng-container>
<ng-container matColumnDef="bytes_sent"> <ng-container matColumnDef="bytes_sent">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before" class="pl-1"> Bytes Sent </th> <th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before"> Bytes Sent </th>
<td mat-cell *matCellDef="let peer" class="pl-1"><span fxLayoutAlign="end center"> {{peer?.bytes_sent | number}} </span></td> <td mat-cell *matCellDef="let peer"><span fxLayoutAlign="end center"> {{peer?.bytes_sent | number}} </span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="bytes_recv"> <ng-container matColumnDef="bytes_recv">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before" class="pl-1"> Bytes Received </th> <th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before"> Bytes Received </th>
<td mat-cell *matCellDef="let peer" class="pl-1"><span fxLayoutAlign="end center"> {{peer?.bytes_recv | number}} </span></td> <td mat-cell *matCellDef="let peer"><span fxLayoutAlign="end center"> {{peer?.bytes_recv | number}} </span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="sat_sent"> <ng-container matColumnDef="sat_sent">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before" class="pl-1"> Sats Sent </th> <th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before"> Sats Sent </th>
<td mat-cell *matCellDef="let peer" class="pl-1"><span fxLayoutAlign="end center"> {{peer?.sat_sent | number}} </span></td> <td mat-cell *matCellDef="let peer"><span fxLayoutAlign="end center"> {{peer?.sat_sent | number}} </span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="sat_recv"> <ng-container matColumnDef="sat_recv">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before" class="pl-1"> <th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">
Sats Received </th> Sats Received </th>
<td mat-cell *matCellDef="let peer" class="pl-1"><span fxLayoutAlign="end center"> {{peer?.sat_recv | number}} </span></td> <td mat-cell *matCellDef="let peer"><span fxLayoutAlign="end center"> {{peer?.sat_recv | number}} </span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="ping_time"> <ng-container matColumnDef="ping_time">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before" class="pl-1"> Ping Time (<span>&#181;</span>s) </th> <th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before"> Ping Time (<span>&#181;</span>s) </th>
<td mat-cell *matCellDef="let peer" class="pl-1"><span fxLayoutAlign="end center"> {{peer?.ping_time | number}} </span> <td mat-cell *matCellDef="let peer"><span fxLayoutAlign="end center"> {{peer?.ping_time | number}} </span>
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="actions"> <ng-container matColumnDef="actions">
<th mat-header-cell *matHeaderCellDef class="px-3"> <th mat-header-cell *matHeaderCellDef>
<div 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 placeholder="Actions" tabindex="1" class="mr-0">
<mat-select-trigger></mat-select-trigger> <mat-select-trigger></mat-select-trigger>
@ -66,7 +66,7 @@
</mat-select> </mat-select>
</div> </div>
</th> </th>
<td mat-cell *matCellDef="let peer" fxLayoutAlign="end center" class="px-3"> <td mat-cell *matCellDef="let peer" fxLayoutAlign="end center">
<div 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 placeholder="Actions" tabindex="1" class="mr-0">
<mat-select-trigger></mat-select-trigger> <mat-select-trigger></mat-select-trigger>

20
src/app/lnd/routing/forwarding-history/forwarding-history.component.html
View File

@ -14,20 +14,20 @@
<td mat-cell *matCellDef="let fhEvent">{{(fhEvent.timestamp * 1000) | date:'dd/MMM/y HH:mm'}}</td> <td mat-cell *matCellDef="let fhEvent">{{(fhEvent.timestamp * 1000) | date:'dd/MMM/y HH:mm'}}</td>
</ng-container> </ng-container>
<ng-container matColumnDef="alias_in"> <ng-container matColumnDef="alias_in">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1">Inbound Alias</th> <th mat-header-cell *matHeaderCellDef mat-sort-header>Inbound Alias</th>
<td mat-cell *matCellDef="let fhEvent" class="pl-1" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}">{{fhEvent.alias_in}}</td> <td mat-cell *matCellDef="let fhEvent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}">{{fhEvent.alias_in}}</td>
</ng-container> </ng-container>
<ng-container matColumnDef="chan_id_in"> <ng-container matColumnDef="chan_id_in">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1">Inbound Channel</th> <th mat-header-cell *matHeaderCellDef mat-sort-header>Inbound Channel</th>
<td mat-cell *matCellDef="let fhEvent" class="pl-1" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}">{{fhEvent.chan_id_in}}</td> <td mat-cell *matCellDef="let fhEvent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}">{{fhEvent.chan_id_in}}</td>
</ng-container> </ng-container>
<ng-container matColumnDef="alias_out"> <ng-container matColumnDef="alias_out">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1">Outbound Alias</th> <th mat-header-cell *matHeaderCellDef mat-sort-header>Outbound Alias</th>
<td mat-cell *matCellDef="let fhEvent" class="pl-1" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}">{{fhEvent.alias_out}}</td> <td mat-cell *matCellDef="let fhEvent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}">{{fhEvent.alias_out}}</td>
</ng-container> </ng-container>
<ng-container matColumnDef="chan_id_out"> <ng-container matColumnDef="chan_id_out">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1">Outbound Channel</th> <th mat-header-cell *matHeaderCellDef mat-sort-header>Outbound Channel</th>
<td mat-cell *matCellDef="let fhEvent" class="pl-1" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}">{{fhEvent.chan_id_out}}</td> <td mat-cell *matCellDef="let fhEvent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}">{{fhEvent.chan_id_out}}</td>
</ng-container> </ng-container>
<ng-container matColumnDef="amt_in"> <ng-container matColumnDef="amt_in">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Inbound Amount (Sats)</th> <th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Inbound Amount (Sats)</th>
@ -42,7 +42,7 @@
<td mat-cell *matCellDef="let fhEvent"><span fxLayoutAlign="end center">{{fhEvent.fee_msat | number}}</span></td> <td mat-cell *matCellDef="let fhEvent"><span fxLayoutAlign="end center">{{fhEvent.fee_msat | number}}</span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="actions"> <ng-container matColumnDef="actions">
<th mat-header-cell *matHeaderCellDef class="px-3"> <th mat-header-cell *matHeaderCellDef>
<div 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 placeholder="Actions" tabindex="1" class="mr-0">
<mat-select-trigger></mat-select-trigger> <mat-select-trigger></mat-select-trigger>
@ -50,7 +50,7 @@
</mat-select> </mat-select>
</div> </div>
</th> </th>
<td mat-cell *matCellDef="let fhEvent" class="pl-3" fxLayoutAlign="end center"> <td mat-cell *matCellDef="let fhEvent" fxLayoutAlign="end center">
<button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onForwardingEventClick(fhEvent,$event)" class="table-actions-button">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> </td>
</ng-container> </ng-container>

4
src/app/lnd/routing/non-routing-peers/non-routing-peers.component.html
View File

@ -85,10 +85,10 @@
<td mat-cell *matCellDef="let nonRPeer"><span fxLayoutAlign="end center">{{nonRPeer.remote_balance | number}}</span></td> <td mat-cell *matCellDef="let nonRPeer"><span fxLayoutAlign="end center">{{nonRPeer.remote_balance | number}}</span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="actions"> <ng-container matColumnDef="actions">
<th mat-header-cell *matHeaderCellDef class="pr-3"> <th mat-header-cell *matHeaderCellDef>
<div class="bordered-box table-actions-select" fxLayoutAlign="center center">Actions</div> <div class="bordered-box table-actions-select" fxLayoutAlign="center center">Actions</div>
</th> </th>
<td mat-cell *matCellDef="let nonRPeer" class="pr-2" fxLayoutAlign="end center"> <td mat-cell *matCellDef="let nonRPeer" fxLayoutAlign="end center">
<button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onManagePeer(nonRPeer)">Manage</button> <button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onManagePeer(nonRPeer)">Manage</button>
</td> </td>
</ng-container> </ng-container>

4
src/app/lnd/routing/routing-peers/routing-peers.component.html
View File

@ -29,10 +29,10 @@
<td mat-cell *matCellDef="let rPeer"><span fxLayoutAlign="end center">{{rPeer.total_amount | number}}</span></td> <td mat-cell *matCellDef="let rPeer"><span fxLayoutAlign="end center">{{rPeer.total_amount | number}}</span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="actions"> <ng-container matColumnDef="actions">
<th mat-header-cell *matHeaderCellDef class="pr-3"> <th mat-header-cell *matHeaderCellDef>
<div class="bordered-box table-actions-select" fxLayoutAlign="center center">Actions</div> <div class="bordered-box table-actions-select" fxLayoutAlign="center center">Actions</div>
</th> </th>
<td mat-cell *matCellDef="let rPeer" class="pl-2" fxLayoutAlign="end center"> <td mat-cell *matCellDef="let rPeer" fxLayoutAlign="end center">
<button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onRoutingPeerClick(rPeer, $event, 'in')" class="table-actions-button">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> </td>
</ng-container> </ng-container>

4
src/app/lnd/store/lnd.effects.ts
View File

@ -1200,8 +1200,8 @@ export class LNDEffects implements OnDestroy {
map((settings: any) => { map((settings: any) => {
this.logger.info(settings); this.logger.info(settings);
this.store.dispatch(updateLNDAPICallStatus({ payload: { action: 'FetchPageSettings', status: APICallStatusEnum.COMPLETED } })); this.store.dispatch(updateLNDAPICallStatus({ payload: { action: 'FetchPageSettings', status: APICallStatusEnum.COMPLETED } }));
this.invoicesPageSize = (settings ? (settings.find((page) => page.pageId === 'transactions')?.tables.find((table) => table.tableId === 'invoices')) : LND_DEFAULT_PAGE_SETTINGS.find((page) => page.pageId === 'transactions')?.tables.find((table) => table.tableId === 'invoices')).recordsPerPage; this.invoicesPageSize = (settings && Object.keys(settings).length > 0 ? (settings.find((page) => page.pageId === 'transactions')?.tables.find((table) => table.tableId === 'invoices')) : LND_DEFAULT_PAGE_SETTINGS.find((page) => page.pageId === 'transactions')?.tables.find((table) => table.tableId === 'invoices')).recordsPerPage;
this.paymentsPageSize = (settings ? (settings.find((page) => page.pageId === 'transactions')?.tables.find((table) => table.tableId === 'payments')) : LND_DEFAULT_PAGE_SETTINGS.find((page) => page.pageId === 'transactions')?.tables.find((table) => table.tableId === 'payments')).recordsPerPage; this.paymentsPageSize = (settings && Object.keys(settings).length > 0 ? (settings.find((page) => page.pageId === 'transactions')?.tables.find((table) => table.tableId === 'payments')) : LND_DEFAULT_PAGE_SETTINGS.find((page) => page.pageId === 'transactions')?.tables.find((table) => table.tableId === 'payments')).recordsPerPage;
this.store.dispatch(fetchInvoices({ payload: { num_max_invoices: this.invoicesPageSize, reversed: true } })); this.store.dispatch(fetchInvoices({ payload: { num_max_invoices: this.invoicesPageSize, reversed: true } }));
// this.store.dispatch(fetchPayments({ payload: { max_payments: 100000, reversed: true } })); // this.store.dispatch(fetchPayments({ payload: { max_payments: 100000, reversed: true } }));
return { return {

2
src/app/lnd/store/lnd.reducers.ts
View File

@ -226,7 +226,7 @@ export const LNDReducer = createReducer(initLNDState,
on(setPageSettings, (state, { payload }) => { on(setPageSettings, (state, { payload }) => {
const newPageSettings: PageSettings[] = []; const newPageSettings: PageSettings[] = [];
LND_DEFAULT_PAGE_SETTINGS.forEach((defaultPage) => { LND_DEFAULT_PAGE_SETTINGS.forEach((defaultPage) => {
const pageSetting = payload.find((p) => p.pageId === defaultPage.pageId) || null; const pageSetting = payload && Object.keys(payload).length > 0 ? payload.find((p) => p.pageId === defaultPage.pageId) : null;
if (pageSetting) { if (pageSetting) {
const tablesSettings = JSON.parse(JSON.stringify(pageSetting.tables)); const tablesSettings = JSON.parse(JSON.stringify(pageSetting.tables));
pageSetting.tables = []; // To maintain settings order pageSetting.tables = []; // To maintain settings order

8
src/app/lnd/transactions/invoices/lightning-invoices.component.html
View File

@ -64,8 +64,8 @@
{{(invoice?.creation_date * 1000) | date:'dd/MMM/y HH:mm'}}</td> {{(invoice?.creation_date * 1000) | date:'dd/MMM/y HH:mm'}}</td>
</ng-container> </ng-container>
<ng-container matColumnDef="settle_date"> <ng-container matColumnDef="settle_date">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-4"> Date Settled </th> <th mat-header-cell *matHeaderCellDef mat-sort-header> Date Settled </th>
<td mat-cell *matCellDef="let invoice" class="pl-4">{{(+invoice?.settle_date !== 0 ? ((+invoice?.settle_date * 1000) | date:'dd/MMM/y HH:mm') : '-')}}</td> <td mat-cell *matCellDef="let invoice">{{(+invoice?.settle_date !== 0 ? ((+invoice?.settle_date * 1000) | date:'dd/MMM/y HH:mm') : '-')}}</td>
</ng-container> </ng-container>
<ng-container matColumnDef="memo"> <ng-container matColumnDef="memo">
<th mat-header-cell *matHeaderCellDef mat-sort-header> Memo </th> <th mat-header-cell *matHeaderCellDef mat-sort-header> Memo </th>
@ -140,7 +140,7 @@
<td mat-cell *matCellDef="let invoice"><span fxLayoutAlign="end center"> {{invoice?.amt_paid_sat | number}} </span></td> <td mat-cell *matCellDef="let invoice"><span fxLayoutAlign="end center"> {{invoice?.amt_paid_sat | number}} </span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="actions"> <ng-container matColumnDef="actions">
<th mat-header-cell *matHeaderCellDef class="px-3"> <th mat-header-cell *matHeaderCellDef>
<div 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 placeholder="Actions" tabindex="1" class="mr-0">
<mat-select-trigger></mat-select-trigger> <mat-select-trigger></mat-select-trigger>
@ -148,7 +148,7 @@
</mat-select> </mat-select>
</div> </div>
</th> </th>
<td mat-cell *matCellDef="let invoice" [ngClass]="{'pl-3': screenSize !== screenSizeEnum.XS}" fxLayoutAlign="end center"> <td mat-cell *matCellDef="let invoice" fxLayoutAlign="end center">
<div class="bordered-box table-actions-select" fxLayoutAlign="center center"> <div class="bordered-box table-actions-select" fxLayoutAlign="center center">
<mat-select placeholder="Actions" tabindex="4" class="mr-0"> <mat-select placeholder="Actions" tabindex="4" class="mr-0">
<mat-select-trigger></mat-select-trigger> <mat-select-trigger></mat-select-trigger>

2
src/app/lnd/transactions/invoices/lightning-invoices.component.scss
View File

@ -1,11 +1,9 @@
.mat-column-state { .mat-column-state {
max-width: 1.2rem; max-width: 1.2rem;
width:1.2rem; width:1.2rem;
padding-right: 0.5rem;
} }
.mat-column-private, .mat-column-is_keysend, .mat-column-is_amp { .mat-column-private, .mat-column-is_keysend, .mat-column-is_amp {
padding-right: 0.5rem;
max-width: 1.6rem; max-width: 1.6rem;
width:1.6rem; width:1.6rem;
} }

4
src/app/lnd/transactions/lookup-transactions/lookup-transactions.component.scss
View File

@ -8,7 +8,3 @@
margin-bottom: 0; margin-bottom: 0;
list-style-type: none; list-style-type: none;
} }
.pl-3 {
padding-left: 3rem;
}

10
src/app/lnd/transactions/payments/lightning-payments.component.html
View File

@ -103,7 +103,7 @@
<td mat-cell *matCellDef="let payment"><span fxLayoutAlign="end center">{{payment?.htlcs[0]?.route?.hops?.length || 0}}</span></td> <td mat-cell *matCellDef="let payment"><span fxLayoutAlign="end center">{{payment?.htlcs[0]?.route?.hops?.length || 0}}</span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="actions"> <ng-container matColumnDef="actions">
<th mat-header-cell *matHeaderCellDef class="px-2"> <th mat-header-cell *matHeaderCellDef>
<div 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 placeholder="Actions" tabindex="1" class="mr-0">
<mat-select-trigger></mat-select-trigger> <mat-select-trigger></mat-select-trigger>
@ -111,7 +111,7 @@
</mat-select> </mat-select>
</div> </div>
</th> </th>
<td mat-cell *matCellDef="let payment" class="px-2" fxLayoutAlign="end center"> <td mat-cell *matCellDef="let payment" fxLayoutAlign="end center">
<button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onPaymentClick(payment)" class="table-actions-button">View Info</button> <button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onPaymentClick(payment)" class="table-actions-button">View Info</button>
</td> </td>
</ng-container> </ng-container>
@ -130,7 +130,7 @@
<span *ngIf="payment?.status !== 'SUCCEEDED'" class="dot red" matTooltip="Failed" matTooltipPosition="right" [ngClass]="{'mr-0': screenSize === screenSizeEnum.XS}"></span> <span *ngIf="payment?.status !== 'SUCCEEDED'" class="dot red" matTooltip="Failed" matTooltipPosition="right" [ngClass]="{'mr-0': screenSize === screenSizeEnum.XS}"></span>
</span> </span>
<ng-container *ngIf="payment?.is_expanded"> <ng-container *ngIf="payment?.is_expanded">
<span *ngFor="let htlc of payment?.htlcs" fxLayoutAlign="start center" class="htlc-row-span pl-3"> <span *ngFor="let htlc of payment?.htlcs" fxLayoutAlign="start center" class="htlc-row-span">
<span *ngIf="htlc.status === 'SUCCEEDED'" class="dot green" matTooltip="Succeeded" matTooltipPosition="right" [ngClass]="{'mr-0': screenSize === screenSizeEnum.XS}"></span> <span *ngIf="htlc.status === 'SUCCEEDED'" class="dot green" matTooltip="Succeeded" matTooltipPosition="right" [ngClass]="{'mr-0': screenSize === screenSizeEnum.XS}"></span>
<span *ngIf="htlc.status !== 'SUCCEEDED'" class="dot red" matTooltip="Failed" matTooltipPosition="right" [ngClass]="{'mr-0': screenSize === screenSizeEnum.XS}"></span> <span *ngIf="htlc.status !== 'SUCCEEDED'" class="dot red" matTooltip="Failed" matTooltipPosition="right" [ngClass]="{'mr-0': screenSize === screenSizeEnum.XS}"></span>
</span> </span>
@ -143,7 +143,7 @@
Total Attempts: {{payment?.htlcs?.length}} Total Attempts: {{payment?.htlcs?.length}}
</span> </span>
<ng-container *ngIf="payment?.is_expanded"> <ng-container *ngIf="payment?.is_expanded">
<span *ngFor="let htlc of payment?.htlcs" fxLayoutAlign="start center" class="htlc-row-span pl-3"> <span *ngFor="let htlc of payment?.htlcs" fxLayoutAlign="start center" class="htlc-row-span">
{{(htlc.attempt_time_ns / 1000000) | date:'dd/MMM/y HH:mm'}} {{(htlc.attempt_time_ns / 1000000) | date:'dd/MMM/y HH:mm'}}
</span> </span>
</ng-container> </ng-container>
@ -258,7 +258,7 @@
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="group_actions"> <ng-container matColumnDef="group_actions">
<td mat-cell *matCellDef="let payment" class="px-2"> <td mat-cell *matCellDef="let payment">
<span fxLayoutAlign="end center"> <span fxLayoutAlign="end center">
<button mat-flat-button class="btn-htlc-expand" color="primary" type="button" tabindex="5" (click)="payment.is_expanded = !payment?.is_expanded">{{payment?.is_expanded ? 'Hide' : 'Show'}}</button> <button mat-flat-button class="btn-htlc-expand" color="primary" type="button" tabindex="5" (click)="payment.is_expanded = !payment?.is_expanded">{{payment?.is_expanded ? 'Hide' : 'Show'}}</button>
</span> </span>

6
src/app/lnd/transactions/payments/lightning-payments.component.scss
View File

@ -1,5 +1,6 @@
.mat-column-status, .mat-column-group_status { .mat-column-status, .mat-column-group_status {
width: 1.5rem; max-width: 1.2rem;
width: 1.2rem;
} }
.mat-column-payment_hash, .mat-column-payment_request, .mat-column-payment_preimage, .mat-column-description, .mat-column-description_hash { .mat-column-payment_hash, .mat-column-payment_request, .mat-column-payment_preimage, .mat-column-description, .mat-column-description_hash {
@ -33,6 +34,9 @@
min-height: 4.2rem; min-height: 4.2rem;
place-content: center flex-start; place-content: center flex-start;
align-items: center; align-items: center;
&:not(:first-of-type) {
padding-left: 3rem;
}
&.ellipsis-parent { &.ellipsis-parent {
display: flex; display: flex;
} }

60
src/app/shared/components/ln-services/boltz/swaps/swaps.component.html
View File

@ -17,97 +17,97 @@
<td mat-cell *matCellDef="let swap">{{swapStateEnum[swap?.status]}}</td> <td mat-cell *matCellDef="let swap">{{swapStateEnum[swap?.status]}}</td>
</ng-container> </ng-container>
<ng-container matColumnDef="id"> <ng-container matColumnDef="id">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> Swap ID </th> <th mat-header-cell *matHeaderCellDef mat-sort-header> Swap ID </th>
<td mat-cell *matCellDef="let swap" class="pl-1">{{swap?.id}}</td> <td mat-cell *matCellDef="let swap">{{swap?.id}}</td>
</ng-container> </ng-container>
<ng-container matColumnDef="claimAddress"> <ng-container matColumnDef="claimAddress">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> Claim Address </th> <th mat-header-cell *matHeaderCellDef mat-sort-header> Claim Address </th>
<td mat-cell *matCellDef="let swap" class="pl-1"> <td mat-cell *matCellDef="let swap">
<span fxLayout="row" class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}"> <span fxLayout="row" class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}">
<span class="ellipsis-child">{{swap?.claimAddress}}</span> <span class="ellipsis-child">{{swap?.claimAddress}}</span>
</span> </span>
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="lockupAddress"> <ng-container matColumnDef="lockupAddress">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> Lockup Address </th> <th mat-header-cell *matHeaderCellDef mat-sort-header> Lockup Address </th>
<td mat-cell *matCellDef="let swap" class="pl-1"> <td mat-cell *matCellDef="let swap">
<span fxLayout="row" class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}"> <span fxLayout="row" class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}">
<span class="ellipsis-child">{{swap?.lockupAddress}}</span> <span class="ellipsis-child">{{swap?.lockupAddress}}</span>
</span> </span>
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="onchainAmount"> <ng-container matColumnDef="onchainAmount">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before" class="pl-1"> Onchain Amount (Sats) </th> <th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before"> Onchain Amount (Sats) </th>
<td mat-cell *matCellDef="let swap" class="pl-1"> <td mat-cell *matCellDef="let swap">
<span fxLayoutAlign="end center">{{swap?.onchainAmount | number}}</span> <span fxLayoutAlign="end center">{{swap?.onchainAmount | number}}</span>
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="expectedAmount"> <ng-container matColumnDef="expectedAmount">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before" class="pl-1"> Expected Amount (Sats) </th> <th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before"> Expected Amount (Sats) </th>
<td mat-cell *matCellDef="let swap" class="pl-1"> <td mat-cell *matCellDef="let swap">
<span fxLayoutAlign="end center">{{swap?.expectedAmount | number}}</span> <span fxLayoutAlign="end center">{{swap?.expectedAmount | number}}</span>
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="error"> <ng-container matColumnDef="error">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> Error </th> <th mat-header-cell *matHeaderCellDef mat-sort-header> Error </th>
<td mat-cell *matCellDef="let swap" class="pl-1"> <td mat-cell *matCellDef="let swap">
<span fxLayout="row" class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}"> <span fxLayout="row" class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}">
<span class="ellipsis-child">{{swap?.error}}</span> <span class="ellipsis-child">{{swap?.error}}</span>
</span> </span>
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="privateKey"> <ng-container matColumnDef="privateKey">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> Private Key </th> <th mat-header-cell *matHeaderCellDef mat-sort-header> Private Key </th>
<td mat-cell *matCellDef="let swap" class="pl-1"> <td mat-cell *matCellDef="let swap">
<span fxLayout="row" class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}"> <span fxLayout="row" class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}">
<span class="ellipsis-child">{{swap?.privateKey}}</span> <span class="ellipsis-child">{{swap?.privateKey}}</span>
</span> </span>
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="preimage"> <ng-container matColumnDef="preimage">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> Preimage </th> <th mat-header-cell *matHeaderCellDef mat-sort-header> Preimage </th>
<td mat-cell *matCellDef="let swap" class="pl-1"> <td mat-cell *matCellDef="let swap">
<span fxLayout="row" class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}"> <span fxLayout="row" class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}">
<span class="ellipsis-child">{{swap?.preimage}}</span> <span class="ellipsis-child">{{swap?.preimage}}</span>
</span> </span>
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="redeemScript"> <ng-container matColumnDef="redeemScript">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> Redeem Script </th> <th mat-header-cell *matHeaderCellDef mat-sort-header> Redeem Script </th>
<td mat-cell *matCellDef="let swap" class="pl-1"> <td mat-cell *matCellDef="let swap">
<span fxLayout="row" class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}"> <span fxLayout="row" class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}">
<span class="ellipsis-child">{{swap?.redeemScript}}</span> <span class="ellipsis-child">{{swap?.redeemScript}}</span>
</span> </span>
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="invoice"> <ng-container matColumnDef="invoice">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> Invoice </th> <th mat-header-cell *matHeaderCellDef mat-sort-header> Invoice </th>
<td mat-cell *matCellDef="let swap" class="pl-1"> <td mat-cell *matCellDef="let swap">
<span fxLayout="row" class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}"> <span fxLayout="row" class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}">
<span class="ellipsis-child">{{swap?.invoice}}</span> <span class="ellipsis-child">{{swap?.invoice}}</span>
</span> </span>
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="timeoutBlockHeight"> <ng-container matColumnDef="timeoutBlockHeight">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before" class="pl-1"> Timeout Block Height </th> <th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before"> Timeout Block Height </th>
<td mat-cell *matCellDef="let swap" class="pl-1"> <td mat-cell *matCellDef="let swap">
<span fxLayoutAlign="end center">{{swap?.timeoutBlockHeight | number}}</span> <span fxLayoutAlign="end center">{{swap?.timeoutBlockHeight | number}}</span>
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="lockupTransactionId"> <ng-container matColumnDef="lockupTransactionId">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> Lockup Tx ID </th> <th mat-header-cell *matHeaderCellDef mat-sort-header> Lockup Tx ID </th>
<td mat-cell *matCellDef="let swap" class="pl-1">{{swap?.lockupTransactionId}}</td> <td mat-cell *matCellDef="let swap">{{swap?.lockupTransactionId}}</td>
</ng-container> </ng-container>
<ng-container matColumnDef="claimTransactionId"> <ng-container matColumnDef="claimTransactionId">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> Claim Tx ID </th> <th mat-header-cell *matHeaderCellDef mat-sort-header> Claim Tx ID </th>
<td mat-cell *matCellDef="let swap" class="pl-1">{{swap?.claimTransactionId}}</td> <td mat-cell *matCellDef="let swap">{{swap?.claimTransactionId}}</td>
</ng-container> </ng-container>
<ng-container matColumnDef="refundTransactionId"> <ng-container matColumnDef="refundTransactionId">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> Refund Tx ID </th> <th mat-header-cell *matHeaderCellDef mat-sort-header> Refund Tx ID </th>
<td mat-cell *matCellDef="let swap" class="pl-1">{{swap?.refundTransactionId}}</td> <td mat-cell *matCellDef="let swap">{{swap?.refundTransactionId}}</td>
</ng-container> </ng-container>
<ng-container matColumnDef="actions"> <ng-container matColumnDef="actions">
<th mat-header-cell *matHeaderCellDef class="pl-1 pr-3"> <th mat-header-cell *matHeaderCellDef>
<div 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 placeholder="Actions" tabindex="1" class="mr-0">
<mat-select-trigger></mat-select-trigger> <mat-select-trigger></mat-select-trigger>
@ -115,7 +115,7 @@
</mat-select> </mat-select>
</div> </div>
</th> </th>
<td mat-cell *matCellDef="let swap" class="pl-1" fxLayoutAlign="end center"> <td mat-cell *matCellDef="let swap" fxLayoutAlign="end center">
<button mat-stroked-button color="primary" type="button" tabindex="4" <button mat-stroked-button color="primary" type="button" tabindex="4"
(click)="onSwapClick(swap, $event)" class="table-actions-button">View Info</button> (click)="onSwapClick(swap, $event)" class="table-actions-button">View Info</button>
</td> </td>

16
src/app/shared/components/ln-services/loop/swaps/swaps.component.html
View File

@ -44,31 +44,31 @@
{{swap?.cost_onchain | number}} </span></td> {{swap?.cost_onchain | number}} </span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="htlc_address"> <ng-container matColumnDef="htlc_address">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> HTLC Address </th> <th mat-header-cell *matHeaderCellDef mat-sort-header> HTLC Address </th>
<td mat-cell *matCellDef="let swap" class="pl-1"> <td mat-cell *matCellDef="let swap">
<span fxLayout="row" class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}"> <span fxLayout="row" class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}">
<span class="ellipsis-child">{{swap?.htlc_address}}</span> <span class="ellipsis-child">{{swap?.htlc_address}}</span>
</span> </span>
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="id"> <ng-container matColumnDef="id">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> ID </th> <th mat-header-cell *matHeaderCellDef mat-sort-header> ID </th>
<td mat-cell *matCellDef="let swap" class="pl-1"> <td mat-cell *matCellDef="let swap">
<span fxLayout="row" class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}"> <span fxLayout="row" class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}">
<span class="ellipsis-child">{{swap?.id}}</span> <span class="ellipsis-child">{{swap?.id}}</span>
</span> </span>
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="id_bytes"> <ng-container matColumnDef="id_bytes">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-1"> ID (Bytes) </th> <th mat-header-cell *matHeaderCellDef mat-sort-header> ID (Bytes) </th>
<td mat-cell *matCellDef="let swap" class="pl-1"> <td mat-cell *matCellDef="let swap">
<span fxLayout="row" class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}"> <span fxLayout="row" class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}">
<span class="ellipsis-child">{{swap?.id_bytes}}</span> <span class="ellipsis-child">{{swap?.id_bytes}}</span>
</span> </span>
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="actions"> <ng-container matColumnDef="actions">
<th mat-header-cell *matHeaderCellDef class="px-3"> <th mat-header-cell *matHeaderCellDef>
<div 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 placeholder="Actions" tabindex="1" class="mr-0">
<mat-select-trigger></mat-select-trigger> <mat-select-trigger></mat-select-trigger>
@ -76,7 +76,7 @@
</mat-select> </mat-select>
</div> </div>
</th> </th>
<td mat-cell *matCellDef="let swap" class="pl-3" fxLayoutAlign="end center"> <td mat-cell *matCellDef="let swap" fxLayoutAlign="end center">
<button mat-stroked-button color="primary" type="button" tabindex="4" <button mat-stroked-button color="primary" type="button" tabindex="4"
(click)="onSwapClick(swap, $event)" class="table-actions-button">View Info</button> (click)="onSwapClick(swap, $event)" class="table-actions-button">View Info</button>
</td> </td>

4
src/app/shared/components/transactions-report-table/transactions-report-table.component.html
View File

@ -30,7 +30,7 @@
<td mat-cell *matCellDef="let transaction"><span fxLayoutAlign="end center">{{transaction?.num_invoices | number}}</span></td> <td mat-cell *matCellDef="let transaction"><span fxLayoutAlign="end center">{{transaction?.num_invoices | number}}</span></td>
</ng-container> </ng-container>
<ng-container matColumnDef="actions"> <ng-container matColumnDef="actions">
<th mat-header-cell *matHeaderCellDef class="px-3"> <th mat-header-cell *matHeaderCellDef>
<div 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 placeholder="Actions" tabindex="1" class="mr-0">
<mat-select-trigger></mat-select-trigger> <mat-select-trigger></mat-select-trigger>
@ -38,7 +38,7 @@
</mat-select> </mat-select>
</div> </div>
</th> </th>
<td mat-cell *matCellDef="let transaction" class="px-3" fxLayoutAlign="end center"> <td mat-cell *matCellDef="let transaction" fxLayoutAlign="end center">
<button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onTransactionClick(transaction)" class="table-actions-button">View Info</button> <button mat-stroked-button color="primary" type="button" tabindex="4" (click)="onTransactionClick(transaction)" class="table-actions-button">View Info</button>
</td> </td>
</ng-container> </ng-container>

4
src/app/shared/services/consts-enums-functions.ts
View File

@ -718,7 +718,7 @@ export const CLN_DEFAULT_PAGE_SETTINGS: PageSettings[] = [
columnSelection: ['offer_id', 'single_use', 'used'] }, columnSelection: ['offer_id', 'single_use', 'used'] },
{ tableId: 'offer_bookmarks', recordsPerPage: PAGE_SIZE, sortBy: 'lastUpdatedAt', sortOrder: SortOrderEnum.DESCENDING, { tableId: 'offer_bookmarks', recordsPerPage: PAGE_SIZE, sortBy: 'lastUpdatedAt', sortOrder: SortOrderEnum.DESCENDING,
columnSelectionSM: ['lastUpdatedAt', 'amountMSat'], columnSelectionSM: ['lastUpdatedAt', 'amountMSat'],
columnSelection: ['lastUpdatedAt', 'title', 'amountMSat', 'description'] } columnSelection: ['lastUpdatedAt', 'title', 'description', 'amountMSat'] }
] }, ] },
{ pageId: 'routing', tables: [ { pageId: 'routing', tables: [
{ tableId: 'forwarding_history', recordsPerPage: PAGE_SIZE, sortBy: 'received_time', sortOrder: SortOrderEnum.DESCENDING, { tableId: 'forwarding_history', recordsPerPage: PAGE_SIZE, sortBy: 'received_time', sortOrder: SortOrderEnum.DESCENDING,
@ -800,7 +800,7 @@ export const CLN_TABLES_DEF = {
}, },
offer_bookmarks: { offer_bookmarks: {
maxColumns: 6, maxColumns: 6,
allowedColumns: ['lastUpdatedAt', 'title', 'amountMSat', 'description', 'vendor', 'bolt12'] allowedColumns: ['lastUpdatedAt', 'title', 'description', 'vendor', 'bolt12', 'amountMSat']
} }
}, },
routing: { routing: {

16
src/app/shared/theme/styles/root.scss
View File

@ -652,6 +652,16 @@ mat-cell:last-of-type, mat-header-cell:last-of-type, mat-footer-cell:last-of-typ
} }
} }
.pl-5px {
padding-left: 0.5rem !important;
@include for_screensize(tab-port) {
padding-left: 0.4rem !important;
}
@include for_screensize(phone) {
padding-left: 0.3rem !important;
}
}
.pl-1 { .pl-1 {
padding-left: 1rem !important; padding-left: 1rem !important;
@include for_screensize(tab-port) { @include for_screensize(tab-port) {
@ -710,6 +720,10 @@ mat-cell:last-of-type, mat-header-cell:last-of-type, mat-footer-cell:last-of-typ
padding-right: 0.4rem !important; padding-right: 0.4rem !important;
} }
.pr-6px {
padding-right: 0.6rem !important;
}
.p-0 { .p-0 {
padding: 0 !important; padding: 0 !important;
} }
@ -1343,7 +1357,7 @@ th.mat-header-cell:last-of-type, td.mat-cell:last-of-type, td.mat-footer-cell:la
width: $dot-size; width: $dot-size;
height: $dot-size; height: $dot-size;
border-radius: $dot-size; border-radius: $dot-size;
margin: 0.4rem 1rem 0 0; margin: 0.4rem 0 0 0;
&.tiny-dot { &.tiny-dot {
width: $tiny-dot-size; width: $tiny-dot-size;
height: $tiny-dot-size; height: $tiny-dot-size;

3
src/app/shared/theme/styles/theme-color.scss
View File

@ -190,6 +190,9 @@
thead tr th { thead tr th {
color: $foreground-base; color: $foreground-base;
} }
thead tr th:not(:first-of-type), tbody tr td:not(:first-of-type) {
padding-left: 1rem;
}
&.error-border { &.error-border {
border: 1px solid red; border: 1px solid red;
box-shadow: 0 3px 1px -2px rgba(255,0,0,.2), 0 2px 2px 0 rgba(255,0,0,.14), 0 1px 5px 0 rgba(255,0,0,.12) !important; box-shadow: 0 3px 1px -2px rgba(255,0,0,.2), 0 2px 2px 0 rgba(255,0,0,.14), 0 1px 5px 0 rgba(255,0,0,.12) !important;