mirror of
https://github.com/Ride-The-Lightning/RTL.git
synced 2024-11-19 09:50:36 +01:00
UX fixes
UX fixes
This commit is contained in:
Shahana Farooqui
parent
893d5e5c30
commit
1092db21a0
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
1
angular/7.cbb064eabe7f028412c2.js
Normal file
1
angular/7.cbb064eabe7f028412c2.js
Normal file
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -9,8 +9,8 @@
|
||||
<link rel="icon" type="image/png" sizes="32x32" href="assets/images/favicon/favicon-32x32.png">
|
||||
<link rel="icon" type="image/png" sizes="16x16" href="assets/images/favicon/favicon-16x16.png">
|
||||
<link rel="manifest" href="assets/images/favicon/site.webmanifest">
|
||||
<link rel="stylesheet" href="styles.eada08346e92ee5fb050.css"></head>
|
||||
<link rel="stylesheet" href="styles.b99c718d4d27fdf4c414.css"></head>
|
||||
<body>
|
||||
<rtl-app></rtl-app>
|
||||
<script src="runtime.565b0291008b32f52746.js" defer></script><script src="polyfills-es5.b8e32dec482ae69710a2.js" nomodule defer></script><script src="polyfills.ebf9033c33aa4a5af12a.js" defer></script><script src="main.5ee3e0bcee6a426b2412.js" defer></script></body>
|
||||
<script src="runtime.92f94c9cf2c2cf371c41.js" defer></script><script src="polyfills-es5.b8e32dec482ae69710a2.js" nomodule defer></script><script src="polyfills.ebf9033c33aa4a5af12a.js" defer></script><script src="main.7966aa0a302b936d3da3.js" defer></script></body>
|
||||
</html>
|
||||
|
||||
File diff suppressed because one or more lines are too long
1
angular/main.7966aa0a302b936d3da3.js
Normal file
1
angular/main.7966aa0a302b936d3da3.js
Normal file
File diff suppressed because one or more lines are too long
@ -1 +1 @@
|
||||
!function(e){function r(r){for(var n,a,i=r[0],c=r[1],f=r[2],p=0,s=[];p<i.length;p++)a=i[p],Object.prototype.hasOwnProperty.call(o,a)&&o[a]&&s.push(o[a][0]),o[a]=0;for(n in c)Object.prototype.hasOwnProperty.call(c,n)&&(e[n]=c[n]);for(l&&l(r);s.length;)s.shift()();return u.push.apply(u,f||[]),t()}function t(){for(var e,r=0;r<u.length;r++){for(var t=u[r],n=!0,i=1;i<t.length;i++)0!==o[t[i]]&&(n=!1);n&&(u.splice(r--,1),e=a(a.s=t[0]))}return e}var n={},o={0:0},u=[];function a(r){if(n[r])return n[r].exports;var t=n[r]={i:r,l:!1,exports:{}};return e[r].call(t.exports,t,t.exports,a),t.l=!0,t.exports}a.e=function(e){var r=[],t=o[e];if(0!==t)if(t)r.push(t[2]);else{var n=new Promise((function(r,n){t=o[e]=[r,n]}));r.push(t[2]=n);var u,i=document.createElement("script");i.charset="utf-8",i.timeout=120,a.nc&&i.setAttribute("nonce",a.nc),i.src=function(e){return a.p+""+({}[e]||e)+"."+{1:"df8a42ae5fabe34ad893",6:"ce201f8313431c83a606",7:"f0a3f44d200d9238d4bc"}[e]+".js"}(e);var c=new Error;u=function(r){i.onerror=i.onload=null,clearTimeout(f);var t=o[e];if(0!==t){if(t){var n=r&&("load"===r.type?"missing":r.type),u=r&&r.target&&r.target.src;c.message="Loading chunk "+e+" failed.\n("+n+": "+u+")",c.name="ChunkLoadError",c.type=n,c.request=u,t[1](c)}o[e]=void 0}};var f=setTimeout((function(){u({type:"timeout",target:i})}),12e4);i.onerror=i.onload=u,document.head.appendChild(i)}return Promise.all(r)},a.m=e,a.c=n,a.d=function(e,r,t){a.o(e,r)||Object.defineProperty(e,r,{enumerable:!0,get:t})},a.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},a.t=function(e,r){if(1&r&&(e=a(e)),8&r)return e;if(4&r&&"object"==typeof e&&e&&e.__esModule)return e;var t=Object.create(null);if(a.r(t),Object.defineProperty(t,"default",{enumerable:!0,value:e}),2&r&&"string"!=typeof e)for(var n in e)a.d(t,n,(function(r){return e[r]}).bind(null,n));return t},a.n=function(e){var r=e&&e.__esModule?function(){return e.default}:function(){return e};return a.d(r,"a",r),r},a.o=function(e,r){return Object.prototype.hasOwnProperty.call(e,r)},a.p="",a.oe=function(e){throw console.error(e),e};var i=window.webpackJsonp=window.webpackJsonp||[],c=i.push.bind(i);i.push=r,i=i.slice();for(var f=0;f<i.length;f++)r(i[f]);var l=c;t()}([]);
|
||||
!function(e){function r(r){for(var n,a,i=r[0],c=r[1],l=r[2],p=0,s=[];p<i.length;p++)a=i[p],Object.prototype.hasOwnProperty.call(o,a)&&o[a]&&s.push(o[a][0]),o[a]=0;for(n in c)Object.prototype.hasOwnProperty.call(c,n)&&(e[n]=c[n]);for(f&&f(r);s.length;)s.shift()();return u.push.apply(u,l||[]),t()}function t(){for(var e,r=0;r<u.length;r++){for(var t=u[r],n=!0,i=1;i<t.length;i++)0!==o[t[i]]&&(n=!1);n&&(u.splice(r--,1),e=a(a.s=t[0]))}return e}var n={},o={0:0},u=[];function a(r){if(n[r])return n[r].exports;var t=n[r]={i:r,l:!1,exports:{}};return e[r].call(t.exports,t,t.exports,a),t.l=!0,t.exports}a.e=function(e){var r=[],t=o[e];if(0!==t)if(t)r.push(t[2]);else{var n=new Promise((function(r,n){t=o[e]=[r,n]}));r.push(t[2]=n);var u,i=document.createElement("script");i.charset="utf-8",i.timeout=120,a.nc&&i.setAttribute("nonce",a.nc),i.src=function(e){return a.p+""+({}[e]||e)+"."+{1:"3de0a26964d460363d96",6:"42170a37bd5aeec6fdbd",7:"cbb064eabe7f028412c2"}[e]+".js"}(e);var c=new Error;u=function(r){i.onerror=i.onload=null,clearTimeout(l);var t=o[e];if(0!==t){if(t){var n=r&&("load"===r.type?"missing":r.type),u=r&&r.target&&r.target.src;c.message="Loading chunk "+e+" failed.\n("+n+": "+u+")",c.name="ChunkLoadError",c.type=n,c.request=u,t[1](c)}o[e]=void 0}};var l=setTimeout((function(){u({type:"timeout",target:i})}),12e4);i.onerror=i.onload=u,document.head.appendChild(i)}return Promise.all(r)},a.m=e,a.c=n,a.d=function(e,r,t){a.o(e,r)||Object.defineProperty(e,r,{enumerable:!0,get:t})},a.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},a.t=function(e,r){if(1&r&&(e=a(e)),8&r)return e;if(4&r&&"object"==typeof e&&e&&e.__esModule)return e;var t=Object.create(null);if(a.r(t),Object.defineProperty(t,"default",{enumerable:!0,value:e}),2&r&&"string"!=typeof e)for(var n in e)a.d(t,n,(function(r){return e[r]}).bind(null,n));return t},a.n=function(e){var r=e&&e.__esModule?function(){return e.default}:function(){return e};return a.d(r,"a",r),r},a.o=function(e,r){return Object.prototype.hasOwnProperty.call(e,r)},a.p="",a.oe=function(e){throw console.error(e),e};var i=window.webpackJsonp=window.webpackJsonp||[],c=i.push.bind(i);i.push=r,i=i.slice();for(var l=0;l<i.length;l++)r(i[l]);var f=c;t()}([]);
|
||||
1
angular/styles.b99c718d4d27fdf4c414.css
Normal file
1
angular/styles.b99c718d4d27fdf4c414.css
Normal file
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -113,15 +113,15 @@ exports.updateUISettings = (req, res, next) => {
|
||||
config.nodes.find(node => {
|
||||
if(node.index == common.selectedNode.index) {
|
||||
node.Settings.userPersona = req.body.updatedSettings.userPersona;
|
||||
node.Settings.flgSidenavOpened = req.body.updatedSettings.flgSidenavOpened;
|
||||
node.Settings.flgSidenavPinned = req.body.updatedSettings.flgSidenavPinned;
|
||||
node.Settings.menu = req.body.updatedSettings.menu;
|
||||
node.Settings.menuType = req.body.updatedSettings.menuType;
|
||||
node.Settings.fontSize = req.body.updatedSettings.fontSize;
|
||||
node.Settings.themeMode = req.body.updatedSettings.themeMode;
|
||||
node.Settings.themeColor = req.body.updatedSettings.themeColor;
|
||||
node.Settings.satsToBTC = req.body.updatedSettings.satsToBTC;
|
||||
node.Settings.currencyUnit = req.body.updatedSettings.currencyUnit;
|
||||
node.Settings.flgSidenavOpened = true; // req.body.updatedSettings.flgSidenavOpened;
|
||||
node.Settings.flgSidenavPinned = true; // req.body.updatedSettings.flgSidenavPinned;
|
||||
node.Settings.menu = 'vertical'; // req.body.updatedSettings.menu;
|
||||
node.Settings.menuType = 'regular'; // req.body.updatedSettings.menuType;
|
||||
node.Settings.fontSize = 'regular-font'; // req.body.updatedSettings.fontSize;
|
||||
node.Settings.satsToBTC = false; // req.body.updatedSettings.satsToBTC;
|
||||
}
|
||||
});
|
||||
try {
|
||||
@ -141,15 +141,15 @@ exports.updateUISettings = (req, res, next) => {
|
||||
var config = ini.parse(fs.readFileSync(RTLConfFile, 'utf-8'));
|
||||
const settingsTemp = config.Settings;
|
||||
settingsTemp.userPersona = req.body.updatedSettings.userPersona;
|
||||
settingsTemp.flgSidenavOpened = req.body.updatedSettings.flgSidenavOpened;
|
||||
settingsTemp.flgSidenavPinned = req.body.updatedSettings.flgSidenavPinned;
|
||||
settingsTemp.menu = req.body.updatedSettings.menu;
|
||||
settingsTemp.menuType = req.body.updatedSettings.menuType;
|
||||
settingsTemp.fontSize = req.body.updatedSettings.fontSize;
|
||||
settingsTemp.themeMode = req.body.updatedSettings.themeMode;
|
||||
settingsTemp.themeColor = req.body.updatedSettings.themeColor;
|
||||
settingsTemp.satsToBTC = req.body.updatedSettings.satsToBTC;
|
||||
settingsTemp.currencyUnit = req.body.updatedSettings.currencyUnit;
|
||||
settingsTemp.flgSidenavOpened = true; // req.body.updatedSettings.flgSidenavOpened;
|
||||
settingsTemp.flgSidenavPinned = true; // req.body.updatedSettings.flgSidenavPinned;
|
||||
settingsTemp.menu = 'vertical'; // req.body.updatedSettings.menu;
|
||||
settingsTemp.menuType = 'regular'; // req.body.updatedSettings.menuType;
|
||||
settingsTemp.fontSize = 'regular-font'; // req.body.updatedSettings.fontSize;
|
||||
settingsTemp.satsToBTC = false; // req.body.updatedSettings.satsToBTC;
|
||||
delete config.Settings;
|
||||
fs.writeFileSync(RTLConfFile, ini.stringify(config));
|
||||
fs.appendFile(RTLConfFile, ini.stringify(settingsTemp, { section: 'Settings' }), function(err) {
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
<div fxLayout="column" id="rtl-container" class="rtl-container" [ngClass]="[settings.themeColor, settings.themeMode, settings.fontSize]" [class.horizontal]="settings.menu === 'horizontal'" [class.compact]="settings.menuType === 'compact'" [class.mini]="settings.menuType === 'mini'">
|
||||
<mat-toolbar fxLayout="row" fxLayoutAlign="space-between center" class="padding-gap-x bg-primary rtl-top-toolbar" *ngIf="settings.menu === 'vertical'">
|
||||
<div fxLayoutAlign="center center">
|
||||
<div>
|
||||
<button *ngIf="settings.menu === 'vertical'" class="top-toolbar-icon" mat-icon-button (click)="sideNavToggle()">
|
||||
<mat-icon class="mr-5px">menu</mat-icon>
|
||||
</button>
|
||||
@ -23,7 +23,11 @@
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
<div fxLayoutAlign="space-between center">
|
||||
<div>
|
||||
<span *ngIf="xSmallScreen">RTL</span>
|
||||
<span *ngIf="!xSmallScreen">Ride The Lightning</span>
|
||||
</div>
|
||||
<div>
|
||||
<rtl-top-menu></rtl-top-menu>
|
||||
</div>
|
||||
</mat-toolbar>
|
||||
|
||||
@ -32,6 +32,7 @@ export class AppComponent implements OnInit, AfterViewInit, OnDestroy {
|
||||
public flgCopied = false;
|
||||
public appConfig: RTLConfiguration;
|
||||
public accessKey = '';
|
||||
public xSmallScreen = false;
|
||||
public smallScreen = false;
|
||||
unSubs: Array<Subject<void>> = [new Subject(), new Subject(), new Subject(), new Subject(), new Subject(), new Subject()];
|
||||
|
||||
@ -44,15 +45,19 @@ export class AppComponent implements OnInit, AfterViewInit, OnDestroy {
|
||||
.subscribe((matches) => {
|
||||
if(matches.breakpoints[Breakpoints.XSmall]) {
|
||||
this.commonService.setScreenSize(ScreenSizeEnum.XS);
|
||||
this.xSmallScreen = true;
|
||||
this.smallScreen = true;
|
||||
} else if(matches.breakpoints[Breakpoints.TabletPortrait]) {
|
||||
this.commonService.setScreenSize(ScreenSizeEnum.SM);
|
||||
this.xSmallScreen = false;
|
||||
this.smallScreen = true;
|
||||
} else if(matches.breakpoints[Breakpoints.Small] || matches.breakpoints[Breakpoints.Medium]) {
|
||||
this.commonService.setScreenSize(ScreenSizeEnum.MD);
|
||||
this.xSmallScreen = false;
|
||||
this.smallScreen = false;
|
||||
} else {
|
||||
this.commonService.setScreenSize(ScreenSizeEnum.LG);
|
||||
this.xSmallScreen = false;
|
||||
this.smallScreen = false;
|
||||
}
|
||||
});
|
||||
|
||||
@ -1,11 +1,11 @@
|
||||
<div fxLayout="column">
|
||||
<div fxLayout="column" fxLayoutAlign="space-between stretch" fxLayout.gt-sm="row wrap">
|
||||
<div fxFlex="100" class="alert alert-warn">
|
||||
<fa-icon [icon]="faExclamationTriangle" class="mr-1"></fa-icon>
|
||||
<fa-icon [icon]="faExclamationTriangle" class="mr-1 alert-icon"></fa-icon>
|
||||
<span>Save your backup files in a redundant location.</span>
|
||||
</div>
|
||||
<div fxFlex="100" class="alert alert-info">
|
||||
<fa-icon [icon]="faServer" class="mr-1"></fa-icon>
|
||||
<fa-icon [icon]="faInfoCircle" class="mr-1 alert-icon"></fa-icon>
|
||||
<span><strong>Backup Folder Location: </strong>{{selNode.channelBackupPath}}.</span>
|
||||
</div>
|
||||
<div fxLayout="row" fxFlex="100" fxFlex.gt-sm="30" fxLayoutAlign="space-between stretch" class="mt-2">
|
||||
|
||||
@ -3,7 +3,7 @@ import { Subject } from 'rxjs';
|
||||
import { takeUntil, filter } from 'rxjs/operators';
|
||||
import { Store } from '@ngrx/store';
|
||||
import { Actions } from '@ngrx/effects';
|
||||
import { faServer, faExclamationTriangle, faArchive } from '@fortawesome/free-solid-svg-icons';
|
||||
import { faInfoCircle, faExclamationTriangle, faArchive } from '@fortawesome/free-solid-svg-icons';
|
||||
|
||||
import { MatTableDataSource, MatSort, MatPaginator, MatPaginatorIntl } from '@angular/material';
|
||||
import { SelNodeChild } from '../../../shared/models/RTLconfig';
|
||||
@ -26,7 +26,7 @@ import * as fromRTLReducer from '../../../store/rtl.reducers';
|
||||
export class ChannelBackupTableComponent implements OnInit, OnDestroy {
|
||||
@ViewChild(MatSort, { static: true }) sort: MatSort;
|
||||
@ViewChild(MatPaginator, {static: true}) paginator: MatPaginator;
|
||||
public faServer = faServer;
|
||||
public faInfoCircle = faInfoCircle;
|
||||
public faExclamationTriangle = faExclamationTriangle;
|
||||
public faArchive = faArchive;
|
||||
public pageSize = PAGE_SIZE;
|
||||
|
||||
@ -1,16 +1,16 @@
|
||||
<div fxLayout="column" fxFlex="100" fxLayoutAlign="space-between stretch">
|
||||
<div>
|
||||
<h4 fxLayoutAlign="start" class="dashboard-info-title">Lightning</h4>
|
||||
<div class="dashboard-info-value">{{balances.lightning | number}} Sats</div>
|
||||
<div class="overflow-wrap dashboard-info-value">{{balances.lightning | number}} Sats</div>
|
||||
<mat-progress-bar class="dashboard-progress-bar" mode="determinate" value="{{balances.lightning/balances.total*100}}"></mat-progress-bar>
|
||||
</div>
|
||||
<div>
|
||||
<h4 fxLayoutAlign="start" class="dashboard-info-title">On-chain</h4>
|
||||
<div class="dashboard-info-value">{{balances.onchain | number}} Sats</div>
|
||||
<div class="overflow-wrap dashboard-info-value">{{balances.onchain | number}} Sats</div>
|
||||
<mat-progress-bar class="dashboard-progress-bar" mode="determinate" value="{{balances.onchain/balances.total*100}}"></mat-progress-bar>
|
||||
</div>
|
||||
<div>
|
||||
<h4 fxLayoutAlign="start" class="dashboard-info-title">Total</h4>
|
||||
<div class="dashboard-info-value">{{balances.total | number}} Sats</div>
|
||||
<div class="overflow-wrap dashboard-info-value">{{balances.total | number}} Sats</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -1,36 +1,36 @@
|
||||
<div fxLayout="column" fxFlex="50" fxLayoutAlign="space-between stretch">
|
||||
<div>
|
||||
<h4 fxLayoutAlign="start" class="dashboard-info-title">Active</h4>
|
||||
<div class="dashboard-info-value"><span class="dot tiny-dot green"></span>{{(channelsStatus.active.channels || 0) | number}}</div>
|
||||
<div class="overflow-wrap dashboard-info-value"><span class="dot tiny-dot green"></span>{{(channelsStatus.active.channels || 0) | number}}</div>
|
||||
</div>
|
||||
<div>
|
||||
<h4 fxLayoutAlign="start" class="dashboard-info-title">Pending</h4>
|
||||
<div class="dashboard-info-value"><span class="dot tiny-dot yellow"></span>{{(channelsStatus.pending.channels || 0) | number}}</div>
|
||||
<div class="overflow-wrap dashboard-info-value"><span class="dot tiny-dot yellow"></span>{{(channelsStatus.pending.channels || 0) | number}}</div>
|
||||
</div>
|
||||
<div>
|
||||
<h4 fxLayoutAlign="start" class="dashboard-info-title">Inactive</h4>
|
||||
<div class="dashboard-info-value"><span class="dot tiny-dot grey"></span>{{(channelsStatus.inactive.channels || 0) | number}}</div>
|
||||
<div class="overflow-wrap dashboard-info-value"><span class="dot tiny-dot grey"></span>{{(channelsStatus.inactive.channels || 0) | number}}</div>
|
||||
</div>
|
||||
<div>
|
||||
<h4 fxLayoutAlign="start" class="dashboard-info-title">Closing</h4>
|
||||
<div class="dashboard-info-value"><span class="dot tiny-dot red"></span>{{(channelsStatus.closing.channels || 0) | number}}</div>
|
||||
<div class="overflow-wrap dashboard-info-value"><span class="dot tiny-dot red"></span>{{(channelsStatus.closing.channels || 0) | number}}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div fxLayout="column" fxFlex="50" fxLayoutAlign="space-between stretch">
|
||||
<div>
|
||||
<h4 fxLayoutAlign="start" class="dashboard-info-title">Capacity</h4>
|
||||
<div class="dashboard-info-value">{{(channelsStatus.active.capacity || 0) | number}} Sats</div>
|
||||
<div class="overflow-wrap dashboard-info-value">{{(channelsStatus.active.capacity || 0) | number}} Sats</div>
|
||||
</div>
|
||||
<div>
|
||||
<h4 fxLayoutAlign="start" class="dashboard-info-title">Capacity</h4>
|
||||
<div class="dashboard-info-value">{{(channelsStatus.pending.capacity || 0) | number}} Sats</div>
|
||||
<div class="overflow-wrap dashboard-info-value">{{(channelsStatus.pending.capacity || 0) | number}} Sats</div>
|
||||
</div>
|
||||
<div>
|
||||
<h4 fxLayoutAlign="start" class="dashboard-info-title">Capacity</h4>
|
||||
<div class="dashboard-info-value">{{(channelsStatus.inactive.capacity || 0) | number}} Sats</div>
|
||||
<div class="overflow-wrap dashboard-info-value">{{(channelsStatus.inactive.capacity || 0) | number}} Sats</div>
|
||||
</div>
|
||||
<div>
|
||||
<h4 fxLayoutAlign="start" class="dashboard-info-title">Capacity</h4>
|
||||
<div class="dashboard-info-value">{{(channelsStatus.closing.capacity || 0) | number}} Sats</div>
|
||||
<div class="overflow-wrap dashboard-info-value">{{(channelsStatus.closing.capacity || 0) | number}} Sats</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -1,14 +1,18 @@
|
||||
<div fxLayout="column" fxFlex="100" fxLayoutAlign="space-between stretch">
|
||||
<div>
|
||||
<h4 fxLayoutAlign="start" class="dashboard-info-title">Daily</h4>
|
||||
<div class="dashboard-info-value">{{fees?.day_fee_sum | number}} Sats</div>
|
||||
<div class="overflow-wrap dashboard-info-value">{{fees?.day_fee_sum | number}} Sats</div>
|
||||
</div>
|
||||
<div>
|
||||
<h4 fxLayoutAlign="start" class="dashboard-info-title">Weekly</h4>
|
||||
<div class="dashboard-info-value">{{fees?.week_fee_sum | number}} Sats</div>
|
||||
<div class="overflow-wrap dashboard-info-value">{{fees?.week_fee_sum | number}} Sats</div>
|
||||
</div>
|
||||
<div>
|
||||
<h4 fxLayoutAlign="start" class="dashboard-info-title">Monthly</h4>
|
||||
<div class="dashboard-info-value">{{fees?.month_fee_sum | number}} Sats</div>
|
||||
<div class="overflow-wrap dashboard-info-value">{{fees?.month_fee_sum | number}} Sats</div>
|
||||
</div>
|
||||
<div fxFlex="20">
|
||||
<h4 class="dashboard-info-title"></h4>
|
||||
<span class="overflow-wrap dashboard-info-value"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -21,7 +21,7 @@
|
||||
</mat-card-header>
|
||||
<mat-card-content class="dashboard-card-content w-100" fxFlex="95">
|
||||
<div [ngSwitch]="card.id" fxLayout="column" fxFlex="100">
|
||||
<rtl-node-info fxFlex="100" *ngSwitchCase="'node'" [information]="information" [ngClass]="{'error-border': flgLoading[0]==='error'}"></rtl-node-info>
|
||||
<rtl-node-info fxFlex="100" *ngSwitchCase="'node'" [information]="information" [showColorFieldSeparately]="false" [ngClass]="{'error-border': flgLoading[0]==='error'}"></rtl-node-info>
|
||||
<rtl-balances-info fxFlex="100" *ngSwitchCase="'balance'" [balances]="balances" [ngClass]="{'error-border': flgLoading[2]==='error' || flgLoading[5]==='error'}"></rtl-balances-info>
|
||||
<rtl-channel-capacity-info fxFlex="100" *ngSwitchCase="'capacity'" [sortBy]="sortField" [channelBalances]="channelBalances" [allChannels]="allChannelsCapacity" [ngClass]="{'error-border': flgLoading[5]==='error'}"></rtl-channel-capacity-info>
|
||||
<rtl-fee-info fxFlex="100" *ngSwitchCase="'fee'" [fees]="fees" [ngClass]="{'error-border': flgLoading[1]==='error'}"></rtl-fee-info>
|
||||
|
||||
@ -1,14 +1,21 @@
|
||||
<div fxLayout="column" fxFlex="100" fxLayoutAlign="space-between stretch">
|
||||
<div>
|
||||
<h4 class="dashboard-info-title">Alias</h4>
|
||||
<div class="dashboard-info-value">
|
||||
<div class="overflow-wrap dashboard-info-value">
|
||||
{{information.alias}}
|
||||
<span class="dashboard-node-dot dot" [ngStyle]="{'backgroundColor': information.color}"></span>
|
||||
<span *ngIf="!showColorFieldSeparately" class="dashboard-node-dot dot" [ngStyle]="{'backgroundColor': information.color}"></span>
|
||||
</div>
|
||||
</div>
|
||||
<div *ngIf="showColorFieldSeparately">
|
||||
<h4 class="dashboard-info-title">Color</h4>
|
||||
<div class="overflow-wrap dashboard-info-value">
|
||||
<span class="dashboard-node-square" [ngStyle]="{'backgroundColor': information.color}"></span>
|
||||
{{information.color | uppercase}}
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="dashboard-info-title">Implementation</h4>
|
||||
<div class="dashboard-info-value">{{(information.lnImplementation || information.version) ? information.lnImplementation + ' v' + information.version : ''}}</div>
|
||||
<div class="overflow-wrap dashboard-info-value">{{(information.lnImplementation || information.version) ? information.lnImplementation + ' v' + information.version : ''}}</div>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="dashboard-info-title">Chain</h4>
|
||||
|
||||
@ -9,6 +9,7 @@ import { CommonService } from '../../../shared/services/common.service';
|
||||
})
|
||||
export class NodeInfoComponent implements OnChanges {
|
||||
@Input() information: GetInfo;
|
||||
@Input() showColorFieldSeparately: false;
|
||||
public chains: Array<string> = [''];
|
||||
|
||||
constructor(private commonService: CommonService) { }
|
||||
|
||||
@ -12,9 +12,9 @@
|
||||
<mat-card fxLayout="row" fxFlex="95" fxLayoutAlign="start stretch" class="dashboard-card p-24 w-96 h-93">
|
||||
<mat-card-content fxFlex="100" class="dashboard-card-content">
|
||||
<div [ngSwitch]="card.id" fxLayout="column" fxFlex="100">
|
||||
<rtl-node-info fxFlex="100" *ngSwitchCase="'node'" [information]="information" [ngClass]="{'error-border': flgLoading[0]==='error'}"></rtl-node-info>
|
||||
<rtl-fee-info fxFlex="100" *ngSwitchCase="'fee'" [fees]="fees" [ngClass]="{'error-border': flgLoading[2]==='error'}"></rtl-fee-info>
|
||||
<rtl-node-info fxFlex="100" *ngSwitchCase="'node'" [information]="information" [showColorFieldSeparately]="true" [ngClass]="{'error-border': flgLoading[0]==='error'}"></rtl-node-info>
|
||||
<rtl-channel-status-info fxFlex="100" *ngSwitchCase="'status'" [channelsStatus]="channelsStatus" [ngClass]="{'error-border': flgLoading[3]==='error' || flgLoading[4]==='error'}"></rtl-channel-status-info>
|
||||
<rtl-fee-info fxFlex="100" *ngSwitchCase="'fee'" [fees]="fees" [ngClass]="{'error-border': flgLoading[2]==='error'}"></rtl-fee-info>
|
||||
</div>
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
@ -45,11 +45,11 @@
|
||||
<div fxLayout="column" fxFlex="100" fxLayoutAlign="space-between">
|
||||
<div>
|
||||
<h4 class="dashboard-info-title">Network Capacity</h4>
|
||||
<div class="dashboard-info-value">{{networkInfo.total_network_capacity | number}} Sats</div>
|
||||
<div class="overflow-wrap dashboard-info-value">{{networkInfo.total_network_capacity | number}} Sats</div>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="dashboard-info-title">Number of Nodes</h4>
|
||||
<div class="dashboard-info-value">{{networkInfo.num_nodes | number}}</div>
|
||||
<div class="overflow-wrap dashboard-info-value">{{networkInfo.num_nodes | number}}</div>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="dashboard-info-title">Number of Channels</h4>
|
||||
@ -61,11 +61,11 @@
|
||||
<div fxLayout="column" fxFlex="100" fxLayoutAlign="space-between">
|
||||
<div>
|
||||
<h4 class="dashboard-info-title">Max Channel Size</h4>
|
||||
<div class="dashboard-info-value">{{networkInfo.max_channel_size | number}}</div>
|
||||
<div class="overflow-wrap dashboard-info-value">{{networkInfo.max_channel_size | number}}</div>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="dashboard-info-title">Avg Channel Size</h4>
|
||||
<div class="dashboard-info-value">{{networkInfo.avg_channel_size | number}}</div>
|
||||
<div class="overflow-wrap dashboard-info-value">{{networkInfo.avg_channel_size | number}}</div>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="dashboard-info-title">Min Channel Size</h4>
|
||||
@ -77,11 +77,11 @@
|
||||
<div fxLayout="column" fxFlex="100" fxLayoutAlign="space-between">
|
||||
<div>
|
||||
<h4 class="dashboard-info-title">Max Out Degree</h4>
|
||||
<div class="dashboard-info-value">{{networkInfo.max_out_degree | number}}</div>
|
||||
<div class="overflow-wrap dashboard-info-value">{{networkInfo.max_out_degree | number}}</div>
|
||||
</div>
|
||||
<div>
|
||||
<h4 class="dashboard-info-title">Avg Out Degree</h4>
|
||||
<div class="dashboard-info-value">{{networkInfo.avg_out_degree | number:'1.0-2'}}</div>
|
||||
<div class="overflow-wrap dashboard-info-value">{{networkInfo.avg_out_degree | number:'1.0-2'}}</div>
|
||||
</div>
|
||||
<div fxFlex="20">
|
||||
<h4 class="dashboard-info-title"></h4>
|
||||
|
||||
@ -45,8 +45,8 @@ export class NetworkInfoComponent implements OnInit, OnDestroy {
|
||||
];
|
||||
this.nodeCards = [
|
||||
{ id: 'node', icon: this.faServer, title: 'Node Information', cols: 3, rows: 1 },
|
||||
{ id: 'fee', icon: this.faBolt, title: 'Routing Fee Report', cols: 3, rows: 1 },
|
||||
{ id: 'status', icon: this.faNetworkWired, title: 'Channels', cols: 3, rows: 1 }
|
||||
{ id: 'status', icon: this.faNetworkWired, title: 'Channels', cols: 3, rows: 1 },
|
||||
{ id: 'fee', icon: this.faBolt, title: 'Routing Fee Report', cols: 3, rows: 1 }
|
||||
];
|
||||
} else {
|
||||
this.networkCards = [
|
||||
@ -56,8 +56,8 @@ export class NetworkInfoComponent implements OnInit, OnDestroy {
|
||||
];
|
||||
this.nodeCards = [
|
||||
{ id: 'node', icon: this.faServer, title: 'Node Information', cols: 1, rows: 1 },
|
||||
{ id: 'fee', icon: this.faBolt, title: 'Routing Fee Report', cols: 1, rows: 1 },
|
||||
{ id: 'status', icon: this.faNetworkWired, title: 'Channels', cols: 1, rows: 1 }
|
||||
{ id: 'status', icon: this.faNetworkWired, title: 'Channels', cols: 1, rows: 1 },
|
||||
{ id: 'fee', icon: this.faBolt, title: 'Routing Fee Report', cols: 1, rows: 1 }
|
||||
];
|
||||
}
|
||||
}
|
||||
|
||||
@ -27,19 +27,18 @@
|
||||
<td mat-cell *matCellDef="let channel"><span fxLayoutAlign="end center">{{channel.remote_balance | number}} </span></td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="total_satoshis_sent">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Sent ({{information?.smaller_currency_unit}}) </th>
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Sats Sent </th>
|
||||
<td mat-cell *matCellDef="let channel"><span fxLayoutAlign="end center">{{channel.total_satoshis_sent | number}} </span></td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="total_satoshis_received">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Received ({{information?.smaller_currency_unit}}) </th>
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header arrowPosition="before">Sats Received </th>
|
||||
<td mat-cell *matCellDef="let channel"><span fxLayoutAlign="end center">{{channel.total_satoshis_received | number}} </span></td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="capacity">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-3">Capacity</th>
|
||||
<ng-container matColumnDef="balancedness">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header class="pl-3">Balance Score </th>
|
||||
<td mat-cell *matCellDef="let channel" class="pl-3">
|
||||
<div fxLayout="row">
|
||||
<mat-hint fxFlex="50" fxLayoutAlign="start center" class="font-size-80"><strong class="font-weight-900">Local: </strong>{{channel.local_balance || 0 | number}} {{information?.smaller_currency_unit}}</mat-hint>
|
||||
<mat-hint fxFlex="50" fxLayoutAlign="end center" class="font-size-80"><strong class="font-weight-900">Remote: </strong>{{channel.remote_balance || 0 | number}} {{information?.smaller_currency_unit}}</mat-hint>
|
||||
<mat-hint fxFlex="100" fxLayoutAlign="center center" class="font-size-80">{{channel.balancedness * 100}}</mat-hint>
|
||||
</div>
|
||||
<mat-progress-bar mode="determinate" value="{{channel.balancedness * 100}}"></mat-progress-bar>
|
||||
</td>
|
||||
|
||||
@ -6,7 +6,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
.mat-column-capacity {
|
||||
.mat-column-balancedness {
|
||||
padding-left: 3rem;
|
||||
flex: 0 0 25%;
|
||||
width: 25%;
|
||||
|
||||
@ -48,13 +48,13 @@ export class ChannelOpenTableComponent implements OnInit, OnDestroy {
|
||||
this.displayedColumns = [ 'remote_alias', 'actions'];
|
||||
} else if(this.screenSize === ScreenSizeEnum.SM) {
|
||||
this.flgSticky = false;
|
||||
this.displayedColumns = ['remote_alias', 'total_satoshis_sent', 'total_satoshis_received', 'actions'];
|
||||
this.displayedColumns = ['remote_alias', 'local_balance', 'remote_balance', 'actions'];
|
||||
} else if(this.screenSize === ScreenSizeEnum.MD) {
|
||||
this.flgSticky = false;
|
||||
this.displayedColumns = ['remote_alias', 'local_balance', 'remote_balance', 'actions'];
|
||||
} else {
|
||||
this.flgSticky = true;
|
||||
this.displayedColumns = ['remote_alias', 'local_balance', 'remote_balance', 'total_satoshis_sent', 'total_satoshis_received', 'capacity', 'actions'];
|
||||
this.displayedColumns = ['remote_alias', 'total_satoshis_sent', 'total_satoshis_received', 'local_balance', 'remote_balance', 'balancedness', 'actions'];
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -2,19 +2,19 @@
|
||||
<mat-tab-group>
|
||||
<mat-tab>
|
||||
<ng-template mat-tab-label>
|
||||
<span matBadge="{{openChannels}}" matBadgeColor="primary" matBadgeOverlap="false" class="tab-badge">Open</span>
|
||||
<span matBadge="{{openChannels}}" matBadgeOverlap="false" class="tab-badge">Open</span>
|
||||
</ng-template>
|
||||
<rtl-channel-open-table></rtl-channel-open-table>
|
||||
</mat-tab>
|
||||
<mat-tab>
|
||||
<ng-template mat-tab-label>
|
||||
<span matBadge="{{pendingChannels}}" matBadgeColor="primary" matBadgeOverlap="false" class="tab-badge">Pending</span>
|
||||
<span matBadge="{{pendingChannels}}" matBadgeOverlap="false" class="tab-badge">Pending</span>
|
||||
</ng-template>
|
||||
<rtl-channel-pending-table></rtl-channel-pending-table>
|
||||
</mat-tab>
|
||||
<mat-tab>
|
||||
<ng-template mat-tab-label>
|
||||
<span matBadge="{{closedChannels}}" matBadgeColor="primary" matBadgeOverlap="false" class="tab-badge">Closed</span>
|
||||
<span matBadge="{{closedChannels}}" matBadgeOverlap="false" class="tab-badge">Closed</span>
|
||||
</ng-template>
|
||||
<rtl-channel-closed-table></rtl-channel-closed-table>
|
||||
</mat-tab>
|
||||
|
||||
@ -19,13 +19,13 @@
|
||||
<mat-tab-group>
|
||||
<mat-tab>
|
||||
<ng-template mat-tab-label>
|
||||
<span matBadge="{{activeChannels}}" matBadgeColor="primary" matBadgeOverlap="false" class="tab-badge">Channels</span>
|
||||
<span matBadge="{{activeChannels}}" matBadgeOverlap="false" class="tab-badge">Channels</span>
|
||||
</ng-template>
|
||||
<rtl-channel-manage></rtl-channel-manage>
|
||||
</mat-tab>
|
||||
<mat-tab>
|
||||
<ng-template mat-tab-label>
|
||||
<span matBadge="{{activePeers}}" matBadgeColor="primary" matBadgeOverlap="false" class="tab-badge">Peers</span>
|
||||
<span matBadge="{{activePeers}}" matBadgeOverlap="false" class="tab-badge">Peers</span>
|
||||
</ng-template>
|
||||
<rtl-peers></rtl-peers>
|
||||
</mat-tab>
|
||||
|
||||
@ -17,6 +17,7 @@ import { LNDEffects } from '../../store/lnd.effects';
|
||||
import { RTLEffects } from '../../../store/rtl.effects';
|
||||
import * as RTLActions from '../../../store/rtl.actions';
|
||||
import * as fromRTLReducer from '../../../store/rtl.reducers';
|
||||
import { ErrorMessageComponent } from '../../../shared/components/data-modal/error-message/error-message.component';
|
||||
|
||||
@Component({
|
||||
selector: 'rtl-peers',
|
||||
@ -98,6 +99,11 @@ export class PeersComponent implements OnInit, OnDestroy {
|
||||
}
|
||||
|
||||
onConnectPeer() {
|
||||
// if(!this.peerAddress) {
|
||||
// // this.store.dispatch(new RTLActions.OpenAlert({ data: { type: AlertTypeEnum.ERROR, alertTitle: 'Error', message: { code: 'Invalid values', message: 'invalid or empty address.' }, component: ErrorMessageComponent}}));
|
||||
// this.store.dispatch(new RTLActions.OpenSnackBar('Error: invalid or empty address.'));
|
||||
// return true;
|
||||
// }
|
||||
this.flgAnimate = true;
|
||||
const pattern = '^([a-zA-Z0-9]){1,66}@(([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])\.){3}([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5]):[0-9]+$';
|
||||
const deviderIndex = this.peerAddress.search('@');
|
||||
|
||||
@ -4,17 +4,16 @@
|
||||
<span class="page-title">Help</span>
|
||||
</div>
|
||||
<div fxLayout="row" fxFlex="100" class="padding-gap-x" fxLayoutAlign="start start">
|
||||
<mat-card fxLayout="column" fxFlex="100">
|
||||
<mat-card-content fxFlex="100" *ngFor="let helpTopic of helpTopics">
|
||||
<mat-expansion-panel>
|
||||
<div fxLayout="column" fxFlex="100">
|
||||
<div fxFlex="100" *ngFor="let helpTopic of helpTopics">
|
||||
<mat-expansion-panel class="flat-expansion-panel help-expansion mb-2px">
|
||||
<mat-expansion-panel-header>
|
||||
<mat-panel-title>{{helpTopic.question}}</mat-panel-title>
|
||||
</mat-expansion-panel-header>
|
||||
<mat-panel-description><pre class="pre-wrap">{{helpTopic.answer}}</pre></mat-panel-description>
|
||||
<mat-panel-description><span class="pre-wrap">{{helpTopic.answer}}</span></mat-panel-description>
|
||||
</mat-expansion-panel>
|
||||
<div class="divider"></div>
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -18,7 +18,7 @@ import { MenuChildNode, MENU_DATA } from '../../../models/navMenu';
|
||||
import { RTLEffects } from '../../../../store/rtl.effects';
|
||||
import * as RTLActions from '../../../../store/rtl.actions';
|
||||
import * as fromRTLReducer from '../../../../store/rtl.reducers';
|
||||
import { AlertTypeEnum } from '../../../services/consts-enums-functions';
|
||||
import { AlertTypeEnum, UserPersonaEnum } from '../../../services/consts-enums-functions';
|
||||
|
||||
@Component({
|
||||
selector: 'rtl-side-navigation',
|
||||
@ -42,6 +42,7 @@ export class SideNavigationComponent implements OnInit, OnDestroy {
|
||||
public numPendingChannels = 0;
|
||||
public smallScreen = false;
|
||||
public childRootRoute = '';
|
||||
public userPersonaEnum = UserPersonaEnum;
|
||||
private unSubs = [new Subject(), new Subject(), new Subject(), new Subject()];
|
||||
treeControlNested = new NestedTreeControl<MenuChildNode>(node => node.children);
|
||||
treeControlLogout = new NestedTreeControl<MenuChildNode>(node => node.children);
|
||||
@ -71,7 +72,6 @@ export class SideNavigationComponent implements OnInit, OnDestroy {
|
||||
this.selNode = rtlStore.selNode;
|
||||
this.settings = this.selNode.settings;
|
||||
this.information = rtlStore.nodeData;
|
||||
|
||||
if (undefined !== this.information.identity_pubkey) {
|
||||
if (undefined !== this.information.chains && typeof this.information.chains[0] === 'string') {
|
||||
this.informationChain.chain = this.information.chains[0].toString();
|
||||
@ -91,9 +91,9 @@ export class SideNavigationComponent implements OnInit, OnDestroy {
|
||||
this.smallScreen = true;
|
||||
}
|
||||
if(this.selNode && this.selNode.lnImplementation && this.selNode.lnImplementation.toUpperCase() === 'CLT') {
|
||||
this.navMenus.data = MENU_DATA.CLChildren;
|
||||
this.navMenus.data = MENU_DATA.CLChildren.filter(navMenuData => navMenuData.userPersona === UserPersonaEnum.ALL || navMenuData.userPersona === this.settings.userPersona );
|
||||
} else {
|
||||
this.navMenus.data = MENU_DATA.LNDChildren;
|
||||
this.navMenus.data = MENU_DATA.LNDChildren.filter(navMenuData => navMenuData.userPersona === UserPersonaEnum.ALL || navMenuData.userPersona === this.settings.userPersona );
|
||||
}
|
||||
this.logger.info(rtlStore);
|
||||
});
|
||||
|
||||
@ -5,7 +5,7 @@
|
||||
<span class="page-title">Node Layout</span>
|
||||
</div>
|
||||
<div fxFlex="100" class="alert alert-info">
|
||||
<fa-icon [icon]="faServer" class="mr-1"></fa-icon>
|
||||
<fa-icon [icon]="faInfoCircle" class="mr-1 alert-icon"></fa-icon>
|
||||
<span>Application layout will be tailored based upon user persona.</span>
|
||||
</div>
|
||||
<div fxLayout="column" fxLayout.gt-sm="row" fxFlex="100" fxLayoutAlign="space-between stretch">
|
||||
|
||||
@ -2,7 +2,7 @@ import { Component, OnInit, OnDestroy, Output, EventEmitter } from '@angular/cor
|
||||
import { Subject } from 'rxjs';
|
||||
import { takeUntil } from 'rxjs/operators';
|
||||
import { Store } from '@ngrx/store';
|
||||
import { faWrench, faPaintBrush, faServer } from '@fortawesome/free-solid-svg-icons';
|
||||
import { faWrench, faPaintBrush, faInfoCircle } from '@fortawesome/free-solid-svg-icons';
|
||||
|
||||
import { CURRENCY_UNITS, UserPersonaEnum, ScreenSizeEnum, FIAT_CURRENCY_UNITS, NODE_SETTINGS } from '../../../services/consts-enums-functions';
|
||||
import { LightningNode, Settings, RTLConfiguration, GetInfoRoot } from '../../../models/RTLconfig';
|
||||
@ -20,7 +20,7 @@ import * as fromRTLReducer from '../../../../store/rtl.reducers';
|
||||
export class AppSettingsComponent implements OnInit, OnDestroy {
|
||||
public faWrench = faWrench;
|
||||
public faPaintBrush = faPaintBrush;
|
||||
public faServer = faServer;
|
||||
public faInfoCircle = faInfoCircle;
|
||||
public selNode: LightningNode;
|
||||
public information: GetInfoRoot = {};
|
||||
public userPersonas = [UserPersonaEnum.OPERATOR, UserPersonaEnum.MERCHANT];
|
||||
|
||||
@ -1,35 +1,37 @@
|
||||
import { faTachometerAlt, faLink, faBolt, faExchangeAlt, faUsers, faMapSigns, faQuestion, faSearch, faTools, faProjectDiagram, faDownload } from '@fortawesome/free-solid-svg-icons';
|
||||
import { faTachometerAlt, faLink, faBolt, faExchangeAlt, faUsers, faMapSigns, faQuestion, faSearch, faTools, faProjectDiagram, faDownload, faServer } from '@fortawesome/free-solid-svg-icons';
|
||||
import { UserPersonaEnum } from '../services/consts-enums-functions';
|
||||
|
||||
export const MENU_DATA: MenuRootNode = {
|
||||
LNDChildren: [
|
||||
{id: 1, parentId: 0, name: 'Dashboard', iconType: 'FA', icon: faTachometerAlt, link: '/lnd/home'},
|
||||
{id: 2, parentId: 0, name: 'On-chain', iconType: 'FA', icon: faLink, link: '/lnd/onchain'},
|
||||
{id: 3, parentId: 0, name: 'Lightning', iconType: 'FA', icon: faBolt, link: '/lnd/peerschannels', children: [
|
||||
{id: 31, parentId: 3, name: 'Peers/Channels', iconType: 'FA', icon: faUsers, link: '/lnd/peerschannels'},
|
||||
{id: 32, parentId: 3, name: 'Transactions', iconType: 'FA', icon: faExchangeAlt, link: '/lnd/transactions'},
|
||||
{id: 33, parentId: 3, name: 'Backup', iconType: 'FA', icon: faDownload, link: '/lnd/backup'},
|
||||
{id: 34, parentId: 3, name: 'Routing', iconType: 'FA', icon: faMapSigns, link: '/lnd/routing'},
|
||||
{id: 35, parentId: 3, name: 'Graph Lookup', iconType: 'FA', icon: faSearch, link: '/lnd/lookups'}
|
||||
{id: 1, parentId: 0, name: 'Dashboard', iconType: 'FA', icon: faTachometerAlt, link: '/lnd/home', userPersona: UserPersonaEnum.ALL},
|
||||
{id: 2, parentId: 0, name: 'On-chain', iconType: 'FA', icon: faLink, link: '/lnd/onchain', userPersona: UserPersonaEnum.ALL},
|
||||
{id: 3, parentId: 0, name: 'Lightning', iconType: 'FA', icon: faBolt, link: '/lnd/peerschannels', userPersona: UserPersonaEnum.ALL, children: [
|
||||
{id: 31, parentId: 3, name: 'Peers/Channels', iconType: 'FA', icon: faUsers, link: '/lnd/peerschannels', userPersona: UserPersonaEnum.ALL},
|
||||
{id: 32, parentId: 3, name: 'Transactions', iconType: 'FA', icon: faExchangeAlt, link: '/lnd/transactions', userPersona: UserPersonaEnum.ALL},
|
||||
{id: 33, parentId: 3, name: 'Backup', iconType: 'FA', icon: faDownload, link: '/lnd/backup', userPersona: UserPersonaEnum.ALL},
|
||||
{id: 34, parentId: 3, name: 'Routing', iconType: 'FA', icon: faMapSigns, link: '/lnd/routing', userPersona: UserPersonaEnum.ALL},
|
||||
{id: 35, parentId: 3, name: 'Graph Lookup', iconType: 'FA', icon: faSearch, link: '/lnd/lookups', userPersona: UserPersonaEnum.ALL}
|
||||
]},
|
||||
{id: 5, parentId: 0, name: 'Network', iconType: 'FA', icon: faProjectDiagram, link: '/lnd/network'},
|
||||
{id: 6, parentId: 0, name: 'Settings', iconType: 'FA', icon: faTools, link: '/settings'},
|
||||
{id: 7, parentId: 0, name: 'Help', iconType: 'FA', icon: faQuestion, link: '/help'}
|
||||
{id: 5, parentId: 0, name: 'Network', iconType: 'FA', icon: faProjectDiagram, link: '/lnd/network', userPersona: UserPersonaEnum.OPERATOR},
|
||||
{id: 6, parentId: 0, name: 'Node/Network', iconType: 'FA', icon: faServer, link: '/lnd/network', userPersona: UserPersonaEnum.MERCHANT},
|
||||
{id: 7, parentId: 0, name: 'Settings', iconType: 'FA', icon: faTools, link: '/settings', userPersona: UserPersonaEnum.ALL},
|
||||
{id: 8, parentId: 0, name: 'Help', iconType: 'FA', icon: faQuestion, link: '/help', userPersona: UserPersonaEnum.ALL}
|
||||
],
|
||||
CLChildren: [
|
||||
{id: 1, parentId: 0, name: 'Home', icon: 'home', link: '/cl/home'},
|
||||
{id: 2, parentId: 0, name: 'On Chain', icon: 'account_balance_wallet', link: '/cl/onchain'},
|
||||
{id: 3, parentId: 0, name: 'Peers', icon: 'group', link: '/cl/peers'},
|
||||
{id: 4, parentId: 0, name: 'Channels', icon: 'settings_ethernet', link: '/cl/chnlmanage'},
|
||||
{id: 5, parentId: 0, name: 'Payments', icon: 'payment', link: '/cl/paymentsend', children: [
|
||||
{id: 51, parentId: 5, name: 'Send', icon: 'send', link: '/cl/paymentsend'},
|
||||
{id: 52, parentId: 5, name: 'Query Routes', icon: 'explore', link: '/cl/queryroutes'}
|
||||
{id: 1, parentId: 0, name: 'Home', icon: 'home', link: '/cl/home', userPersona: UserPersonaEnum.ALL},
|
||||
{id: 2, parentId: 0, name: 'On Chain', icon: 'account_balance_wallet', link: '/cl/onchain', userPersona: UserPersonaEnum.ALL},
|
||||
{id: 3, parentId: 0, name: 'Peers', icon: 'group', link: '/cl/peers', userPersona: UserPersonaEnum.ALL},
|
||||
{id: 4, parentId: 0, name: 'Channels', icon: 'settings_ethernet', link: '/cl/chnlmanage', userPersona: UserPersonaEnum.ALL},
|
||||
{id: 5, parentId: 0, name: 'Payments', icon: 'payment', link: '/cl/paymentsend', userPersona: UserPersonaEnum.ALL, children: [
|
||||
{id: 51, parentId: 5, name: 'Send', icon: 'send', link: '/cl/paymentsend', userPersona: UserPersonaEnum.ALL},
|
||||
{id: 52, parentId: 5, name: 'Query Routes', icon: 'explore', link: '/cl/queryroutes', userPersona: UserPersonaEnum.ALL}
|
||||
]},
|
||||
{id: 6, parentId: 0, name: 'Invoices', icon: 'receipt', link: '/cl/invoices'},
|
||||
{id: 7, parentId: 0, name: 'Forwarding History', icon: 'timeline', link: '/cl/forwardinghistory'},
|
||||
{id: 9, parentId: 0, name: 'Lookups', icon: 'search', link: '/cl/lookups'},
|
||||
{id: 10, parentId: 0, name: 'Node Config', icon: 'perm_data_setting', link: '/advanced'},
|
||||
{id: 11, parentId: 0, name: 'Settings', icon: 'settings', link: '/settings'},
|
||||
{id: 12, parentId: 0, name: 'Help', icon: 'help', link: '/help'}
|
||||
{id: 6, parentId: 0, name: 'Invoices', icon: 'receipt', link: '/cl/invoices', userPersona: UserPersonaEnum.ALL},
|
||||
{id: 7, parentId: 0, name: 'Forwarding History', icon: 'timeline', link: '/cl/forwardinghistory', userPersona: UserPersonaEnum.ALL},
|
||||
{id: 9, parentId: 0, name: 'Lookups', icon: 'search', link: '/cl/lookups', userPersona: UserPersonaEnum.ALL},
|
||||
{id: 10, parentId: 0, name: 'Node Config', icon: 'perm_data_setting', link: '/advanced', userPersona: UserPersonaEnum.ALL},
|
||||
{id: 11, parentId: 0, name: 'Settings', icon: 'settings', link: '/settings', userPersona: UserPersonaEnum.ALL},
|
||||
{id: 12, parentId: 0, name: 'Help', icon: 'help', link: '/help', userPersona: UserPersonaEnum.ALL}
|
||||
]
|
||||
};
|
||||
|
||||
@ -45,5 +47,6 @@ export class MenuChildNode {
|
||||
iconType?: string;
|
||||
icon?: any | string;
|
||||
link?: any;
|
||||
userPersona?: string;
|
||||
children?: MenuChildNode[];
|
||||
}
|
||||
|
||||
@ -38,7 +38,7 @@ export const TRANS_TYPES = [
|
||||
export const NODE_SETTINGS = {
|
||||
themes: [
|
||||
{id: 'purple', name: 'Diogo'},
|
||||
{id: 'teal', name: 'Sauby'},
|
||||
{id: 'teal', name: 'Suheb'},
|
||||
{id: 'indigo', name: 'RTL'},
|
||||
{id: 'pink', name: 'BK'}
|
||||
],
|
||||
@ -50,7 +50,8 @@ export const NODE_SETTINGS = {
|
||||
|
||||
export enum UserPersonaEnum {
|
||||
OPERATOR = 'operator',
|
||||
MERCHANT = 'merchant'
|
||||
MERCHANT = 'merchant',
|
||||
ALL = 'all'
|
||||
}
|
||||
|
||||
export enum AlertTypeEnum {
|
||||
|
||||
@ -186,7 +186,7 @@ import { SocketService } from './services/socket.service';
|
||||
providers: [
|
||||
{ provide: PERFECT_SCROLLBAR_CONFIG, useValue: DEFAULT_PERFECT_SCROLLBAR_CONFIG },
|
||||
{ provide: MAT_DIALOG_DEFAULT_OPTIONS, useValue: { hasBackdrop: true, autoFocus: true, disableClose: true, role: 'dialog', width: '55%' } },
|
||||
{ provide: MAT_SNACK_BAR_DEFAULT_OPTIONS, useValue: { duration: 2000, verticalPosition: 'bottom', panelClass: 'rtl-snack-bar' } },
|
||||
{ provide: MAT_SNACK_BAR_DEFAULT_OPTIONS, useValue: { duration: 20000, verticalPosition: 'bottom', panelClass: 'rtl-snack-bar' } },
|
||||
DecimalPipe, SocketService
|
||||
]
|
||||
})
|
||||
|
||||
@ -36,8 +36,17 @@
|
||||
.rtl-top-toolbar {
|
||||
border-bottom: 1px solid $background-color;
|
||||
}
|
||||
.mat-tab-label.mat-tab-label-active {
|
||||
color: $primary-darker;
|
||||
.mat-tab-label {
|
||||
&.mat-tab-label-active {
|
||||
color: $primary-darker;
|
||||
& .tab-badge .mat-badge-content {
|
||||
background: $primary-darker;
|
||||
}
|
||||
}
|
||||
& .tab-badge .mat-badge-content {
|
||||
color: mat-color($background, dialog);
|
||||
background: $foreground-secondary-text;
|
||||
}
|
||||
}
|
||||
.cc-data-block .cc-data-title {
|
||||
color: $primary-darker;
|
||||
@ -80,9 +89,6 @@
|
||||
.selected-color {
|
||||
border-color: $primary-lighter;
|
||||
}
|
||||
.rtl-snack-bar {
|
||||
background: $primary-color;
|
||||
}
|
||||
.mat-progress-bar-fill::after {
|
||||
background-color: mat-color($primary, 600);
|
||||
}
|
||||
@ -102,56 +108,29 @@
|
||||
color: $foreground-secondary-text;
|
||||
}
|
||||
.dashboard-card .mat-card-header .mat-card-title {
|
||||
font-size: 180%;
|
||||
color: $foreground-text;
|
||||
& .ng-fa-icon {
|
||||
color: $foreground-text;
|
||||
}
|
||||
}
|
||||
& .dashboard-info-title {
|
||||
color: $primary-darker;
|
||||
}
|
||||
& .dashboard-info-value {
|
||||
font-weight: 700;
|
||||
color: $foreground-text;
|
||||
}
|
||||
& .dashboard-capacity-header {
|
||||
color: $foreground-text;
|
||||
}
|
||||
.alert.alert-info {
|
||||
border: 1px solid $primary-darker;
|
||||
background-color: $hover-background-white;
|
||||
color: $primary-darker;
|
||||
& .ng-fa-icon {
|
||||
fill: $primary-darker;
|
||||
color: $primary-darker;
|
||||
}
|
||||
}
|
||||
|
||||
.alert.alert-warn {
|
||||
border: 1px solid #856404;
|
||||
background-color: #fff3cd;
|
||||
color: #856404;
|
||||
& .ng-fa-icon {
|
||||
fill: #856404;
|
||||
color: #856404;
|
||||
}
|
||||
}
|
||||
|
||||
.alert.alert-danger {
|
||||
border: 1px solid $warn-color;
|
||||
background-color: mat-color($warn, 50);
|
||||
color: $warn-color;
|
||||
& .ng-fa-icon {
|
||||
fill: $warn-color;
|
||||
color: $warn-color;
|
||||
}
|
||||
}
|
||||
|
||||
.mat-progress-bar.this-channel-bar .mat-progress-bar-fill::after {
|
||||
background-color: mat-color($accent, A200);
|
||||
}
|
||||
|
||||
.mat-progress-bar.this-channel-bar .mat-progress-bar-buffer {
|
||||
background-color: mat-color($accent, 400);
|
||||
}
|
||||
.color-primary {
|
||||
color: $primary-darker !important;
|
||||
}
|
||||
}
|
||||
|
||||
&.day {
|
||||
@ -164,8 +143,16 @@
|
||||
.rtl-top-toolbar {
|
||||
border-bottom: 1px solid white;
|
||||
}
|
||||
.mat-tab-label.mat-tab-label-active {
|
||||
color: $primary-color;
|
||||
.mat-tab-label {
|
||||
&.mat-tab-label-active {
|
||||
color: $primary-color;
|
||||
& .tab-badge .mat-badge-content {
|
||||
background: $primary-color;
|
||||
}
|
||||
}
|
||||
& .tab-badge .mat-badge-content {
|
||||
background: $foreground-secondary-text;
|
||||
}
|
||||
}
|
||||
.ng-fa-icon, .mat-nested-tree-node-parent .mat-icon, .mat-form-field-suffix {
|
||||
color: $foreground-secondary-text;
|
||||
@ -215,9 +202,6 @@
|
||||
.page-title-container .page-title-img, svg.top-icon-small {
|
||||
fill: $foreground-text;
|
||||
}
|
||||
.rtl-snack-bar {
|
||||
background: $primary-color;
|
||||
}
|
||||
.mat-progress-bar-fill::after {
|
||||
background-color: mat-color($primary, 900);
|
||||
}
|
||||
@ -239,20 +223,20 @@
|
||||
border: 1px solid $foreground-divider;
|
||||
}
|
||||
.dashboard-card .mat-card-header .mat-card-title {
|
||||
font-size: 180%;
|
||||
color: $foreground-disabled;
|
||||
& .ng-fa-icon {
|
||||
color: $foreground-disabled;
|
||||
}
|
||||
}
|
||||
& .dashboard-info-title {
|
||||
color: $primary-color;
|
||||
}
|
||||
& .dashboard-info-value {
|
||||
font-weight: 700;
|
||||
color: $foreground-secondary-text;
|
||||
}
|
||||
}
|
||||
|
||||
.color-primary {
|
||||
color: $primary-color !important;
|
||||
.color-primary {
|
||||
color: $primary-color !important;
|
||||
}
|
||||
}
|
||||
|
||||
.mat-progress-bar-buffer {
|
||||
@ -432,11 +416,17 @@
|
||||
}
|
||||
}
|
||||
|
||||
.rtl-snack-bar .mat-simple-snackbar {
|
||||
justify-content: center;
|
||||
align-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
// .rtl-snack-bar {
|
||||
// &.mat-snack-bar-container {
|
||||
// background-color: $warn-color;
|
||||
// }
|
||||
// & .mat-simple-snackbar {
|
||||
// justify-content: center;
|
||||
// align-content: center;
|
||||
// align-items: center;
|
||||
// background-color: $warn-color;
|
||||
// }
|
||||
// }
|
||||
|
||||
.mat-select-panel .mat-option.mat-active {
|
||||
background: none;
|
||||
@ -528,24 +518,28 @@
|
||||
|
||||
.dashboard-card {
|
||||
& .dashboard-divider {
|
||||
// margin: 1.5rem 0;
|
||||
border-top-width: 2px;
|
||||
}
|
||||
|
||||
& .mat-card-header .mat-card-title {
|
||||
font-size: 180%;
|
||||
margin-bottom: 2.4rem;
|
||||
}
|
||||
|
||||
& .dashboard-info-value {
|
||||
font-weight: 700;
|
||||
}
|
||||
& .dashboard-info-title {
|
||||
font-weight: 500;
|
||||
color: $primary-color;
|
||||
}
|
||||
|
||||
& .dashboard-node-dot {
|
||||
margin: 0 0 -2px 1rem;
|
||||
border: 1px solid $foreground-secondary-text;
|
||||
}
|
||||
|
||||
& .dashboard-node-square {
|
||||
display: inline-flex;
|
||||
width: $dot-size;
|
||||
height: $dot-size;
|
||||
margin-right: 1rem;
|
||||
}
|
||||
& .dashboard-capacity-header {
|
||||
font-size: 130%;
|
||||
font-weight: 700;
|
||||
@ -554,36 +548,53 @@
|
||||
font-size: 120%;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.alert.alert-info {
|
||||
border: 1px solid $primary-color;
|
||||
background-color: mat-color($primary, 50);
|
||||
color: $primary-color;
|
||||
& .ng-fa-icon {
|
||||
fill: $primary-color;
|
||||
color: $primary-color;
|
||||
.alert {
|
||||
&.alert-info {
|
||||
border: 1px solid $blue-color;
|
||||
background-color: $blue-background-color;
|
||||
color: $blue-color;
|
||||
& .alert-icon.ng-fa-icon {
|
||||
color: $blue-color;
|
||||
}
|
||||
}
|
||||
|
||||
&.alert-warn {
|
||||
border: 1px solid $yellow-alert-color;
|
||||
background-color: $yellow-background-color;
|
||||
color: $yellow-alert-color;
|
||||
& .alert-icon.ng-fa-icon {
|
||||
color: $yellow-alert-color;
|
||||
}
|
||||
}
|
||||
|
||||
&.alert-danger {
|
||||
border: 1px solid $red-color;
|
||||
background-color: $red-background-color;
|
||||
color: $red-color;
|
||||
& .alert-icon.ng-fa-icon {
|
||||
color: $red-color;
|
||||
}
|
||||
}
|
||||
|
||||
&.alert-success {
|
||||
border: 1px solid $green-color;
|
||||
background-color: $green-background-color;
|
||||
color: $green-color;
|
||||
& .alert-icon.ng-fa-icon {
|
||||
color: $green-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.alert.alert-warn {
|
||||
border: 1px solid #856404;
|
||||
background-color: #fff3cd;
|
||||
color: #856404;
|
||||
& .ng-fa-icon {
|
||||
fill: #856404;
|
||||
color: #856404;
|
||||
.help-expansion {
|
||||
& .mat-expansion-panel-header, & .mat-expansion-panel-header-title {
|
||||
font-weight: 500;
|
||||
color: $foreground-secondary-text;
|
||||
}
|
||||
}
|
||||
|
||||
.alert.alert-danger {
|
||||
border: 1px solid $warn-color;
|
||||
background-color: mat-color($warn, 50);
|
||||
color: $warn-color;
|
||||
& .ng-fa-icon {
|
||||
fill: $warn-color;
|
||||
color: $warn-color;
|
||||
& .mat-expansion-indicator::after, & .mat-expansion-panel-content, & .mat-expansion-panel-header-description {
|
||||
color: $foreground-secondary-text;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -22,8 +22,14 @@ $fa-icon-small-size: 2rem;
|
||||
$fa-icon-regular-size: 4rem;
|
||||
|
||||
$yellow-color: #ffbd2e;
|
||||
$yellow-alert-color: #856404;
|
||||
$yellow-background-color: #fff3cd;
|
||||
$green-color: #28ca43;
|
||||
$green-background-color: #d4edda;;
|
||||
$red-color: #c62828;
|
||||
$red-background-color: #f8d7da;
|
||||
$blue-color: #004085;
|
||||
$blue-background-color: #cce5ff;
|
||||
$grey-color: #AAAAAA;
|
||||
$tiny-dot-size: 0.8rem;
|
||||
$dot-size: 1.2rem;
|
||||
@ -274,6 +274,10 @@ body {
|
||||
margin-bottom: 0 !important;
|
||||
}
|
||||
|
||||
.mb-2px {
|
||||
margin-bottom: 2px !important;
|
||||
}
|
||||
|
||||
.mb-1 {
|
||||
margin-bottom: 1rem !important;
|
||||
}
|
||||
@ -943,4 +947,4 @@ table {
|
||||
|
||||
.node-grid-tile.mat-grid-tile .mat-figure {
|
||||
align-items: start;
|
||||
}
|
||||
}
|
||||
|
||||
@ -14,7 +14,7 @@ import { LoggerService } from '../shared/services/logger.service';
|
||||
import { SessionService } from '../shared/services/session.service';
|
||||
import { CommonService } from '../shared/services/common.service';
|
||||
import { Settings, RTLConfiguration, LightningNode } from '../shared/models/RTLconfig';
|
||||
import { AuthenticateWith, CURRENCY_UNITS, AlertTypeEnum, ScreenSizeEnum } from '../shared/services/consts-enums-functions';
|
||||
import { AuthenticateWith, CURRENCY_UNITS, ScreenSizeEnum } from '../shared/services/consts-enums-functions';
|
||||
|
||||
import { SpinnerDialogComponent } from '../shared/components/data-modal/spinner-dialog/spinner-dialog.component';
|
||||
import { AlertMessageComponent } from '../shared/components/data-modal/alert-message/alert-message.component';
|
||||
|
||||
Loading…
Reference in New Issue
Block a user