ECL Page Setup Finished

This commit is contained in:
ShahanaFarooqui 2022-10-24 11:25:18 -07:00
parent 72beafa26c
commit e62e7473f1
19 changed files with 126 additions and 88 deletions

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -13,6 +13,6 @@
<style>@font-face{font-family:Roboto;src:url(Roboto-Thin.f7a95c9c5999532c.woff2) format("woff2"),url(Roboto-Thin.c13c157cb81e8ebb.woff) format("woff");font-weight:100;font-style:normal}@font-face{font-family:Roboto;src:url(Roboto-ThinItalic.b0e084abf689f393.woff2) format("woff2"),url(Roboto-ThinItalic.1111028df6cea564.woff) format("woff");font-weight:100;font-style:italic}@font-face{font-family:Roboto;src:url(Roboto-Light.0e01b6cd13b3857f.woff2) format("woff2"),url(Roboto-Light.603ca9a537b88428.woff) format("woff");font-weight:300;font-style:normal}@font-face{font-family:Roboto;src:url(Roboto-LightItalic.232ef4b20215f720.woff2) format("woff2"),url(Roboto-LightItalic.1b5e142f787151c8.woff) format("woff");font-weight:300;font-style:italic}@font-face{font-family:Roboto;src:url(Roboto-Regular.475ba9e4e2d63456.woff2) format("woff2"),url(Roboto-Regular.bcefbfee882bc1cb.woff) format("woff");font-weight:400;font-style:normal}@font-face{font-family:Roboto;src:url(Roboto-RegularItalic.e3a9ebdaac06bbc4.woff2) format("woff2"),url(Roboto-RegularItalic.0668fae6af0cf8c2.woff) format("woff");font-weight:400;font-style:italic}@font-face{font-family:Roboto;src:url(Roboto-Medium.457532032ceb0168.woff2) format("woff2"),url(Roboto-Medium.6e1ae5f0b324a0aa.woff) format("woff");font-weight:500;font-style:normal}@font-face{font-family:Roboto;src:url(Roboto-MediumItalic.872f7060602d55d2.woff2) format("woff2"),url(Roboto-MediumItalic.e06fb533801cbb08.woff) format("woff");font-weight:500;font-style:italic}@font-face{font-family:Roboto;src:url(Roboto-Bold.447291a88c067396.woff2) format("woff2"),url(Roboto-Bold.fc482e6133cf5e26.woff) format("woff");font-weight:700;font-style:normal}@font-face{font-family:Roboto;src:url(Roboto-BoldItalic.1b15168ef6fa4e16.woff2) format("woff2"),url(Roboto-BoldItalic.e26ba339b06f09f7.woff) format("woff");font-weight:700;font-style:italic}@font-face{font-family:Roboto;src:url(Roboto-Black.2eaa390d458c877d.woff2) format("woff2"),url(Roboto-Black.b25f67ad8583da68.woff) format("woff");font-weight:900;font-style:normal}@font-face{font-family:Roboto;src:url(Roboto-BlackItalic.7dc03ee444552bc5.woff2) format("woff2"),url(Roboto-BlackItalic.c8dc642467cb3099.woff) format("woff");font-weight:900;font-style:italic}html{width:100%;height:99%;line-height:1.5;overflow-x:hidden;font-family:Roboto,sans-serif!important;font-size:62.5%}body{box-sizing:border-box;height:100%;margin:0;overflow:hidden}*{margin:0;padding:0}</style><link rel="stylesheet" href="styles.69c13e4ff8bfa4b7.css" media="print" onload="this.media='all'"><noscript><link rel="stylesheet" href="styles.69c13e4ff8bfa4b7.css"></noscript></head>
<body>
<rtl-app></rtl-app>
<script src="runtime.a3e0452578fd4fec.js" type="module"></script><script src="polyfills.eddc63f1737a019a.js" type="module"></script><script src="main.a9488408a2641397.js" type="module"></script>
<script src="runtime.e64b83d859f326a5.js" type="module"></script><script src="polyfills.eddc63f1737a019a.js" type="module"></script><script src="main.0a55c8dd5a642e6b.js" type="module"></script>
</body></html>

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -1 +1 @@
(()=>{"use strict";var e,v={},g={};function r(e){var n=g[e];if(void 0!==n)return n.exports;var t=g[e]={id:e,loaded:!1,exports:{}};return v[e].call(t.exports,t,t.exports,r),t.loaded=!0,t.exports}r.m=v,e=[],r.O=(n,t,f,o)=>{if(!t){var a=1/0;for(i=0;i<e.length;i++){for(var[t,f,o]=e[i],c=!0,u=0;u<t.length;u++)(!1&o||a>=o)&&Object.keys(r.O).every(b=>r.O[b](t[u]))?t.splice(u--,1):(c=!1,o<a&&(a=o));if(c){e.splice(i--,1);var d=f();void 0!==d&&(n=d)}}return n}o=o||0;for(var i=e.length;i>0&&e[i-1][2]>o;i--)e[i]=e[i-1];e[i]=[t,f,o]},r.n=e=>{var n=e&&e.__esModule?()=>e.default:()=>e;return r.d(n,{a:n}),n},r.d=(e,n)=>{for(var t in n)r.o(n,t)&&!r.o(e,t)&&Object.defineProperty(e,t,{enumerable:!0,get:n[t]})},r.f={},r.e=e=>Promise.all(Object.keys(r.f).reduce((n,t)=>(r.f[t](e,n),n),[])),r.u=e=>e+"."+{258:"3cf9b0cb4862ef4b",267:"3d3321f628b40339",564:"cf897430699020f5",636:"d009e280d384322f"}[e]+".js",r.miniCssF=e=>{},r.o=(e,n)=>Object.prototype.hasOwnProperty.call(e,n),(()=>{var e={},n="RTLApp:";r.l=(t,f,o,i)=>{if(e[t])e[t].push(f);else{var a,c;if(void 0!==o)for(var u=document.getElementsByTagName("script"),d=0;d<u.length;d++){var l=u[d];if(l.getAttribute("src")==t||l.getAttribute("data-webpack")==n+o){a=l;break}}a||(c=!0,(a=document.createElement("script")).type="module",a.charset="utf-8",a.timeout=120,r.nc&&a.setAttribute("nonce",r.nc),a.setAttribute("data-webpack",n+o),a.src=r.tu(t)),e[t]=[f];var s=(m,b)=>{a.onerror=a.onload=null,clearTimeout(p);var h=e[t];if(delete e[t],a.parentNode&&a.parentNode.removeChild(a),h&&h.forEach(_=>_(b)),m)return m(b)},p=setTimeout(s.bind(null,void 0,{type:"timeout",target:a}),12e4);a.onerror=s.bind(null,a.onerror),a.onload=s.bind(null,a.onload),c&&document.head.appendChild(a)}}})(),r.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},r.nmd=e=>(e.paths=[],e.children||(e.children=[]),e),(()=>{var e;r.tt=()=>(void 0===e&&(e={createScriptURL:n=>n},"undefined"!=typeof trustedTypes&&trustedTypes.createPolicy&&(e=trustedTypes.createPolicy("angular#bundler",e))),e)})(),r.tu=e=>r.tt().createScriptURL(e),r.p="",(()=>{var e={666:0};r.f.j=(f,o)=>{var i=r.o(e,f)?e[f]:void 0;if(0!==i)if(i)o.push(i[2]);else if(666!=f){var a=new Promise((l,s)=>i=e[f]=[l,s]);o.push(i[2]=a);var c=r.p+r.u(f),u=new Error;r.l(c,l=>{if(r.o(e,f)&&(0!==(i=e[f])&&(e[f]=void 0),i)){var s=l&&("load"===l.type?"missing":l.type),p=l&&l.target&&l.target.src;u.message="Loading chunk "+f+" failed.\n("+s+": "+p+")",u.name="ChunkLoadError",u.type=s,u.request=p,i[1](u)}},"chunk-"+f,f)}else e[f]=0},r.O.j=f=>0===e[f];var n=(f,o)=>{var u,d,[i,a,c]=o,l=0;if(i.some(p=>0!==e[p])){for(u in a)r.o(a,u)&&(r.m[u]=a[u]);if(c)var s=c(r)}for(f&&f(o);l<i.length;l++)r.o(e,d=i[l])&&e[d]&&e[d][0](),e[d]=0;return r.O(s)},t=self.webpackChunkRTLApp=self.webpackChunkRTLApp||[];t.forEach(n.bind(null,0)),t.push=n.bind(null,t.push.bind(t))})()})();
(()=>{"use strict";var e,v={},g={};function r(e){var n=g[e];if(void 0!==n)return n.exports;var t=g[e]={id:e,loaded:!1,exports:{}};return v[e].call(t.exports,t,t.exports,r),t.loaded=!0,t.exports}r.m=v,e=[],r.O=(n,t,f,o)=>{if(!t){var a=1/0;for(i=0;i<e.length;i++){for(var[t,f,o]=e[i],s=!0,d=0;d<t.length;d++)(!1&o||a>=o)&&Object.keys(r.O).every(b=>r.O[b](t[d]))?t.splice(d--,1):(s=!1,o<a&&(a=o));if(s){e.splice(i--,1);var l=f();void 0!==l&&(n=l)}}return n}o=o||0;for(var i=e.length;i>0&&e[i-1][2]>o;i--)e[i]=e[i-1];e[i]=[t,f,o]},r.n=e=>{var n=e&&e.__esModule?()=>e.default:()=>e;return r.d(n,{a:n}),n},r.d=(e,n)=>{for(var t in n)r.o(n,t)&&!r.o(e,t)&&Object.defineProperty(e,t,{enumerable:!0,get:n[t]})},r.f={},r.e=e=>Promise.all(Object.keys(r.f).reduce((n,t)=>(r.f[t](e,n),n),[])),r.u=e=>e+"."+{258:"135c40e60824bcb3",267:"3d3321f628b40339",564:"cf897430699020f5",636:"d009e280d384322f"}[e]+".js",r.miniCssF=e=>{},r.o=(e,n)=>Object.prototype.hasOwnProperty.call(e,n),(()=>{var e={},n="RTLApp:";r.l=(t,f,o,i)=>{if(e[t])e[t].push(f);else{var a,s;if(void 0!==o)for(var d=document.getElementsByTagName("script"),l=0;l<d.length;l++){var u=d[l];if(u.getAttribute("src")==t||u.getAttribute("data-webpack")==n+o){a=u;break}}a||(s=!0,(a=document.createElement("script")).type="module",a.charset="utf-8",a.timeout=120,r.nc&&a.setAttribute("nonce",r.nc),a.setAttribute("data-webpack",n+o),a.src=r.tu(t)),e[t]=[f];var c=(m,b)=>{a.onerror=a.onload=null,clearTimeout(p);var h=e[t];if(delete e[t],a.parentNode&&a.parentNode.removeChild(a),h&&h.forEach(_=>_(b)),m)return m(b)},p=setTimeout(c.bind(null,void 0,{type:"timeout",target:a}),12e4);a.onerror=c.bind(null,a.onerror),a.onload=c.bind(null,a.onload),s&&document.head.appendChild(a)}}})(),r.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},r.nmd=e=>(e.paths=[],e.children||(e.children=[]),e),(()=>{var e;r.tt=()=>(void 0===e&&(e={createScriptURL:n=>n},"undefined"!=typeof trustedTypes&&trustedTypes.createPolicy&&(e=trustedTypes.createPolicy("angular#bundler",e))),e)})(),r.tu=e=>r.tt().createScriptURL(e),r.p="",(()=>{var e={666:0};r.f.j=(f,o)=>{var i=r.o(e,f)?e[f]:void 0;if(0!==i)if(i)o.push(i[2]);else if(666!=f){var a=new Promise((u,c)=>i=e[f]=[u,c]);o.push(i[2]=a);var s=r.p+r.u(f),d=new Error;r.l(s,u=>{if(r.o(e,f)&&(0!==(i=e[f])&&(e[f]=void 0),i)){var c=u&&("load"===u.type?"missing":u.type),p=u&&u.target&&u.target.src;d.message="Loading chunk "+f+" failed.\n("+c+": "+p+")",d.name="ChunkLoadError",d.type=c,d.request=p,i[1](d)}},"chunk-"+f,f)}else e[f]=0},r.O.j=f=>0===e[f];var n=(f,o)=>{var d,l,[i,a,s]=o,u=0;if(i.some(p=>0!==e[p])){for(d in a)r.o(a,d)&&(r.m[d]=a[d]);if(s)var c=s(r)}for(f&&f(o);u<i.length;u++)r.o(e,l=i[u])&&e[l]&&e[l][0](),e[l]=0;return r.O(c)},t=self.webpackChunkRTLApp=self.webpackChunkRTLApp||[];t.forEach(n.bind(null,0)),t.push=n.bind(null,t.push.bind(t))})()})();

View File

@ -35,7 +35,11 @@
</ng-container>
<ng-container matColumnDef="address">
<th mat-header-cell *matHeaderCellDef mat-sort-header> Address </th>
<td mat-cell *matCellDef="let transaction">{{transaction?.address}}</td>
<td mat-cell *matCellDef="let transaction">
<div class="ellipsis-parent" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '25rem'}">
<span class="ellipsis-child">{{transaction?.address}}</span>
</div>
</td>
</ng-container>
<ng-container matColumnDef="blockHash">
<th mat-header-cell *matHeaderCellDef mat-sort-header> Blockhash </th>

View File

@ -1,4 +1,4 @@
.mat-column-blockHash, .mat-column-txid {
.mat-column-blockHash, .mat-column-txid, .mat-column-address {
flex: 0 0 15%;
width: 15%;
& .ellipsis-parent {

View File

@ -65,15 +65,10 @@
<td mat-cell *matCellDef="let channel"><span fxLayoutAlign="end center">
{{channel?.toRemote | number:'1.0-0'}} </span></td>
</ng-container>
<ng-container matColumnDef="feeRatePerKwLocal">
<ng-container matColumnDef="feeRatePerKw">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before"> Local Fee/KW</th>
<td mat-cell *matCellDef="let channel"><span fxLayoutAlign="end center">
{{channel?.feeRatePerKwLocal | number:'1.0-0'}} </span></td>
</ng-container>
<ng-container matColumnDef="feeRatePerKwRemote">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before"> Remote Fee/KW </th>
<td mat-cell *matCellDef="let channel"><span fxLayoutAlign="end center">
{{channel?.feeRatePerKwRemote | number:'1.0-0'}} </span></td>
{{channel?.feeRatePerKw | number:'1.0-0'}} </span></td>
</ng-container>
<ng-container matColumnDef="balancedness">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-3">Balance Score </th>

View File

@ -71,15 +71,10 @@
<td mat-cell *matCellDef="let channel"><span fxLayoutAlign="end center">
{{channel?.toRemote | number:'1.0-0'}} </span></td>
</ng-container>
<ng-container matColumnDef="feeRatePerKwLocal">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before"> Local Fee/KW</th>
<ng-container matColumnDef="feeRatePerKw">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Fee/KW</th>
<td mat-cell *matCellDef="let channel"><span fxLayoutAlign="end center">
{{channel?.feeRatePerKwLocal | number:'1.0-0'}} </span></td>
</ng-container>
<ng-container matColumnDef="feeRatePerKwRemote">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before"> Remote Fee/KW </th>
<td mat-cell *matCellDef="let channel"><span fxLayoutAlign="end center">
{{channel?.feeRatePerKwRemote | number:'1.0-0'}} </span></td>
{{channel?.feeRatePerKw | number:'1.0-0'}} </span></td>
</ng-container>
<ng-container matColumnDef="balancedness">
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-3">Balance Score </th>

View File

@ -8,14 +8,17 @@
<div [perfectScrollbar] fxLayout="column" fxLayoutAlign="start center" fxFlex="100" class="table-container">
<mat-progress-bar *ngIf="apiCallStatus.status === apiCallStatusEnum.INITIATED" mode="indeterminate"></mat-progress-bar>
<table mat-table #table fxFlex="100" [dataSource]="channels" matSort [ngClass]="{'overflow-auto error-border': errorMessage !== '','overflow-auto': true}">
<ng-container matColumnDef="announceChannel">
<th mat-header-cell *matHeaderCellDef mat-sort-header></th>
<td mat-cell *matCellDef="let channel">
<span *ngIf="!channel?.announceChannel" class="mr-1" matTooltip="Private" matTooltipPosition="right"><fa-icon [icon]="faEyeSlash"></fa-icon></span>
<span *ngIf="channel?.announceChannel" class="mr-1" matTooltip="Public" matTooltipPosition="right"><fa-icon [icon]="faEye"></fa-icon></span>
</td>
</ng-container>
<ng-container matColumnDef="state">
<th mat-header-cell *matHeaderCellDef mat-sort-header> State </th>
<td mat-cell *matCellDef="let channel"> {{channel?.state | titlecase}}</td>
</ng-container>
<ng-container matColumnDef="shortChannelId">
<th mat-header-cell *matHeaderCellDef mat-sort-header> Short Channel ID </th>
<td mat-cell *matCellDef="let channel">{{channel?.shortChannelId}}</td>
</ng-container>
<ng-container matColumnDef="channelId">
<th mat-header-cell *matHeaderCellDef mat-sort-header> Channel Id </th>
<td mat-cell *matCellDef="let channel">
@ -54,15 +57,10 @@
<td mat-cell *matCellDef="let channel"><span fxLayoutAlign="end center">
{{channel?.toRemote | number:'1.0-0'}} </span></td>
</ng-container>
<ng-container matColumnDef="feeRatePerKwLocal">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before"> Local Fee/KW</th>
<ng-container matColumnDef="feeRatePerKw">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before"> Fee/KW</th>
<td mat-cell *matCellDef="let channel"><span fxLayoutAlign="end center">
{{channel?.feeRatePerKwLocal | number:'1.0-0'}} </span></td>
</ng-container>
<ng-container matColumnDef="feeRatePerKwRemote">
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before"> Remote Fee/KW </th>
<td mat-cell *matCellDef="let channel"><span fxLayoutAlign="end center">
{{channel?.feeRatePerKwRemote | number:'1.0-0'}} </span></td>
{{channel?.feeRatePerKw | number:'1.0-0'}} </span></td>
</ng-container>
<ng-container matColumnDef="actions">
<th mat-header-cell *matHeaderCellDef class="pl-1">

View File

@ -1,3 +1,7 @@
.mat-column-announceChannel {
width: 2rem;
}
.mat-column-alias, .mat-column-channelId, .mat-column-nodeId {
flex: 0 0 15%;
width: 15%;

View File

@ -6,6 +6,7 @@ import { Store } from '@ngrx/store';
import { MatPaginator, MatPaginatorIntl } from '@angular/material/paginator';
import { MatSort } from '@angular/material/sort';
import { MatTableDataSource } from '@angular/material/table';
import { faEye, faEyeSlash } from '@fortawesome/free-solid-svg-icons';
import { Channel, ChannelsStatus, GetInfo, LightningBalance, OnChainBalance, Peer } from '../../../../../shared/models/eclModels';
import { PAGE_SIZE, PAGE_SIZE_OPTIONS, getPaginatorLabel, ScreenSizeEnum, FEE_RATE_TYPES, APICallStatusEnum, SortOrderEnum, ECL_DEFAULT_PAGE_SETTINGS } from '../../../../../shared/services/consts-enums-functions';
@ -32,6 +33,8 @@ export class ECLChannelPendingTableComponent implements OnInit, AfterViewInit, O
@ViewChild(MatSort, { static: false }) sort: MatSort | undefined;
@ViewChild(MatPaginator, { static: false }) paginator: MatPaginator | undefined;
public faEye = faEye;
public faEyeSlash = faEyeSlash;
public PAGE_ID = 'peers_channels';
public tableSetting: TableSetting = { tableId: 'pending_channels', recordsPerPage: PAGE_SIZE, sortBy: 'alias', sortOrder: SortOrderEnum.DESCENDING };
public pendingChannels: Channel[];
@ -70,6 +73,7 @@ export class ECLChannelPendingTableComponent implements OnInit, AfterViewInit, O
} else {
this.displayedColumns = JSON.parse(JSON.stringify(this.tableSetting.columnSelection));
}
this.displayedColumns.unshift('announceChannel');
this.displayedColumns.push('actions');
this.pageSize = this.tableSetting.recordsPerPage ? +this.tableSetting.recordsPerPage : PAGE_SIZE;
this.logger.info(this.displayedColumns);

View File

@ -105,10 +105,10 @@
</ng-container>
<!-- Payment Group Row Start -->
<ng-container matColumnDef="groupTotal">
<ng-container matColumnDef="group_firstPartTimestamp">
<td mat-cell *matCellDef="let payment">
<span fxLayoutAlign="start center" class="part-row-span">
Total Attempts: {{payment?.parts?.length}}
Total Attempts: {{payment?.parts?.length || 0}}
</span>
<ng-container *ngIf="payment?.is_expanded">
<span *ngFor="let part of payment?.parts" fxLayoutAlign="start center" class="part-row-span pl-3">
@ -117,7 +117,7 @@
</ng-container>
</td>
</ng-container>
<ng-container matColumnDef="groupId">
<ng-container matColumnDef="group_id">
<td mat-cell *matCellDef="let payment">
<div fxLayoutAlign="start center" class="ellipsis-parent part-row-span" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}">
<span class="ellipsis-child">{{payment?.id}}</span>
@ -128,10 +128,24 @@
<span class="ellipsis-child">{{part.id}}</span>
</span>
</span>
</span>
</span>
</td>
</ng-container>
<ng-container matColumnDef="groupChannelAlias">
<ng-container matColumnDef="group_recipientNodeId">
<td mat-cell *matCellDef="let payment">
<div fxLayoutAlign="start center" class="ellipsis-parent part-row-span" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}">
<span class="ellipsis-child">{{payment?.recipientNodeId}}</span>
</div>
<span *ngIf="payment?.is_expanded">
<span *ngFor="let part of payment?.parts" fxLayoutAlign="start center" class="part-row-span">
<span fxLayoutAlign="start center" class="ellipsis-parent part-row-span" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}">
<span class="ellipsis-child">{{part.toChannelId}}</span>
</span>
</span>
</span>
</td>
</ng-container>
<ng-container matColumnDef="group_recipientNodeAlias">
<td mat-cell *matCellDef="let payment">
<div fxLayoutAlign="start center" class="ellipsis-parent part-row-span" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}">
<span class="ellipsis-child">{{payment?.recipientNodeAlias}}</span>
@ -145,7 +159,7 @@
</span>
</td>
</ng-container>
<ng-container matColumnDef="groupAmount">
<ng-container matColumnDef="group_recipientAmount">
<td mat-cell *matCellDef="let payment">
<span fxLayoutAlign="end center" class="part-row-span">{{payment?.recipientAmount | number:'1.0-0'}}</span>
<span *ngIf="payment?.is_expanded">
@ -155,7 +169,49 @@
</span>
</td>
</ng-container>
<ng-container matColumnDef="groupActions">
<ng-container matColumnDef="group_description">
<td mat-cell *matCellDef="let payment">
<div fxLayoutAlign="start center" class="ellipsis-parent part-row-span" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}">
<span class="ellipsis-child">{{payment?.description}}</span>
</div>
<span *ngIf="payment?.is_expanded">
<span *ngFor="let part of payment?.parts" fxLayoutAlign="start center" class="part-row-span">
<span fxLayoutAlign="start center" class="ellipsis-parent part-row-span" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}">
<span class="ellipsis-child">Fee Paid: {{part.feesPaid | number:'1.0-0'}} (Sats)</span>
</span>
</span>
</span>
</td>
</ng-container>
<ng-container matColumnDef="group_paymentHash">
<td mat-cell *matCellDef="let payment">
<div fxLayoutAlign="start center" class="ellipsis-parent part-row-span" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}">
<span class="ellipsis-child">{{payment?.paymentHash}}</span>
</div>
<span *ngIf="payment?.is_expanded">
<span *ngFor="let part of payment?.parts" fxLayoutAlign="start center" class="part-row-span">
<span fxLayoutAlign="start center" class="ellipsis-parent part-row-span" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}">
<span class="ellipsis-child">Fee Paid: {{part.feesPaid | number:'1.0-0'}} (Sats)</span>
</span>
</span>
</span>
</td>
</ng-container>
<ng-container matColumnDef="group_paymentPreimage">
<td mat-cell *matCellDef="let payment">
<div fxLayoutAlign="start center" class="ellipsis-parent part-row-span" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}">
<span class="ellipsis-child">{{payment?.paymentPreimage}}</span>
</div>
<span *ngIf="payment?.is_expanded">
<span *ngFor="let part of payment?.parts" fxLayoutAlign="start center" class="part-row-span">
<span fxLayoutAlign="start center" class="ellipsis-parent part-row-span" [ngStyle]="{'max-width': (screenSize === screenSizeEnum.XS) ? '10rem' : '20rem'}">
<span class="ellipsis-child">Fee Paid: {{part.feesPaid | number:'1.0-0'}} (Sats)</span>
</span>
</span>
</span>
</td>
</ng-container>
<ng-container matColumnDef="group_actions">
<td mat-cell *matCellDef="let payment" class="px-3">
<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>
@ -170,7 +226,7 @@
<tr mat-row *matRowDef="let row; columns: partColumns; when: is_group;"></tr>
<!-- Payment Group Row End -->
<tr mat-footer-row *matFooterRowDef="['no_payment']" [ngClass]="{'display-none': payments?.data && payments?.data?.length>0}"></tr>
<tr mat-footer-row *matFooterRowDef="['no_payment']" [ngClass]="{'display-none': payments?.data?.length>0}"></tr>
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table>

View File

@ -1,7 +1,10 @@
.mat-column-id, .mat-column-recipientNodeAlias,
.mat-column-recipientNodeId, .mat-column-description,
.mat-column-paymentHash, .mat-column-paymentPreimage,
.mat-column-groupId, .mat-column-groupChannelAlias {
.mat-column-group_id, .mat-column-group_recipientNodeId,
.mat-column-group_recipientNodeAlias, .mat-column-group_recipientAmount,
.mat-column-group_description, .mat-column-group_paymentHash, .mat-column-group_paymentPreimage {
padding-left: 2rem;
flex: 1 1 12%;
width: 12%;
& .ellipsis-parent {
@ -13,16 +16,18 @@
min-height: 4.8rem;
}
.mat-column-groupActions {
.mat-column-group_actions {
min-height: 4.8rem;
& .btn-part-expand {
width: 9rem;
min-width: 10rem;
width: 10rem;
}
& .btn-part-info {
margin-top: 0.5rem;
width: 9rem;
margin-top: 0.5rem;
min-width: 9rem;
width: 9rem;
}
}
@ -30,8 +35,11 @@
min-height: 4.2rem;
place-content: center flex-start;
align-items: center;
&.ellipsis-parent {
display: flex;
}
}
.mat-column-groupTotal {
min-width: 15rem;
.mat-column-group_firstPartTimestamp {
min-width: 17rem;
}

View File

@ -46,7 +46,7 @@ export class ECLLightningPaymentsComponent implements OnInit, AfterViewInit, OnD
public newlyAddedPayment = '';
public selNode: SelNodeChild | null = {};
public information: GetInfo = {};
public payments: any;
public payments: any = new MatTableDataSource<PaymentSent>([]);
public paymentJSONArr: PaymentSent[] = [];
public paymentDecoded: PayRequest = {};
public displayedColumns: any[] = [];
@ -65,15 +65,6 @@ export class ECLLightningPaymentsComponent implements OnInit, AfterViewInit, OnD
constructor(private logger: LoggerService, private commonService: CommonService, private store: Store<RTLState>, private rtlEffects: RTLEffects, private decimalPipe: DecimalPipe, private dataService: DataService, private datePipe: DatePipe) {
this.screenSize = this.commonService.getScreenSize();
// if (this.screenSize === ScreenSizeEnum.XS) {
// this.partColumns = ['groupTotal', 'groupActions'];
// } else if (this.screenSize === ScreenSizeEnum.SM) {
// this.partColumns = ['groupTotal', 'groupAmount', 'groupActions'];
// } else if (this.screenSize === ScreenSizeEnum.MD) {
// this.partColumns = ['groupTotal', 'groupId', 'groupAmount', 'groupActions'];
// } else {
// this.partColumns = ['groupTotal', 'groupId', 'groupChannelAlias', 'groupAmount', 'groupActions'];
// }
}
ngOnInit() {
@ -99,6 +90,8 @@ export class ECLLightningPaymentsComponent implements OnInit, AfterViewInit, OnD
this.displayedColumns = JSON.parse(JSON.stringify(this.tableSetting.columnSelection));
}
this.displayedColumns.push('actions');
this.partColumns = [];
this.displayedColumns.map((col) => this.partColumns.push('group_' + col));
this.pageSize = this.tableSetting.recordsPerPage ? +this.tableSetting.recordsPerPage : PAGE_SIZE;
this.logger.info(this.displayedColumns);
});
@ -110,26 +103,6 @@ export class ECLLightningPaymentsComponent implements OnInit, AfterViewInit, OnD
this.errorMessage = !this.apiCallStatus.message ? '' : (typeof (this.apiCallStatus.message) === 'object') ? JSON.stringify(this.apiCallStatus.message) : this.apiCallStatus.message;
}
this.paymentJSONArr = (paymentsSeletor.payments && paymentsSeletor.payments.sent && paymentsSeletor.payments.sent.length > 0) ? paymentsSeletor.payments.sent : [];
// FOR MPP TESTING START
// If (this.paymentJSONArr.length > 0) {
// This.paymentJSONArr[3].parts.push({
// Id: '34b609a5-f0f1-474e-9e5d-d7783b48702d', amount: 26000, feesPaid: 22, toChannelId: '7e78fa4a27db55df2955fb2be54162d01168744ad45a6539172a6dd6e6139c87', toChannelAlias: 'ion.radar.tech1', timestamp: 1596389827075
// });
// This.paymentJSONArr[3].parts.push({
// Id: '35b609a5-f0f1-474e-9e5d-d7783b48702e', amount: 27000, feesPaid: 20, toChannelId: '7e78fa4a27db55df2955fb2be54162d01168744ad45a6539172a6dd6e6139c86', toChannelAlias: 'ion.radar.tech2', timestamp: 1596389817075
// });
// This.paymentJSONArr[5].parts.push({
// Id: '38b609a5-f0f1-474e-9e5d-d7783b48702h', amount: 31000, feesPaid: 18, toChannelId: '7e78fa4a27db55df2955fb2be54162d01168744ad45a6539172a6dd6e6139c85', toChannelAlias: 'ion.radar.tech3', timestamp: 1596389887075
// });
// This.paymentJSONArr[5].parts.push({
// Id: '36b609a5-f0f1-474e-9e5d-d7783b48702f', amount: 28000, feesPaid: 13, toChannelId: '7e78fa4a27db55df2955fb2be54162d01168744ad45a6539172a6dd6e6139c84', toChannelAlias: 'ion.radar.tech4', timestamp: 1596389687075
// });
// This.paymentJSONArr[5].parts.push({
// Id: '37b609a5-f0f1-474e-9e5d-d7783b48702g', amount: 25000, feesPaid: 19, toChannelId: '7e78fa4a27db55df2955fb2be54162d01168744ad45a6539172a6dd6e6139c83', toChannelAlias: 'ion.radar.tech5', timestamp: 1596389707075
// });
// }
// This.paymentJSONArr = this.paymentJSONArr.splice(2, 5);
// FOR MPP TESTING END
if (this.paymentJSONArr.length > 0 && this.sort && this.paginator) {
this.loadPaymentsTable(this.paymentJSONArr);
}

View File

@ -277,6 +277,8 @@ export interface LocalFailedEvent {
in_channel_alias?: string;
in_msatoshi?: number;
in_msat?: string;
out_channel?: string;
out_channel_alias?: string;
status?: string;
received_time?: number;
resolved_time?: number;

View File

@ -114,8 +114,7 @@ export interface Channel {
isFunder?: boolean;
buried?: boolean;
feeBaseMsat?: number;
feeRatePerKwLocal?: number;
feeRatePerKwRemote?: number;
feeRatePerKw?: number;
feeProportionalMillionths?: number;
balancedness?: number;
}

View File

@ -903,7 +903,7 @@ export const ECL_DEFAULT_PAGE_SETTINGS: PageSettings[] = [
{ tableId: 'payments', recordsPerPage: PAGE_SIZE, sortBy: 'firstPartTimestamp', sortOrder: SortOrderEnum.DESCENDING,
columnSelectionSM: ['firstPartTimestamp', 'recipientAmount'],
columnSelection: ['firstPartTimestamp', 'id', 'recipientNodeAlias', 'recipientAmount'] },
{ tableId: 'invoices', recordsPerPage: PAGE_SIZE, sortBy: 'expiresAt', sortOrder: SortOrderEnum.DESCENDING,
{ tableId: 'invoices', recordsPerPage: PAGE_SIZE, sortBy: 'receivedAt', sortOrder: SortOrderEnum.DESCENDING,
columnSelectionSM: ['timestamp', 'amount', 'amountSettled'],
columnSelection: ['timestamp', 'receivedAt', 'description', 'amount', 'amountSettled'] }
] },
@ -935,15 +935,15 @@ export const ECL_TABLES_DEF = {
peers_channels: {
open_channels: {
maxColumns: 8,
allowedColumns: ['shortChannelId', 'channelId', 'alias', 'nodeId', 'isFunder', 'buried', 'feeBaseMsat', 'feeProportionalMillionths', 'toLocal', 'toRemote', 'feeRatePerKwLocal', 'feeRatePerKwRemote', 'balancedness']
allowedColumns: ['shortChannelId', 'channelId', 'alias', 'nodeId', 'isFunder', 'buried', 'feeBaseMsat', 'feeProportionalMillionths', 'toLocal', 'toRemote', 'feeRatePerKw', 'balancedness']
},
pending_channels: {
maxColumns: 8,
allowedColumns: ['state', 'shortChannelId', 'channelId', 'alias', 'nodeId', 'isFunder', 'buried', 'feeBaseMsat', 'feeProportionalMillionths', 'toLocal', 'toRemote', 'feeRatePerKwLocal', 'feeRatePerKwRemote', 'balancedness']
maxColumns: 7,
allowedColumns: ['state', 'channelId', 'alias', 'nodeId', 'isFunder', 'buried', 'feeBaseMsat', 'feeProportionalMillionths', 'toLocal', 'toRemote', 'feeRatePerKw']
},
inactive_channels: {
maxColumns: 8,
allowedColumns: ['state', 'shortChannelId', 'channelId', 'alias', 'nodeId', 'isFunder', 'buried', 'feeBaseMsat', 'feeProportionalMillionths', 'toLocal', 'toRemote', 'feeRatePerKwLocal', 'feeRatePerKwRemote', 'balancedness']
allowedColumns: ['state', 'shortChannelId', 'channelId', 'alias', 'nodeId', 'isFunder', 'buried', 'feeBaseMsat', 'feeProportionalMillionths', 'toLocal', 'toRemote', 'feeRatePerKw']
},
peers: {
maxColumns: 4,
@ -953,7 +953,7 @@ export const ECL_TABLES_DEF = {
transactions: {
payments: {
maxColumns: 7,
allowedColumns: ['firstPartTimestamp', 'id', 'recipientNodeId', 'recipientNodeAlias', 'recipientAmount', 'description', 'paymentHash', 'paymentPreimage']
allowedColumns: ['firstPartTimestamp', 'id', 'recipientNodeId', 'recipientNodeAlias', 'description', 'paymentHash', 'paymentPreimage', 'recipientAmount']
},
invoices: {
maxColumns: 7,
@ -963,7 +963,7 @@ export const ECL_TABLES_DEF = {
routing: {
forwarding_history: {
maxColumns: 7,
allowedColumns: ['timestamp', 'fromChannelId', 'fromShortChannelId', 'fromChannelAlias', 'toChannelId', 'toShortChannelId', 'toChannelAlias', 'amountIn', 'amountOut', 'fee', 'paymentHash']
allowedColumns: ['timestamp', 'fromChannelId', 'fromShortChannelId', 'fromChannelAlias', 'toChannelId', 'toShortChannelId', 'toChannelAlias', 'paymentHash', 'amountIn', 'amountOut', 'fee']
},
routing_peers: {
maxColumns: 5,
@ -973,7 +973,7 @@ export const ECL_TABLES_DEF = {
reports: {
routing: {
maxColumns: 7,
allowedColumns: ['timestamp', 'fromChannelId', 'fromShortChannelId', 'fromChannelAlias', 'toChannelId', 'toShortChannelId', 'toChannelAlias', 'amountIn', 'amountOut', 'fee', 'paymentHash']
allowedColumns: ['timestamp', 'fromChannelId', 'fromShortChannelId', 'fromChannelAlias', 'toChannelId', 'toShortChannelId', 'toChannelAlias', 'paymentHash', 'amountIn', 'amountOut', 'fee']
},
transactions: {
maxColumns: 5,