mirrors/Ride-The-Lightning-RTL
1
0
Fork 0
mirror of https://github.com/Ride-The-Lightning/RTL.git synced 2025-02-21 14:04:18 +01:00
Code Issues Projects Releases Wiki Activity

Responsive and other fixes

Browse source 
Responsive and other fixes
This commit is contained in:
Shahana Farooqui 2019-12-12 23:01:04 -05:00
parent 98f874cd07
commit 1c372a8554
60 changed files with 326 additions and 213 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
angular/6.55dfc1c099334589c71d.js Normal file
View file

File diff suppressed because one or more lines are too long

1
angular/6.9f448ec4afdcbbc42cf2.js
View file

File diff suppressed because one or more lines are too long

1
angular/7.9aa78a1a4cf44c9d414c.js Normal file
View file

File diff suppressed because one or more lines are too long

1
angular/7.f304a8c9801c62bf8967.js
View file

File diff suppressed because one or more lines are too long

4
angular/index.html
View file

@ -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.8a1ddaedb5da1018195e.css"></head>
<link rel="stylesheet" href="styles.827667a8b89989da4050.css"></head>
<body>
<rtl-app></rtl-app>
<script src="runtime.8de0300ea7cbcf176757.js"></script><script src="polyfills-es5.2e75d230d7f9c760eb2f.js" nomodule></script><script src="polyfills.1ebb102854b0ec478c1b.js"></script><script src="main.54108a6aab5d60775c5e.js"></script></body>
<script src="runtime.6a515545e0365c8b17e5.js"></script><script src="polyfills-es5.2e75d230d7f9c760eb2f.js" nomodule></script><script src="polyfills.1ebb102854b0ec478c1b.js"></script><script src="main.b2d9b22a93962013c7ba.js"></script></body>
</html>

1
angular/main.54108a6aab5d60775c5e.js
View file

File diff suppressed because one or more lines are too long

1
angular/main.b2d9b22a93962013c7ba.js Normal file
View file

File diff suppressed because one or more lines are too long

2
angular/runtime.8de0300ea7cbcf176757.js → angular/runtime.6a515545e0365c8b17e5.js
View file

@ -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++)o[a=i[p]]&&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:"9e71a210a8bdc5ba9df9",6:"9f448ec4afdcbbc42cf2",7:"f304a8c9801c62bf8967"}[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],f=r[2],p=0,s=[];p<i.length;p++)o[a=i[p]]&&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:"9e71a210a8bdc5ba9df9",6:"55dfc1c099334589c71d",7:"9aa78a1a4cf44c9d414c"}[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()}([]);

1
angular/styles.827667a8b89989da4050.css Normal file
View file

File diff suppressed because one or more lines are too long

1
angular/styles.8a1ddaedb5da1018195e.css
View file

File diff suppressed because one or more lines are too long

24
controllers/RTLConf.js
View file

@ -2,6 +2,8 @@ var ini = require('ini');
var fs = require('fs');
var logger = require('./logger');
var common = require('../common');
var request = require('request-promise');
var options = {};
exports.updateSelectedNode = (req, res, next) => {
const selNodeIndex = req.body.selNodeIndex;
@ -219,3 +221,25 @@ exports.getConfig = (req, res, next) => {
}
});
};
exports.getCurrencyRates = (req, res, next) => {
options = common.getOptions();
options.url = 'https://blockchain.info/ticker';
request(options).then((body) => {
logger.info({fileName: 'RTLConf', msg: 'Rates Received: ' + JSON.stringify(body)});
if(undefined === body || body.error) {
res.status(500).json({
message: "Fetching Rates Failed!",
error: (undefined === body) ? 'Error From External Server!' : body.error
});
} else {
res.status(200).json(body);
}
})
.catch(function (err) {
return res.status(500).json({
message: "Fetching Rates Failed!",
error: err.error
});
});
};

1
routes/RTLConf.js
View file

@ -8,4 +8,5 @@ router.post("/", authCheck, RTLConfController.updateUISettings);
router.get("/config/:nodeType", authCheck, RTLConfController.getConfig);
router.post("/updateSelNode", RTLConfController.updateSelectedNode);
router.post("/updateDefaultNode", RTLConfController.updateDefaultNode);
router.get("/rates", RTLConfController.getCurrencyRates);
module.exports = router;

5
src/app/app.component.html
View file

@ -2,7 +2,7 @@
<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">
<button *ngIf="settings.menu === 'vertical'" class="top-toolbar-icon" mat-icon-button (click)="sideNavToggle()">
<mat-icon>menu</mat-icon>
<mat-icon class="mr-5px">menu</mat-icon>
</button>
<button *ngIf="settings.fontSize === 'small-font' && settings.menu === 'vertical' && !smallScreen" mat-icon-button (click)="settings.flgSidenavPinned = !settings.flgSidenavPinned">
<svg class="top-toolbar-icon icon-pinned" viewBox="0 0 42 42">
@ -31,8 +31,7 @@
<rtl-horizontal-navigation fxLayout="row" fxFlex="100" fxLayoutAlign="start center" class="h-100"></rtl-horizontal-navigation>
</mat-toolbar>
<mat-sidenav-container>
<mat-sidenav perfectScrollbar *ngIf="settings.menu === 'vertical'" [opened]="settings.flgSidenavOpened" [mode]="(settings.flgSidenavPinned) ? 'side' : 'over'"
#sideNavigation class="sidenav mat-elevation-z6">
<mat-sidenav perfectScrollbar *ngIf="settings.menu === 'vertical'" [opened]="settings.flgSidenavOpened" [mode]="(settings.flgSidenavPinned) ? 'side' : 'over'" #sideNavigation class="sidenav mat-elevation-z6">
<rtl-side-navigation (ChildNavClicked)="onNavigationClicked($event)" fxFlex="100"></rtl-side-navigation>
</mat-sidenav>
<mat-sidenav-content perfectScrollbar>

54
src/app/app.component.ts
View file

@ -1,5 +1,6 @@
import { Component, OnInit, AfterViewInit, OnDestroy, ViewChild, HostListener } from '@angular/core';
import { Component, OnInit, AfterViewInit, OnDestroy, ViewChild } from '@angular/core';
import { Router } from '@angular/router';
import { Breakpoints, BreakpointObserver } from '@angular/cdk/layout';
import { Subject } from 'rxjs';
import { takeUntil, filter } from 'rxjs/operators';
@ -11,11 +12,11 @@ import * as sha256 from 'sha256';
import { LoggerService } from './shared/services/logger.service';
import { CommonService } from './shared/services/common.service';
import { SessionService } from './shared/services/session.service';
import { AlertTypeEnum, ScreenSizeEnum } from './shared/services/consts-enums-functions';
import { RTLConfiguration, Settings, LightningNode, GetInfoRoot } from './shared/models/RTLconfig';
import * as RTLActions from './store/rtl.actions';
import * as fromRTLReducer from './store/rtl.reducers';
import { AlertTypeEnum } from './shared/services/consts-enums-functions';
@Component({
selector: 'rtl-app',
@ -35,9 +36,30 @@ export class AppComponent implements OnInit, AfterViewInit, OnDestroy {
unSubs: Array<Subject<void>> = [new Subject(), new Subject(), new Subject(), new Subject(), new Subject(), new Subject()];
constructor(private logger: LoggerService, private commonService: CommonService, private store: Store<fromRTLReducer.RTLState>, private actions$: Actions,
private userIdle: UserIdleService, private router: Router, private sessionService: SessionService) {}
private userIdle: UserIdleService, private router: Router, private sessionService: SessionService, private breakpointObserver: BreakpointObserver) {}
ngOnInit() {
this.breakpointObserver.observe([Breakpoints.XSmall, Breakpoints.TabletPortrait, Breakpoints.Small, Breakpoints.Medium, Breakpoints.Large, Breakpoints.XLarge])
.pipe(takeUntil(this.unSubs[5]))
.subscribe((matches) => {
if(matches.breakpoints[Breakpoints.XSmall]) {
this.commonService.setScreenSize(ScreenSizeEnum.XS);
this.smallScreen = true;
} else if(matches.breakpoints[Breakpoints.TabletPortrait]) {
this.commonService.setScreenSize(ScreenSizeEnum.SM);
this.smallScreen = true;
} else if(matches.breakpoints[Breakpoints.Small] || matches.breakpoints[Breakpoints.Medium]) {
this.commonService.setScreenSize(ScreenSizeEnum.MD);
this.smallScreen = false;
} else if(matches.breakpoints[Breakpoints.Large] || matches.breakpoints[Breakpoints.XLarge]) {
this.commonService.setScreenSize(ScreenSizeEnum.LG);
this.smallScreen = false;
} else {
this.commonService.setScreenSize(ScreenSizeEnum.MD);
this.smallScreen = false;
}
});
this.store.dispatch(new RTLActions.FetchRTLConfig());
this.accessKey = this.readAccessKey();
this.store.select('root')
@ -48,14 +70,6 @@ export class AppComponent implements OnInit, AfterViewInit, OnDestroy {
this.appConfig = rtlStore.appConfig;
this.information = rtlStore.nodeData;
this.flgLoading[0] = (undefined !== this.information.identity_pubkey) ? false : true;
if (window.innerWidth <= 768) {
this.settings.menu = 'vertical';
this.settings.flgSidenavOpened = false;
this.settings.flgSidenavPinned = false;
}
if (window.innerWidth <= 414) {
this.smallScreen = true;
}
this.logger.info(this.settings);
if (!this.sessionService.getItem('token')) {
this.flgLoading[0] = false;
@ -83,7 +97,7 @@ export class AppComponent implements OnInit, AfterViewInit, OnDestroy {
this.userIdle.onTimeout().pipe(takeUntil(this.unSubs[3])).subscribe(() => {
if (this.sessionService.getItem('token')) {
this.logger.warn('Time limit exceeded for session inactivity.');
this.store.dispatch(new RTLActions.OpenAlert({ width: '55%', data: {
this.store.dispatch(new RTLActions.OpenAlert({ data: {
type: AlertTypeEnum.WARNING,
alertTitle: 'Logging out',
titleMessage: 'Time limit exceeded for session inactivity.'
@ -109,21 +123,9 @@ export class AppComponent implements OnInit, AfterViewInit, OnDestroy {
}
ngAfterViewInit() {
if (this.settings.menuType.toLowerCase() !== 'regular' || !this.settings.flgSidenavPinned) {
if ((this.settings.menuType.toLowerCase() !== 'regular' || !this.settings.flgSidenavPinned) || (this.smallScreen)) {
this.sideNavigation.close();
}
if (window.innerWidth <= 768) {
this.sideNavigation.close();
}
}
@HostListener('window:resize')
public onWindowResize(): void {
if (window.innerWidth <= 768) {
this.settings.menu = 'vertical';
this.settings.flgSidenavOpened = false;
this.settings.flgSidenavPinned = false;
}
}
sideNavToggle() {
@ -132,7 +134,7 @@ export class AppComponent implements OnInit, AfterViewInit, OnDestroy {
}
onNavigationClicked(event: any) {
if (window.innerWidth <= 414) {
if (this.smallScreen) {
this.sideNavigation.close();
}
}

3
src/app/app.module.ts
View file

@ -16,6 +16,7 @@ import { AppComponent } from './app.component';
import { environment } from '../environments/environment';
import { SessionService } from './shared/services/session.service';
import { CommonService } from './shared/services/common.service';
import { LoggerService, ConsoleLoggerService } from './shared/services/logger.service';
import { AuthGuard } from './shared/services/auth.guard';
import { AuthInterceptor } from './shared/services/auth.interceptor';
@ -43,7 +44,7 @@ import { CLEffects } from './clightning/store/cl.effects';
{ provide: LoggerService, useClass: ConsoleLoggerService },
{ provide: OverlayContainer, useClass: ThemeOverlay },
{ provide: HTTP_INTERCEPTORS, useClass: AuthInterceptor, multi: true },
AuthGuard, SessionService
CommonService, AuthGuard, SessionService
],
bootstrap: [AppComponent]
})

8
src/app/clightning/channels/channels.component.ts
View file

@ -120,7 +120,7 @@ export class CLChannelsComponent implements OnInit, OnDestroy {
const titleMsg = 'Updated Values for ALL Channels';
// const confirmationMsg = {};
const confirmationMsg = [[{key: '', value: '', title: '', width: 0, type: DataTypeEnum.NUMBER}]];
this.store.dispatch(new RTLActions.OpenConfirmation({ width: '70%', data: {
this.store.dispatch(new RTLActions.OpenConfirmation({ data: {
type: AlertTypeEnum.CONFIRM,
alertTitle: 'Confirm Channels Update',
titleMessage: titleMsg,
@ -162,7 +162,7 @@ export class CLChannelsComponent implements OnInit, OnDestroy {
const titleMsg = 'Updated Values for Channel: ' + channelToUpdate.channel_id;
// const confirmationMsg = {};
const confirmationMsg = [[{key: '', value: '', title: '', width: 0, type: DataTypeEnum.NUMBER}]];
this.store.dispatch(new RTLActions.OpenConfirmation({ width: '70%', data: {
this.store.dispatch(new RTLActions.OpenConfirmation({ data: {
type: AlertTypeEnum.CONFIRM,
alertTitle: 'Confirm Channel Update',
titleMessage: titleMsg,
@ -195,14 +195,14 @@ export class CLChannelsComponent implements OnInit, OnDestroy {
return;
}
if (channelToClose.state === 'AWAITING_UNILATERAL') {
this.store.dispatch(new RTLActions.OpenAlert({ width: '55%', data: {
this.store.dispatch(new RTLActions.OpenAlert({ data: {
type: AlertTypeEnum.WARNING,
alertTitle: 'Unable to Close Channel',
titleMessage: 'Channel can not be closed when it is in AWAITING UNILATERAL state.'
}}));
} else {
this.store.dispatch(new RTLActions.OpenConfirmation({
width: '70%', data: { type: AlertTypeEnum.CONFIRM, alertTitle: 'Confirm Channel Closing', titleMessage: 'Closing channel: ' + channelToClose.channel_id, noBtnText: 'Cancel', yesBtnText: 'Close Channel'
data: { type: AlertTypeEnum.CONFIRM, alertTitle: 'Confirm Channel Closing', titleMessage: 'Closing channel: ' + channelToClose.channel_id, noBtnText: 'Cancel', yesBtnText: 'Close Channel'
}}));
this.rtlEffects.closeConfirm
.pipe(takeUntil(this.unsub[1]))

2
src/app/clightning/forwarding-history/forwarding-history.component.ts
View file

@ -87,7 +87,7 @@ export class CLForwardingHistoryComponent implements OnInit, OnDestroy {
// 'status', 'received_time_str', 'resolved_time_str', 'in_channel', 'out_channel', 'in_msatoshi', 'in_msat', 'out_msatoshi', 'out_msat', 'fee', 'fee_msat', 'payment_hash'
];
this.store.dispatch(new RTLActions.OpenAlert({ width: '40%', data: {
this.store.dispatch(new RTLActions.OpenAlert({ data: {
type: AlertTypeEnum.INFORMATION,
alertTitle: 'Forwarding History',
message: reorderedFHEvent

4
src/app/clightning/invoices/invoices.component.ts
View file

@ -103,7 +103,7 @@ export class CLInvoicesComponent implements OnInit, OnDestroy {
onDeleteExpiredInvoices() {
this.store.dispatch(new RTLActions.OpenConfirmation({
width: '70%', data: { type: AlertTypeEnum.CONFIRM, alertTitle: 'Confirm Delete Invoices', titleMessage: 'Delete Expired Invoices', noBtnText: 'Cancel', yesBtnText: 'Delete Invoices'
data: { type: AlertTypeEnum.CONFIRM, alertTitle: 'Confirm Delete Invoices', titleMessage: 'Delete Expired Invoices', noBtnText: 'Cancel', yesBtnText: 'Delete Invoices'
}}));
this.rtlEffects.closeConfirm
.pipe(takeUntil(this.unSubs[1]))
@ -123,7 +123,7 @@ export class CLInvoicesComponent implements OnInit, OnDestroy {
[{key: 'status', value: selInvoice.status, title: 'Status', width: 100, type: DataTypeEnum.NUMBER}]
// 'status', 'expires_at_str', 'paid_at_str', 'pay_index', 'label', 'bolt11', 'payment_hash', 'msatoshi', 'msatoshi_received', 'description'
];
this.store.dispatch(new RTLActions.OpenAlert({ width: '55%', data: {
this.store.dispatch(new RTLActions.OpenAlert({ data: {
type: AlertTypeEnum.INFORMATION,
alertTitle: 'Invoice Information',
message: reorderedInvoice

2
src/app/clightning/on-chain/on-chain.component.ts
View file

@ -90,7 +90,7 @@ export class CLOnChainComponent implements OnInit, OnDestroy {
const reorderedTransaction = [
[{key: 'address', value: this.transaction.address, title: 'Address', width: 100, type: DataTypeEnum.NUMBER}]
];
this.store.dispatch(new RTLActions.OpenConfirmation({ width: '70%', data: {
this.store.dispatch(new RTLActions.OpenConfirmation({ data: {
type: AlertTypeEnum.CONFIRM,
alertTitle: 'Confirm Send Funds',
message: reorderedTransaction,

2
src/app/clightning/payments/query-routes/query-routes.component.ts
View file

@ -87,7 +87,7 @@ export class CLQueryRoutesComponent implements OnInit, OnDestroy {
[{key: 'id', value: selRoute.id, title: 'ID', width: 100, type: DataTypeEnum.NUMBER}]
// 'id', 'alias', 'channel', 'direction', 'msatoshi', 'amount_msat', 'delay'
];
this.store.dispatch(new RTLActions.OpenAlert({ width: '55%', data: {
this.store.dispatch(new RTLActions.OpenAlert({ data: {
type: AlertTypeEnum.INFORMATION,
alertTitle: 'Route Information',
message: reorderedRoute

6
src/app/clightning/payments/send-receive/payments.component.ts
View file

@ -107,7 +107,7 @@ export class CLPaymentsComponent implements OnInit, OnDestroy {
];
if (undefined === this.paymentDecoded.msatoshi || this.paymentDecoded.msatoshi === 0) {
const titleMsg = 'It is an open amount invoice. Enter the amount (Sats) to pay.';
this.store.dispatch(new RTLActions.OpenConfirmation({ width: '70%', data: {
this.store.dispatch(new RTLActions.OpenConfirmation({ data: {
type: AlertTypeEnum.CONFIRM,
alertTitle: 'Enter Amount and Confirm Send Payment',
titleMessage: titleMsg,
@ -130,7 +130,7 @@ export class CLPaymentsComponent implements OnInit, OnDestroy {
const reorderedDecodedPayment = [
[{key: 'amount_msat', value: this.paymentDecoded.amount_msat, title: 'Amount (mSat)', width: 100, type: DataTypeEnum.NUMBER}]
];
this.store.dispatch(new RTLActions.OpenConfirmation({ width: '40%', data: {
this.store.dispatch(new RTLActions.OpenConfirmation({ data: {
type: AlertTypeEnum.CONFIRM,
alertTitle: 'Confirm Send Payment',
titleMessage: 'Send Payment',
@ -177,7 +177,7 @@ export class CLPaymentsComponent implements OnInit, OnDestroy {
[{key: 'id', value: selPayment.id, title: 'Status', width: 100, type: DataTypeEnum.NUMBER}]
// 'id', 'bolt11', 'created_at_str', 'created_at', 'destination', 'status', 'msatoshi', 'msatoshi_sent', 'payment_hash', 'payment_preimage','amount_msat', 'amount_sent_msat'
];
this.store.dispatch(new RTLActions.OpenAlert({ width: '55%', data: {
this.store.dispatch(new RTLActions.OpenAlert({ data: {
type: AlertTypeEnum.INFORMATION,
alertTitle: 'Payment Information',
message: reorderedPayment

4
src/app/clightning/peers/peers.component.ts
View file

@ -109,7 +109,7 @@ export class CLPeersComponent implements OnInit, OnDestroy {
[{key: 'status', value: selPeer.status, title: 'Status', width: 100, type: DataTypeEnum.NUMBER}]
// 'id', 'alias', 'connected', 'netaddr', 'globalfeatures', 'localfeatures'
];
this.store.dispatch(new RTLActions.OpenAlert({ width: '40%', data: {
this.store.dispatch(new RTLActions.OpenAlert({ data: {
type: AlertTypeEnum.INFORMATION,
alertTitle: 'Peer Information',
message: reorderedPeer
@ -126,7 +126,7 @@ export class CLPeersComponent implements OnInit, OnDestroy {
onPeerDetach(peerToDetach: PeerCL) {
const msg = 'Detach peer: ' + peerToDetach.id;
this.store.dispatch(new RTLActions.OpenConfirmation({ width: '70%', data: { type: AlertTypeEnum.CONFIRM, alertTitle: 'Confirm Disconnect Peer', titleMessage: msg, noBtnText: 'Cancel', yesBtnText: 'Detach'}}));
this.store.dispatch(new RTLActions.OpenConfirmation({ data: { type: AlertTypeEnum.CONFIRM, alertTitle: 'Confirm Disconnect Peer', titleMessage: msg, noBtnText: 'Cancel', yesBtnText: 'Detach'}}));
this.rtlEffects.closeConfirm
.pipe(takeUntil(this.unSubs[3]))
.subscribe(confirmRes => {

6
src/app/clightning/store/cl.effects.ts
View file

@ -213,7 +213,7 @@ export class CLEffects implements OnDestroy {
map((postRes: any) => {
this.logger.info(postRes);
this.store.dispatch(new RTLActions.CloseSpinner());
this.store.dispatch(new RTLActions.OpenAlert({ width: '55%', data: { type: AlertTypeEnum.SUCCESS, alertTitle: 'Peer Connected', titleMessage: 'Peer Added Successfully!' }}));
this.store.dispatch(new RTLActions.OpenAlert({ data: { type: AlertTypeEnum.SUCCESS, alertTitle: 'Peer Connected', titleMessage: 'Peer Added Successfully!' }}));
return {
type: RTLActions.SET_PEERS_CL,
payload: (postRes && postRes.length > 0) ? postRes : []
@ -236,7 +236,7 @@ export class CLEffects implements OnDestroy {
map((postRes: any) => {
this.logger.info(postRes);
this.store.dispatch(new RTLActions.CloseSpinner());
this.store.dispatch(new RTLActions.OpenAlert({ width: '55%', data: { type: AlertTypeEnum.SUCCESS, alertTitle: 'Peer Disconnected', titleMessage: 'Peer Disconnected Successfully!' }}));
this.store.dispatch(new RTLActions.OpenAlert({ data: { type: AlertTypeEnum.SUCCESS, alertTitle: 'Peer Disconnected', titleMessage: 'Peer Disconnected Successfully!' }}));
return {
type: RTLActions.REMOVE_PEER_CL,
payload: { id: action.payload.id }
@ -305,7 +305,7 @@ export class CLEffects implements OnDestroy {
map((postRes: any) => {
this.logger.info(postRes);
this.store.dispatch(new RTLActions.CloseSpinner());
this.store.dispatch(new RTLActions.OpenAlert({ width: '55%', data: { type: AlertTypeEnum.SUCCESS, alertTitle: 'Channel Updated', titleMessage: 'Channel Updated Successfully!' }}));
this.store.dispatch(new RTLActions.OpenAlert({ data: { type: AlertTypeEnum.SUCCESS, alertTitle: 'Channel Updated', titleMessage: 'Channel Updated Successfully!' }}));
return {
type: RTLActions.FETCH_CHANNELS_CL
};

6
src/app/lnd/home/home.component.html
View file

@ -4,7 +4,7 @@
<span class="page-title">{{!flgLoading[0] ? 'Welcome! Your node is up and running.' : 'Error! Please check the server connection.'}}</span>
</div>
<mat-grid-list cols="10" rowHeight="330px">
<mat-grid-tile *ngFor="let card of operatorCards | async" [colspan]="card.cols" [rowspan]="card.rows">
<mat-grid-tile *ngFor="let card of operatorCards" [colspan]="card.cols" [rowspan]="card.rows">
<mat-card fxLayout="column" fxLayoutAlign="start start" class="dashboard-card p-16">
<mat-card-header>
<mat-card-title>
@ -30,8 +30,8 @@
<fa-icon [icon]="faSmile" class="page-title-img mr-1"></fa-icon>
<span class="page-title">Welcome! Your node is up and running.</span>
</div>
<mat-grid-list cols="3" rowHeight="66px">
<mat-grid-tile *ngFor="let card of merchantCards | async" [colspan]="card.cols" [rowspan]="card.rows">
<mat-grid-list cols="6" rowHeight="66px">
<mat-grid-tile *ngFor="let card of merchantCards" [colspan]="card.cols" [rowspan]="card.rows">
<mat-card fxLayout="column" fxLayoutAlign="start start" class="dashboard-card" [ngClass]="{'p-16': card.id !== 'transactions'}">
<mat-card-header *ngIf="card.id !== 'transactions'"><mat-card-title>{{card.title}}</mat-card-title></mat-card-header>
<mat-card-content class="dashboard-card-content w-100" fxFlex="{{card.id !== 'transactions' ? 95 : 100}}">

86
src/app/lnd/home/home.component.ts
View file

@ -1,6 +1,4 @@
import { Component, OnInit, OnDestroy } from '@angular/core';
import { map } from 'rxjs/operators';
import { Breakpoints, BreakpointObserver } from '@angular/cdk/layout';
import { Subject } from 'rxjs';
import { takeUntil, filter } from 'rxjs/operators';
import { Store } from '@ngrx/store';
@ -9,7 +7,7 @@ import { faSmile, faFrown } from '@fortawesome/free-regular-svg-icons';
import { LoggerService } from '../../shared/services/logger.service';
import { CommonService } from '../../shared/services/common.service';
import { UserPersonaEnum } from '../../shared/services/consts-enums-functions';
import { UserPersonaEnum, ScreenSizeEnum } from '../../shared/services/consts-enums-functions';
import { ChannelsStatus, GetInfo, Fees, Channel } from '../../shared/models/lndModels';
import { SelNodeChild } from '../../shared/models/RTLconfig';
import * as fromRTLReducer from '../../store/rtl.reducers';
@ -40,53 +38,61 @@ export class HomeComponent implements OnInit, OnDestroy {
public allOutboundChannels: Channel[] = [];
public totalInboundLiquidity = 0;
public totalOutboundLiquidity = 0;
public operatorCards = [];
public merchantCards = [];
public screenSize = '';
public flgLoading: Array<Boolean | 'error'> = [true, true, true, true, true, true, true, true]; // 0: Info, 1: Fee, 2: Wallet, 3: Channel, 4: Network
private unSubs: Array<Subject<void>> = [new Subject(), new Subject(), new Subject()];
public operatorCards = this.breakpointObserver.observe(Breakpoints.Handset).pipe(
map(({ matches }) => {
if (matches) {
return [
{ id: 'node', title: 'Node Details', cols: 10, rows: 1 },
{ id: 'balance', title: 'Balances', cols: 10, rows: 1 },
{ id: 'fee', title: 'Routing Fee Earned', cols: 10, rows: 1 },
{ id: 'status', title: 'Channel Status', cols: 10, rows: 1 },
{ id: 'capacity', title: 'Channel Capacity', cols: 10, rows: 1 }
];
}
return [
constructor(private logger: LoggerService, private store: Store<fromRTLReducer.RTLState>, private actions$: Actions, private commonService: CommonService) {
this.screenSize = this.commonService.getScreenSize();
if(this.screenSize === ScreenSizeEnum.XS) {
this.operatorCards = [
{ id: 'node', title: 'Node Details', cols: 10, rows: 1 },
{ id: 'balance', title: 'Balances', cols: 10, rows: 1 },
{ id: 'fee', title: 'Routing Fee Earned', cols: 10, rows: 1 },
{ id: 'status', title: 'Channel Status', cols: 10, rows: 1 },
{ id: 'capacity', title: 'Channel Capacity', cols: 10, rows: 2 }
];
this.merchantCards = [
{ id: 'node', title: 'Node Details', cols: 6, rows: 3 },
{ id: 'balance', title: 'Balances', cols: 6, rows: 3 },
{ id: 'transactions', title: 'Transactions', cols: 6, rows: 4 },
{ id: 'inboundLiq', title: 'In-Bound Liquidity', cols: 6, rows: 8 },
{ id: 'outboundLiq', title: 'Out-Bound Liquidity', cols: 6, rows: 8 }
];
} else if(this.screenSize === ScreenSizeEnum.SM || this.screenSize === ScreenSizeEnum.MD) {
this.operatorCards = [
{ id: 'node', title: 'Node Details', cols: 5, rows: 1 },
{ id: 'balance', title: 'Balances', cols: 5, rows: 1 },
{ id: 'fee', title: 'Routing Fee Earned', cols: 5, rows: 1 },
{ id: 'status', title: 'Channel Status', cols: 5, rows: 1 },
{ id: 'capacity', title: 'Channel Capacity', cols: 10, rows: 2 }
];
this.merchantCards = [
{ id: 'node', title: 'Node Details', cols: 3, rows: 3 },
{ id: 'balance', title: 'Balances', cols: 3, rows: 3 },
{ id: 'transactions', title: 'Transactions', cols: 6, rows: 4 },
{ id: 'inboundLiq', title: 'In-Bound Liquidity', cols: 3, rows: 8 },
{ id: 'outboundLiq', title: 'Out-Bound Liquidity', cols: 3, rows: 8 }
];
} else {
this.operatorCards = [
{ id: 'node', title: 'Node Details', cols: 3, rows: 1 },
{ id: 'balance', title: 'Balances', cols: 3, rows: 1 },
{ id: 'capacity', title: 'Channel Capacity', cols: 4, rows: 2 },
{ id: 'fee', title: 'Routing Fee Earned', cols: 3, rows: 1 },
{ id: 'status', title: 'Channel Status', cols: 3, rows: 1 }
];
})
);
public merchantCards = this.breakpointObserver.observe(Breakpoints.Handset).pipe(
map(({ matches }) => {
if (matches) {
return [
{ id: 'node', title: 'Node Details', cols: 3, rows: 3 },
{ id: 'balance', title: 'Balances', cols: 3, rows: 3 },
{ id: 'transactions', title: 'Transactions', cols: 3, rows: 4 },
{ id: 'inboundLiq', title: 'In-Bound Liquidity', cols: 3, rows: 8 },
{ id: 'outboundLiq', title: 'Out-Bound Liquidity', cols: 3, rows: 8 }
];
}
return [
{ id: 'node', title: 'Node Details', cols: 1, rows: 3 },
{ id: 'inboundLiq', title: 'In-Bound Liquidity', cols: 1, rows: 10 },
{ id: 'outboundLiq', title: 'Out-Bound Liquidity', cols: 1, rows: 10 },
{ id: 'balance', title: 'Balances', cols: 1, rows: 3 },
{ id: 'transactions', title: 'Transactions', cols: 1, rows: 4 }
this.merchantCards = [
{ id: 'node', title: 'Node Details', cols: 2, rows: 3 },
{ id: 'inboundLiq', title: 'In-Bound Liquidity', cols: 2, rows: 10 },
{ id: 'outboundLiq', title: 'Out-Bound Liquidity', cols: 2, rows: 10 },
{ id: 'balance', title: 'Balances', cols: 2, rows: 3 },
{ id: 'transactions', title: 'Transactions', cols: 2, rows: 4 }
];
})
);
constructor(private logger: LoggerService, private store: Store<fromRTLReducer.RTLState>, private actions$: Actions, private breakpointObserver: BreakpointObserver, private commonService: CommonService) {}
}
}
ngOnInit() {
this.store.select('lnd')

2
src/app/lnd/home/node-info/node-info.component.html
View file

@ -2,8 +2,8 @@
<div fxFlex="33">
<h4 fxLayoutAlign="start" class="font-bold-500">Alias</h4>
<div class="foreground-secondary-text">
<span class="dot" [ngStyle]="{'backgroundColor': information.color}"></span>
{{information.alias}}
<span class="dot ml-1" [ngStyle]="{'backgroundColor': information.color}"></span>
</div>
</div>
<div fxFlex="33">

4
src/app/lnd/on-chain/on-chain-receive/on-chain-receive.component.html
View file

@ -1,13 +1,13 @@
<div fxLayout="column">
<div fxLayout="row" fxLayoutAlign="space-between end" fxLayoutAlign.gt-sm="start end">
<mat-form-field fxFlex="48" fxFlex.gt-sm="25" fxLayoutAlign="start end">
<mat-form-field fxFlex="48" fxFlex.gt-md="25" fxLayoutAlign="start end">
<mat-select [(ngModel)]="selectedAddressType" placeholder="Address Type" name="address_type" tabindex="1">
<mat-option *ngFor="let addressType of addressTypes" [value]="addressType">
{{addressType.addressTp}}
</mat-option>
</mat-select>
</mat-form-field>
<div class="mt-2" fxFlex="48" fxFlex.gt-sm="25">
<div class="mt-2" fxFlex="48" fxFlex.gt-md="25">
<button fxFlex="100" fxLayoutAlign="center center" mat-raised-button color="primary" (click)="onGenerateAddress()" [disabled]="undefined === selectedAddressType.addressId" tabindex="2" class="top-minus-15px">Generate Address</button>
</div>
</div>

16
src/app/lnd/on-chain/on-chain-send/on-chain-send.component.html
View file

@ -1,4 +1,4 @@
<div fxLayout="column" fxFlex="98" fxLayout.gt-sm="row wrap" fxLayoutAlign="start start" fxLayoutAlign.gt-sm="space-between start" *ngIf="!sweepAll; else sweepAllBlock;">
<div fxLayout="column" fxFlex="98" fxLayout.gt-sm="row wrap" fxLayoutAlign="start stretch" fxLayoutAlign.gt-sm="space-between start" *ngIf="!sweepAll; else sweepAllBlock;" class="overflow-x-hidden">
<mat-form-field fxFlex.gt-sm="55">
<input matInput [(ngModel)]="transaction.address" placeholder="Bitcoin Address" tabindex="1" name="address" #address="ngModel">
</mat-form-field>
@ -11,7 +11,7 @@
<mat-option *ngFor="let amountUnit of amountUnits" [value]="amountUnit">{{amountUnit}}</mat-option>
</mat-select>
</mat-form-field>
<div fxLayout="column" fxFlex="100" fxFlex.gt-sm="60" fxLayout.gt-sm="row wrap" fxLayoutAlign="start start" fxLayoutAlign.gt-sm="space-between start">
<div fxLayout="column" fxFlex="100" fxFlex.gt-sm="60" fxLayout.gt-sm="row wrap" fxLayoutAlign="start stretch" fxLayoutAlign.gt-sm="space-between start">
<mat-form-field fxFlex="48">
<mat-select [(value)]="selTransType" tabindex="4">
<mat-option *ngFor="let transType of transTypes" [value]="transType.id">
@ -40,9 +40,9 @@
</div>
<ng-template #sweepAllBlock>
<div fxLayout="column" fxFlex="100">
<div fxLayout="column" fxFlex="100" fxLayout.gt-sm="row wrap" fxLayoutAlign="start start" fxLayoutAlign.gt-sm="space-between start">
<div fxLayout="column" fxFlex="98" fxLayout.gt-sm="row wrap" fxLayoutAlign="start stretch" fxLayoutAlign.gt-sm="space-between start" class="overflow-x-hidden">
<mat-form-field fxFlex.gt-sm="55">
<input matInput [(ngModel)]="transaction.address" placeholder="Bitcoin Address" tabindex="1" name="address" #address="ngModel">
<input matInput [(ngModel)]="transaction.address" placeholder="Bitcoin Address" tabindex="1" name="address" #addressSweep="ngModel">
</mat-form-field>
<mat-form-field fxFlex.gt-sm="20">
<mat-select [(value)]="selTransType" tabindex="4">
@ -55,15 +55,15 @@
<input matInput [(ngModel)]="transaction.blocks" placeholder="Number of Blocks" type="number" name="blocks" step="1" min="0" required tabindex="5" #blocks="ngModel">
</mat-form-field>
<mat-form-field fxFlex.gt-sm="20" fxLayoutAlign="start end" *ngIf="selTransType=='2'">
<input matInput [(ngModel)]="transaction.fees" placeholder="Fee ({{nodeData?.smaller_currency_unit}}/Byte)" type="number" name="fees" step="1" min="0" required tabindex="6" #fees="ngModel">
<input matInput [(ngModel)]="transaction.fees" placeholder="Fee ({{nodeData?.smaller_currency_unit}}/Byte)" type="number" name="fees" step="1" min="0" required tabindex="6" #feesSweep="ngModel">
</mat-form-field>
</div>
<div>
<div fxFlex="30" fxLayout="row wrap" fxLayoutAlign="space-between start">
<div fxFlex="100" fxFlex.gt-sm="30" fxLayout="row wrap" fxLayoutAlign="space-between start">
<button fxFlex="48" fxLayoutAlign="center center" mat-stroked-button color="primary" tabindex="7" type="reset" (click)="resetData()">Clear Fields</button>
<button fxFlex="48" fxLayoutAlign="center center" mat-raised-button color="primary" [disabled]="invalidValues" type="submit" tabindex="8" (click)="onSendFunds()">
<p *ngIf="invalidValues && (address.touched || address.dirty); else sendText">Invalid Values</p>
<ng-template #sendText><p>Send Funds</p></ng-template>
<p *ngIf="invalidValues && (addressSweep.touched || addressSweep.dirty); else sendTextSweep">Invalid Values</p>
<ng-template #sendTextSweep><p>Send Funds</p></ng-template>
</button>
</div>
</div>

4
src/app/lnd/on-chain/on-chain-send/on-chain-send.component.ts
View file

@ -118,7 +118,7 @@ export class OnChainSendComponent implements OnInit, OnDestroy {
confirmationMsg[1].push({key: 'fees_per_byte', value: this.transaction.fees, title: 'Fee (' + this.nodeData.smaller_currency_unit + '/Byte)', width: 50, type: DataTypeEnum.NUMBER});
}
if (this.sweepAll && !+this.appConfig.sso.rtlSSO) {
this.store.dispatch(new RTLActions.OpenConfirmation({ width: '55%', data: {
this.store.dispatch(new RTLActions.OpenConfirmation({ data: {
type: AlertTypeEnum.CONFIRM,
alertTitle: 'Confirm Payment',
titleMessage: 'Please authorize to sweep all funds with login password.',
@ -129,7 +129,7 @@ export class OnChainSendComponent implements OnInit, OnDestroy {
getInputs: [{placeholder: 'Enter Login Password', inputType: 'password', inputValue: ''}]
}}));
} else {
this.store.dispatch(new RTLActions.OpenConfirmation({ width: '55%', data: {
this.store.dispatch(new RTLActions.OpenConfirmation({ data: {
type: AlertTypeEnum.CONFIRM,
alertTitle: 'Confirm Payment',
message: confirmationMsg,

36
src/app/lnd/on-chain/on-chain-transaction-history/on-chain-transaction-history.component.ts
View file

@ -7,10 +7,10 @@ import { faHistory } from '@fortawesome/free-solid-svg-icons';
import { MatTableDataSource, MatSort, MatPaginator, MatPaginatorIntl } from '@angular/material';
import { Transaction } from '../../../shared/models/lndModels';
import { PAGE_SIZE, PAGE_SIZE_OPTIONS, getPaginatorLabel, AlertTypeEnum, DataTypeEnum } from '../../../shared/services/consts-enums-functions';
import { PAGE_SIZE, PAGE_SIZE_OPTIONS, getPaginatorLabel, AlertTypeEnum, DataTypeEnum, ScreenSizeEnum } from '../../../shared/services/consts-enums-functions';
import { LoggerService } from '../../../shared/services/logger.service';
import { CommonService } from '../../../shared/services/common.service';
import { RTLEffects } from '../../../store/rtl.effects';
import * as RTLActions from '../../../store/rtl.actions';
import * as fromRTLReducer from '../../../store/rtl.reducers';
@ -34,25 +34,17 @@ export class OnChainTransactionHistoryComponent implements OnInit, OnDestroy {
public pageSizeOptions = PAGE_SIZE_OPTIONS;
private unsub: Array<Subject<void>> = [new Subject(), new Subject(), new Subject()];
constructor(private logger: LoggerService, private store: Store<fromRTLReducer.RTLState>, private rtlEffects: RTLEffects, private actions$: Actions) {
switch (true) {
case (window.innerWidth <= 415):
this.displayedColumns = ['time_stamp_str', 'amount', 'actions'];
break;
case (window.innerWidth > 415 && window.innerWidth <= 730):
this.displayedColumns = ['time_stamp_str', 'amount', 'num_confirmations', 'actions'];
break;
case (window.innerWidth > 730 && window.innerWidth <= 1024):
this.displayedColumns = ['time_stamp_str', 'amount', 'num_confirmations', 'actions'];
break;
case (window.innerWidth > 1024 && window.innerWidth <= 1280):
this.flgSticky = true;
this.displayedColumns = ['time_stamp_str', 'amount', 'num_confirmations', 'actions'];
break;
default:
this.flgSticky = true;
this.displayedColumns = ['time_stamp_str', 'amount', 'num_confirmations', 'actions'];
break;
constructor(private logger: LoggerService, private commonService: CommonService, private store: Store<fromRTLReducer.RTLState>, private actions$: Actions) {
let ss = this.commonService.getScreenSize();
if(ss === ScreenSizeEnum.XS) {
this.flgSticky = false;
this.displayedColumns = ['time_stamp_str', 'amount', 'actions'];
} else if(ss === ScreenSizeEnum.SM || ss === ScreenSizeEnum.MD) {
this.flgSticky = false;
this.displayedColumns = ['time_stamp_str', 'amount', 'num_confirmations', 'actions'];
} else if(ss === ScreenSizeEnum.LG) {
this.flgSticky = true;
this.displayedColumns = ['time_stamp_str', 'amount', 'num_confirmations', 'actions'];
}
}
@ -104,7 +96,7 @@ export class OnChainTransactionHistoryComponent implements OnInit, OnDestroy {
[{key: 'amount', value: selTransaction.amount, title: 'Amount (Sats)', width: 50, type: DataTypeEnum.NUMBER},
{key: 'active', value: selTransaction.active, title: 'Active', width: 50, type: DataTypeEnum.BOOLEAN}]
];
this.store.dispatch(new RTLActions.OpenAlert({ width: '40%', data: {
this.store.dispatch(new RTLActions.OpenAlert({ data: {
type: AlertTypeEnum.INFORMATION,
alertTitle: 'Transaction Information',
message: reorderedTransactions,

2
src/app/lnd/on-chain/on-chain.component.html
View file

@ -16,7 +16,7 @@
<div fxLayout="column" class="padding-gap-x">
<mat-card>
<mat-card-content fxLayout="column">
<mat-tab-group>
<mat-tab-group class="lightning-send-tab">
<mat-tab label="Send">
<rtl-on-chain-send [sweepAll]="false"></rtl-on-chain-send>
</mat-tab>

2
src/app/lnd/peers-channels/channels/channels-tables/channel-backup-table/channel-backup-table.component.ts
View file

@ -115,7 +115,7 @@ export class ChannelBackupTableComponent implements OnInit, OnDestroy {
{key: 'pending_htlcs', value: selChannel.pending_htlcs, title: 'Pending HTLCs', width: 30, type: DataTypeEnum.NUMBER},
{key: 'csv_delay', value: selChannel.csv_delay, title: 'CSV Delay', width: 30, type: DataTypeEnum.NUMBER}]
];
this.store.dispatch(new RTLActions.OpenAlert({ width: '55%', data: {
this.store.dispatch(new RTLActions.OpenAlert({ data: {
type: AlertTypeEnum.INFORMATION,
alertTitle: 'channel Information',
message: reorderedChannel

2
src/app/lnd/peers-channels/channels/channels-tables/channel-closed-table/channel-closed-table.component.ts
View file

@ -100,7 +100,7 @@ export class ChannelClosedTableComponent implements OnInit, OnDestroy {
{key: 'close_height', value: selChannel.close_height, title: 'Close Height', width: 30, type: DataTypeEnum.NUMBER}],
[{key: 'closing_tx_hash', value: selChannel.closing_tx_hash, title: 'Closing Transaction Hash', width: 100, type: DataTypeEnum.STRING}]
];
this.store.dispatch(new RTLActions.OpenAlert({ width: '55%', data: {
this.store.dispatch(new RTLActions.OpenAlert({ data: {
type: AlertTypeEnum.INFORMATION,
alertTitle: 'Closed Channel Information',
message: reorderedChannel

8
src/app/lnd/peers-channels/channels/channels-tables/channel-open-table/channel-open-table.component.ts
View file

@ -86,7 +86,7 @@ export class ChannelOpenTableComponent implements OnInit, OnDestroy {
if (channelToUpdate === 'all') {
const titleMsg = 'Updated Values for ALL Channels';
const confirmationMsg = [];
this.store.dispatch(new RTLActions.OpenConfirmation({ width: '55%', data: {
this.store.dispatch(new RTLActions.OpenConfirmation({ data: {
type: AlertTypeEnum.CONFIRM,
alertTitle: 'Update Channel',
titleMessage: titleMsg,
@ -130,7 +130,7 @@ export class ChannelOpenTableComponent implements OnInit, OnDestroy {
this.store.dispatch(new RTLActions.CloseSpinner());
const titleMsg = 'Update values for channel point: ' + channelToUpdate.channel_point;
const confirmationMsg = [];
this.store.dispatch(new RTLActions.OpenConfirmation({ width: '55%', data: {
this.store.dispatch(new RTLActions.OpenConfirmation({ data: {
type: AlertTypeEnum.CONFIRM,
alertTitle: 'Update Channel',
titleMessage: titleMsg,
@ -161,7 +161,7 @@ export class ChannelOpenTableComponent implements OnInit, OnDestroy {
}
onChannelClose(channelToClose: Channel) {
this.store.dispatch(new RTLActions.OpenConfirmation({width: '55%', data: {
this.store.dispatch(new RTLActions.OpenConfirmation({ data: {
type: AlertTypeEnum.CONFIRM,
alertTitle: 'Close Channel',
titleMessage: 'Closing channel: ' + channelToClose.channel_point,
@ -209,7 +209,7 @@ export class ChannelOpenTableComponent implements OnInit, OnDestroy {
{key: 'pending_htlcs', value: selChannel.pending_htlcs, title: 'Pending HTLCs', width: 30, type: DataTypeEnum.NUMBER},
{key: 'csv_delay', value: selChannel.csv_delay, title: 'CSV Delay', width: 30, type: DataTypeEnum.NUMBER}]
];
this.store.dispatch(new RTLActions.OpenAlert({ width: '55%', data: {
this.store.dispatch(new RTLActions.OpenAlert({ data: {
type: AlertTypeEnum.INFORMATION,
alertTitle: 'Channel Information',
message: reorderedChannel

8
src/app/lnd/peers-channels/channels/channels-tables/channel-pending-table/channel-pending-table.component.ts
View file

@ -128,7 +128,7 @@ export class ChannelPendingTableComponent implements OnInit, OnDestroy {
{key: 'commit_weight', value: preOrderedChannel.commit_weight, title: 'Commit Weight', width: 30, type: DataTypeEnum.NUMBER},
{key: 'commit_fee', value: preOrderedChannel.commit_fee, title: 'Commit Fee', width: 30, type: DataTypeEnum.NUMBER}]
];
this.store.dispatch(new RTLActions.OpenAlert({ width: '55%', data: {
this.store.dispatch(new RTLActions.OpenAlert({ data: {
type: AlertTypeEnum.INFORMATION,
alertTitle: 'Opening Channel Information',
message: reorderedChannel
@ -155,7 +155,7 @@ export class ChannelPendingTableComponent implements OnInit, OnDestroy {
{key: 'blocks_til_maturity', value: preOrderedChannel.blocks_til_maturity, title: 'Blocks Till Maturity', width: 30, type: DataTypeEnum.NUMBER},
{key: 'recovered_balance', value: preOrderedChannel.recovered_balance, title: 'Recovered Balance', width: 30, type: DataTypeEnum.NUMBER}]
];
this.store.dispatch(new RTLActions.OpenAlert({ width: '55%', data: {
this.store.dispatch(new RTLActions.OpenAlert({ data: {
type: AlertTypeEnum.INFORMATION,
alertTitle: 'Force Closing Channel Information',
message: reorderedChannel
@ -178,7 +178,7 @@ export class ChannelPendingTableComponent implements OnInit, OnDestroy {
[{key: 'capacity', value: preOrderedChannel.capacity, title: 'Capacity', width: 50, type: DataTypeEnum.NUMBER},
{key: 'closing_txid', value: preOrderedChannel.closing_txid, title: 'Closing Transaction ID', width: 50, type: DataTypeEnum.STRING}]
];
this.store.dispatch(new RTLActions.OpenAlert({ width: '55%', data: {
this.store.dispatch(new RTLActions.OpenAlert({ data: {
type: AlertTypeEnum.INFORMATION,
alertTitle: 'Closing Channel Information',
message: reorderedChannel
@ -201,7 +201,7 @@ export class ChannelPendingTableComponent implements OnInit, OnDestroy {
[{key: 'capacity', value: preOrderedChannel.capacity, title: 'Capacity', width: 50, type: DataTypeEnum.NUMBER},
{key: 'limbo_balance', value: preOrderedChannel.limbo_balance, title: 'Limbo Balance', width: 50, type: DataTypeEnum.NUMBER}]
];
this.store.dispatch(new RTLActions.OpenAlert({ width: '55%', data: {
this.store.dispatch(new RTLActions.OpenAlert({ data: {
type: AlertTypeEnum.INFORMATION,
alertTitle: 'Wait Closing Channel Information',
message: reorderedChannel

6
src/app/lnd/peers-channels/peers/peers.component.ts
View file

@ -144,7 +144,7 @@ export class PeersComponent implements OnInit, OnDestroy {
[{key: 'sat_sent', value: selPeer.sat_sent, title: 'Satoshis Sent', width: 50, type: DataTypeEnum.NUMBER}, {key: 'sat_recv', value: selPeer.sat_recv, title: 'Satoshis Received', width: 50, type: DataTypeEnum.NUMBER}],
[{key: 'bytes_sent', value: selPeer.bytes_sent, title: 'Bytes Sent', width: 50, type: DataTypeEnum.NUMBER}, {key: 'bytes_recv', value: selPeer.bytes_recv, title: 'Bytes Received', width: 50, type: DataTypeEnum.NUMBER}],
];
this.store.dispatch(new RTLActions.OpenAlert({ width: '55%', data: {
this.store.dispatch(new RTLActions.OpenAlert({ data: {
type: AlertTypeEnum.INFORMATION,
alertTitle: 'Peer Information',
showQRName: 'Public Key',
@ -163,7 +163,7 @@ export class PeersComponent implements OnInit, OnDestroy {
information: this.information,
balance: this.availableBalance
};
this.store.dispatch(new RTLActions.OpenAlert({ width: '50%', data: {
this.store.dispatch(new RTLActions.OpenAlert({ data: {
alertTitle: 'Open Channel',
message: peerToAddChannelMessage,
newlyAdded: false,
@ -173,7 +173,7 @@ export class PeersComponent implements OnInit, OnDestroy {
onPeerDetach(peerToDetach: Peer) {
const msg = 'Disconnect peer: ' + ((peerToDetach.alias) ? peerToDetach.alias : peerToDetach.pub_key);
this.store.dispatch(new RTLActions.OpenConfirmation({ width: '55%', data: {
this.store.dispatch(new RTLActions.OpenConfirmation({ data: {
type: AlertTypeEnum.CONFIRM,
alertTitle: 'Disconnect Peer',
titleMessage: msg,

2
src/app/lnd/routing/forwarding-history/forwarding-history.component.ts
View file

@ -69,7 +69,7 @@ export class ForwardingHistoryComponent implements OnInit, OnChanges {
{key: 'alias_out', value: selFEvent.alias_out, title: 'Outbound Peer Alias', width: 25, type: DataTypeEnum.STRING},
{key: 'chan_id_out', value: selFEvent.chan_id_out, title: 'Outbound Channel ID', width: 25, type: DataTypeEnum.STRING}]
];
this.store.dispatch(new RTLActions.OpenAlert({ width: '55%', data: {
this.store.dispatch(new RTLActions.OpenAlert({ data: {
type: AlertTypeEnum.INFORMATION,
alertTitle: 'Event Information',
message: reorderedFHEvent

2
src/app/lnd/routing/routing-peers/routing-peers.component.ts
View file

@ -75,7 +75,7 @@ export class RoutingPeersComponent implements OnInit, OnChanges {
[{key: 'events', value: selRPeer.events, title: 'Events', width: 50, type: DataTypeEnum.NUMBER},
{key: 'total_amount', value: selRPeer.total_amount, title: 'Total Amount (Sats)', width: 50, type: DataTypeEnum.NUMBER}]
];
this.store.dispatch(new RTLActions.OpenAlert({ width: '55%', data: {
this.store.dispatch(new RTLActions.OpenAlert({ data: {
type: AlertTypeEnum.INFORMATION,
alertTitle: alertTitle,
message: reorderedRoutingPeer

12
src/app/lnd/store/lnd.effects.ts
View file

@ -164,7 +164,7 @@ export class LNDEffects implements OnDestroy {
map((postRes: any) => {
this.logger.info(postRes);
this.store.dispatch(new RTLActions.CloseSpinner());
this.store.dispatch(new RTLActions.OpenAlert({ width: '55%', data: {
this.store.dispatch(new RTLActions.OpenAlert({ data: {
type: AlertTypeEnum.SUCCESS,
alertTitle: 'Peer Disconnected',
titleMessage: 'Peer Disconnected Successfully!'
@ -200,7 +200,7 @@ export class LNDEffects implements OnDestroy {
postRes.creation_date_str = new Date(+postRes.creation_date * 1000).toUTCString().substring(5, 22).replace(' ', '/').replace(' ', '/').toUpperCase();
this.logger.info(postRes);
this.store.dispatch(new RTLActions.CloseSpinner());
this.store.dispatch(new RTLActions.OpenAlert({ width: '58%', data: {
this.store.dispatch(new RTLActions.OpenAlert({ data: {
invoice: postRes,
newlyAdded: true,
component: InvoiceInformationComponent
@ -255,7 +255,7 @@ export class LNDEffects implements OnDestroy {
map((postRes: any) => {
this.logger.info(postRes);
this.store.dispatch(new RTLActions.CloseSpinner());
this.store.dispatch(new RTLActions.OpenAlert({ width: '55%', data: { type: AlertTypeEnum.SUCCESS, alertTitle: 'Channel Updated', titleMessage: 'Channel Updated Successfully!' }}));
this.store.dispatch(new RTLActions.OpenAlert({ data: { type: AlertTypeEnum.SUCCESS, alertTitle: 'Channel Updated', titleMessage: 'Channel Updated Successfully!' }}));
return {
type: RTLActions.FETCH_ALL_CHANNELS
};
@ -454,12 +454,12 @@ export class LNDEffects implements OnDestroy {
type: RTLActions.SET_ALL_CHANNELS,
payload: (channels && channels.channels && channels.channels.length > 0) ? channels.channels : []
};
},
}),
catchError((err: any) => {
this.handleErrorWithoutAlert('FetchChannels/all', err);
return of({type: RTLActions.VOID});
})
));
);
}
));
@ -650,7 +650,7 @@ export class LNDEffects implements OnDestroy {
msg['Total Fee (' + ((undefined === store.nodeData.smaller_currency_unit) ? CurrencyUnitEnum.SATS : store.nodeData.smaller_currency_unit) + ')'] =
(sendRes.payment_route.total_fees_msat / 1000);
Object.assign(msg, confirmationMsg);
this.store.dispatch(new RTLActions.OpenAlert({ width: '55%', data: {
this.store.dispatch(new RTLActions.OpenAlert({ data: {
type: AlertTypeEnum.SUCCESS,
alertTitle: 'Payment Sent',
titleMessage: 'Payment Sent Successfully!',

3
src/app/lnd/transactions/invoices/lightning-invoices.component.ts
View file

@ -120,8 +120,7 @@ export class LightningInvoicesComponent implements OnInit, OnDestroy {
const selInvoice = this.invoices.data.filter(invoice => {
return invoice.payment_request === selRow.payment_request;
})[0];
this.store.dispatch(new RTLActions.OpenAlert({ width: '58%',
data: {
this.store.dispatch(new RTLActions.OpenAlert({ data: {
invoice: selInvoice,
newlyAdded: false,
component: InvoiceInformationComponent

6
src/app/lnd/transactions/payments/lightning-payments.component.ts
View file

@ -126,7 +126,7 @@ export class LightningPaymentsComponent implements OnInit, OnDestroy {
{key: 'cltv_expiry', value: this.paymentDecoded.cltv_expiry, title: 'CLTV Expiry', width: 30}]
];
const titleMsg = 'It is an open amount invoice. Enter the amount (Sats) to pay.';
this.store.dispatch(new RTLActions.OpenConfirmation({ width: '55%', data: {
this.store.dispatch(new RTLActions.OpenConfirmation({ data: {
type: AlertTypeEnum.CONFIRM,
alertTitle: 'Enter Amount and Confirm Send Payment',
titleMessage: titleMsg,
@ -158,7 +158,7 @@ export class LightningPaymentsComponent implements OnInit, OnDestroy {
[{key: 'expiry', value: this.paymentDecoded.expiry, title: 'Expiry', width: 50, type: DataTypeEnum.NUMBER},
{key: 'cltv_expiry', value: this.paymentDecoded.cltv_expiry, title: 'CLTV Expiry', width: 50}]
];
this.store.dispatch(new RTLActions.OpenConfirmation({ width: '55%', data: {
this.store.dispatch(new RTLActions.OpenConfirmation({ data: {
type: AlertTypeEnum.CONFIRM,
alertTitle: 'Send Payment',
noBtnText: 'Cancel',
@ -209,7 +209,7 @@ export class LightningPaymentsComponent implements OnInit, OnDestroy {
[{key: 'value_msat', value: selPayment.value_msat, title: 'Value (mSats)', width: 50, type: DataTypeEnum.NUMBER},
{key: 'value_sat', value: selPayment.value, title: 'Value (Sats)', width: 50, type: DataTypeEnum.NUMBER}]
];
this.store.dispatch(new RTLActions.OpenAlert({ width: '55%', data: {
this.store.dispatch(new RTLActions.OpenAlert({ data: {
type: AlertTypeEnum.INFORMATION,
alertTitle: 'Payment Information',
message: reorderedPayment

2
src/app/lnd/transactions/query-routes/query-routes.component.ts
View file

@ -93,7 +93,7 @@ export class QueryRoutesComponent implements OnInit, OnDestroy {
{key: 'chan_id', value: selHop.chan_id, title: 'Channel ID', width: 30, type: DataTypeEnum.STRING},
{key: 'chan_capacity', value: selHop.chan_capacity, title: 'Channel Capacity', width: 40, type: DataTypeEnum.NUMBER}],
];
this.store.dispatch(new RTLActions.OpenAlert({ width: '55%', data: {
this.store.dispatch(new RTLActions.OpenAlert({ data: {
type: AlertTypeEnum.INFORMATION,
alertTitle: 'Route Information',
message: reorderedHop

20
src/app/shared/components/app-settings/app-settings.component.html
View file

@ -5,21 +5,21 @@
<div fxLayout="column" class="padding-gap-x settings-container">
<mat-card>
<mat-card-content fxLayout="column" class="card-content-gap">
<div fxLayout="column" fxLayout.gt-sm="row wrap" fxLayoutAlign.gt-sm="space-between center" fxLayoutAlign="center space-between">
<div fxLayout="row" fxFlex="100" fxLayoutAlign="space-between center">
<div fxLayout="column" fxLayout.gt-sm="row wrap" fxLayoutAlign.gt-sm="space-between center" fxLayoutAlign="start center">
<div fxLayout="column" fxLayout.gt-sm="row wrap" fxFlex="100" fxLayoutAlign="start stretch" class="w-100">
<div fxFlex="25">
<div fxFlex.gt-md="50" fxFlex="80">
<div fxFlex.gt-md="50" fxFlex="90">
<h4>User Persona</h4>
<mat-select [(ngModel)]="selNode.settings.userPersona" placeholder="Select User Persona" tabindex="1" required name="userPersona">
<mat-option *ngFor="let userPersona of userPersonas" [value]="userPersona">
{{userPersona}}
{{userPersona | titlecase}}
</mat-option>
</mat-select>
</div>
</div>
<div fxFlex="25" *ngIf="appConfig.nodes.length && appConfig.nodes.length > 1">
<div fxFlex.gt-md="50" fxFlex="80">
<h4>Default Selected Node</h4>
<div fxFlex.gt-md="70" fxFlex="90">
<h4>Default Node</h4>
<mat-select [(ngModel)]="appConfig.defaultNodeIndex" placeholder="Default Node" tabindex="1" required name="defaultNode">
<mat-option *ngFor="let node of appConfig.nodes" [value]="node.index">
{{node.lnNode}} ({{node.lnImplementation}})
@ -28,7 +28,7 @@
</div>
</div>
<div fxFlex="25">
<div fxFlex.gt-md="30" fxFlex="70">
<div fxFlex.gt-md="50" fxFlex="90">
<h4>Currency Unit</h4>
<mat-select [(ngModel)]="selNode.settings.currencyUnit" placeholder="Currency Unit" (selectionChange)="onCurrencyChange($event)" tabindex="1" required name="currencyUnit">
<mat-option *ngFor="let currencyUnit of currencyUnits" [value]="currencyUnit.id">
@ -38,7 +38,7 @@
</div>
</div>
<div fxFlex="25" *ngIf="selNode.lnImplementation !== 'CLT'">
<div fxFlex="60">
<div fxFlex.gt-md="50" fxFlex="90">
<h4>BTC</h4>
<div fxLayoutAlign="start center">
<span class="slider-text">{{smallerCurrencyUnit}}</span>
@ -57,7 +57,7 @@
</div>
<div fxLayout="row" fxFlex="100" fxLayoutAlign="space-between center">
<div fxFlex="50">
<div fxFlex="60">
<div fxFlex="70">
<h4>Font Size</h4>
<mat-radio-group color="primary" [(ngModel)]="selectedFontSize" (change)="chooseFontSize()">
<mat-radio-button *ngFor="let fontSize of fontSizes" [value]="fontSize">{{fontSize.name}}
@ -78,7 +78,7 @@
<div *ngIf="showSettingOption && selNode?.settings?.menu === 'vertical'" fxFlex="100" fxLayout="row"
fxLayoutAlign="space-between center">
<div fxFlex="50">
<div fxFlex="60">
<div fxFlex="70">
<h4>Menu Type</h4>
<mat-radio-group color="primary" [(ngModel)]="selectedMenuType" (change)="chooseMenuType()">
<mat-radio-button *ngFor="let menuType of menuTypes" [value]="menuType">{{menuType.name}}</mat-radio-button>

8
src/app/shared/components/data-modal/show-pubkey/show-pubkey.component.html
View file

@ -1,12 +1,12 @@
<div fxLayout="row">
<div fxFlex="30" fxLayoutAlign="center start" class="modal-qr-code-container padding-gap-large">
<qrcode qrdata="{{selInfoType.infoID === 1 ? information.uris[0] : information.identity_pubkey}}" [size]="230" [level]="'L'" [allowEmptyString]="true" class="qr-border"></qrcode>
<qrcode qrdata="{{selInfoType.infoID === 1 ? information.uris[0] : information.identity_pubkey}}" [size]="qrWidth" [level]="'L'" [allowEmptyString]="true" class="qr-border"></qrcode>
</div>
<div fxFlex="70" class="padding-gap-large pl-3">
<mat-card-header fxLayout="row" fxLayoutAlign="space-between center" class="modal-info-header mb-2">
<div fxFlex="95" fxLayoutAlign="start start">
<fa-icon [icon]="faReceipt" class="page-title-img mr-1"></fa-icon>
<span class="page-title">Show {{selInfoType.infoKey}}</span>
<span class="page-title">{{selInfoType.infoName}}</span>
</div>
<button tabindex="3" fxFlex="5" fxLayoutAlign="center" class="btn-close-x p-0" (click)="onClose()"
mat-button>X</button>
@ -14,7 +14,7 @@
<mat-card-content>
<div fxLayout="column">
<div fxLayout="row" *ngIf="information.uris && information.uris.length > 0">
<mat-form-field fxFlex="40" fxLayoutAlign="start end">
<mat-form-field fxFlex="80" fxFlex.gt-sm="40" fxLayoutAlign="start end">
<mat-select tabindex="1" [(value)]="selInfoType">
<mat-option *ngFor="let infoType of infoTypes" [value]="infoType">
{{infoType.infoName}}
@ -30,7 +30,7 @@
</div>
<mat-divider class="w-100 my-1"></mat-divider>
<div class="mt-2" fxLayout="row" fxLayoutAlign="end center">
<button autoFocus fxFlex="33" fxLayoutAlign="center center" mat-raised-button color="primary" tabindex="2"
<button autoFocus fxFlex="60" fxFlex.gt-sm="33" fxLayoutAlign="center center" mat-raised-button color="primary" tabindex="2"
type="submit" rtlClipboard payload="{{selInfoType.infoID === 1 ? information.uris[0] : information.identity_pubkey}}" (copied)="onCopyPubkey($event)">Copy {{selInfoType.infoKey}}</button>
</div>
</div>

15
src/app/shared/components/data-modal/show-pubkey/show-pubkey.component.ts
View file

@ -4,8 +4,10 @@ import { faReceipt } from '@fortawesome/free-solid-svg-icons';
import { MatSnackBar } from '@angular/material/snack-bar';
import { LoggerService } from '../../../services/logger.service';
import { CommonService } from '../../../services/common.service';
import { ShowPubkeyData } from '../../../models/alertData';
import { GetInfoRoot } from '../../../models/RTLconfig';
import { ScreenSizeEnum } from '../../../services/consts-enums-functions';
@Component({
selector: 'rtl-show-pubkey',
@ -17,11 +19,22 @@ export class ShowPubkeyComponent implements OnInit {
public information: GetInfoRoot;
public infoTypes = [{infoID: 0, infoKey: 'node pubkey', infoName: 'Node pubkey'}, { infoID: 1, infoKey: 'node URI', infoName: 'Node URI'}];
public selInfoType = this.infoTypes[0];
public qrWidth = 230;
public screenSize = '';
constructor(public dialogRef: MatDialogRef<ShowPubkeyComponent>, @Inject(MAT_DIALOG_DATA) public data: ShowPubkeyData, private logger: LoggerService, private snackBar: MatSnackBar) { }
constructor(public dialogRef: MatDialogRef<ShowPubkeyComponent>, @Inject(MAT_DIALOG_DATA) public data: ShowPubkeyData, private logger: LoggerService, private snackBar: MatSnackBar, private commonService: CommonService) { }
ngOnInit() {
this.information = this.data.information;
this.screenSize = this.commonService.getScreenSize();
if(this.screenSize === ScreenSizeEnum.XS) {
this.qrWidth = 90;
} else if(this.screenSize === ScreenSizeEnum.SM) {
this.qrWidth = 160;
} else if(this.screenSize === ScreenSizeEnum.MD) {
this.qrWidth = 200;
}
}
onClose() {

13
src/app/shared/components/navigation/horizontal-navigation/horizontal-navigation.component.html
View file

@ -1,12 +1,12 @@
<div fxLayout="row" fxFlex="100" fxLayoutAlign="space-between center">
<div fxLayoutAlign="start start">
<div fxFlex="70" fxLayoutAlign="start start">
<div *ngFor="let menuNode of menuNodes">
<button mat-button *ngIf="undefined === menuNode.children" fxLayoutAlign="center center" class="horizontal-button" routerLinkActive="h-active-link" [routerLinkActiveOptions]="{exact: true}" routerLink="{{menuNode.link}}" (click)="onClick(menuNode)">
<fa-icon *ngIf="menuNode.iconType === 'FA'" [icon]="menuNode.icon" class="fa-icon-small"></fa-icon>
<fa-icon *ngIf="menuNode.iconType === 'FA'" matTooltip="{{menuNode.name}}" [icon]="menuNode.icon" class="fa-icon-small"></fa-icon>
</button>
<div *ngIf="undefined !== menuNode.children" fxLayoutAlign="start start" [matMenuTriggerFor]="childMenu">
<button mat-button class="horizontal-button" fxLayoutAlign="center center">
<fa-icon *ngIf="menuNode.iconType === 'FA'" [icon]="menuNode.icon" class="fa-icon-small"></fa-icon>
<fa-icon *ngIf="menuNode.iconType === 'FA'" matTooltip="{{menuNode.name}}" [icon]="menuNode.icon" class="fa-icon-small"></fa-icon>
</button>
<mat-menu #childMenu="matMenu" xPosition="after" overlapTrigger="false" class="child-menu">
<div *ngFor="let childNode of menuNode.children">
@ -18,7 +18,12 @@
</div>
</div>
</div>
<div fxLayoutAlign="end center">
<div fxFlex="30" fxLayoutAlign="end center">
<mat-select fxFlex="40" *ngIf="appConfig.nodes.length > 1" [value]="selNode" (selectionChange)="onNodeSelectionChange($event.value)" class="m-2 multi-node-select">
<mat-option *ngFor="let node of appConfig.nodes" [value]="node" tabindex="19">
{{node.lnNode}} ({{node.lnImplementation}})
</mat-option>
</mat-select>
<button fxLayoutAlign="center center" mat-stroked-button color="primary" class="horizontal-button-show" tabindex="20" (click)="onShowPubkey()">Show Public Key</button>
<rtl-top-menu></rtl-top-menu>
</div>

17
src/app/shared/components/navigation/horizontal-navigation/horizontal-navigation.component.ts
View file

@ -6,12 +6,11 @@ import { Store } from '@ngrx/store';
import { faEject } from '@fortawesome/free-solid-svg-icons';
import { SessionService } from '../../../services/session.service';
import { MENU_DATA } from '../../../models/navMenu';
import { ShowPubkeyComponent } from '../../data-modal/show-pubkey/show-pubkey.component';
import { RTLEffects } from '../../../../store/rtl.effects';
import * as RTLActions from '../../../../store/rtl.actions';
import * as fromRTLReducer from '../../../../store/rtl.reducers';
import { GetInfoRoot } from '../../../models/RTLconfig';
import { GetInfoRoot, LightningNode, RTLConfiguration } from '../../../models/RTLconfig';
import { AlertTypeEnum } from '../../../services/consts-enums-functions';
@Component({
@ -24,6 +23,8 @@ export class HorizontalNavigationComponent implements OnInit, OnDestroy {
public logoutNode = [];
public showLogout = false;
public numPendingChannels = 0;
public appConfig: RTLConfiguration;
public selNode: LightningNode;
public information: GetInfoRoot = {};
private unSubs = [new Subject(), new Subject(), new Subject()];
@ -35,8 +36,10 @@ export class HorizontalNavigationComponent implements OnInit, OnDestroy {
.pipe(takeUntil(this.unSubs[0]))
.subscribe((rtlStore) => {
this.information = rtlStore.nodeData;
this.appConfig = rtlStore.appConfig;
this.selNode = rtlStore.selNode;
this.numPendingChannels = rtlStore.nodeData.numberOfPendingChannels;
if(rtlStore.selNode.lnImplementation.toUpperCase() === 'CLT') {
if(this.selNode.lnImplementation.toUpperCase() === 'CLT') {
this.menuNodes = MENU_DATA.CLChildren;
} else {
this.menuNodes = MENU_DATA.LNDChildren;
@ -69,7 +72,7 @@ export class HorizontalNavigationComponent implements OnInit, OnDestroy {
onClick(node) {
if (node.name === 'Logout') {
this.store.dispatch(new RTLActions.OpenConfirmation({
width: '55%', data: { type: AlertTypeEnum.CONFIRM, alertTitle: 'Logout', titleMessage: 'Logout from this device?', noBtnText: 'Cancel', yesBtnText: 'Logout'
data: { type: AlertTypeEnum.CONFIRM, alertTitle: 'Logout', titleMessage: 'Logout from this device?', noBtnText: 'Cancel', yesBtnText: 'Logout'
}}));
this.rtlEffects.closeConfirm
.pipe(takeUntil(this.unSubs[2]))
@ -86,6 +89,12 @@ export class HorizontalNavigationComponent implements OnInit, OnDestroy {
this.store.dispatch(new RTLActions.ShowPubkey());
}
onNodeSelectionChange(selNodeValue: LightningNode) {
this.selNode = selNodeValue;
this.store.dispatch(new RTLActions.OpenSpinner('Updating Selected Node...'));
this.store.dispatch(new RTLActions.SetSelelectedNode({ lnNode: selNodeValue, isInitialSetup: false }));
}
ngOnDestroy() {
this.unSubs.forEach(completeSub => {
completeSub.next();

3
src/app/shared/components/navigation/side-navigation/side-navigation.component.ts
View file

@ -116,7 +116,7 @@ export class SideNavigationComponent implements OnInit, OnDestroy {
onClick(node: MenuChildNode) {
if (node.name === 'Logout') {
this.store.dispatch(new RTLActions.OpenConfirmation({
width: '55%', data: { type: AlertTypeEnum.CONFIRM, alertTitle: 'Logout', titleMessage: 'Logout from this device?', noBtnText: 'Cancel', yesBtnText: 'Logout'
data: { type: AlertTypeEnum.CONFIRM, alertTitle: 'Logout', titleMessage: 'Logout from this device?', noBtnText: 'Cancel', yesBtnText: 'Logout'
}}));
this.rtlEffects.closeConfirm
.pipe(takeUntil(this.unSubs[3]))
@ -142,6 +142,7 @@ export class SideNavigationComponent implements OnInit, OnDestroy {
this.selNode = selNodeValue;
this.store.dispatch(new RTLActions.OpenSpinner('Updating Selected Node...'));
this.store.dispatch(new RTLActions.SetSelelectedNode({ lnNode: selNodeValue, isInitialSetup: false }));
this.ChildNavClicked.emit('selectNode');
}
ngOnDestroy() {

2
src/app/shared/components/navigation/top-menu/top-menu.component.ts
View file

@ -79,7 +79,7 @@ export class TopMenuComponent implements OnInit, OnDestroy {
onClick() {
this.store.dispatch(new RTLActions.OpenConfirmation({
width: '55%', data: { type: AlertTypeEnum.CONFIRM, alertTitle: 'Logout', titleMessage: 'Logout from this device?', noBtnText: 'Cancel', yesBtnText: 'Logout'
data: { type: AlertTypeEnum.CONFIRM, alertTitle: 'Logout', titleMessage: 'Logout from this device?', noBtnText: 'Cancel', yesBtnText: 'Logout'
}}));
this.rtlEffects.closeConfirm
.pipe(takeUntil(this.unSubs[3]))

2
src/app/shared/components/server-config/server-config.component.html
View file

@ -19,7 +19,7 @@
</form>
<mat-divider *ngIf="configData !== ''" class="my-1"></mat-divider>
<div *ngIf="configData !== '' && fileFormat === 'JSON'" class="mt-2 mb-6">
<pre>{{configData | json}}</pre>
<pre class="pre-wrap">{{configData | json}}</pre>
<mat-divider *ngIf="configData !== ''" class="my-1"></mat-divider>
</div>
<div *ngIf="configData !== '' && fileFormat === 'INI'" class="mt-2">

1
src/app/shared/components/server-config/server-config.component.ts
View file

@ -65,6 +65,7 @@ export class ServerConfigComponent implements OnInit, OnDestroy {
this.rtlEffects.showLnConfig
.pipe(takeUntil(this.unSubs[1]))
.subscribe((config: any) => {
console.warn(config);
const configFile = config.data;
this.fileFormat = config.format;
if (configFile !== '' && undefined !== configFile && this.fileFormat === 'INI') {

2
src/app/shared/components/signin/signin.component.html
View file

@ -12,7 +12,7 @@
tabindex="1" required>
<mat-hint>{{hintStr}}</mat-hint>
</mat-form-field>
<div fxLayout="column" fxFlex.gt-sm="30" fxLayout.gt-sm="row wrap" fxLayoutAlign="start start" fxLayoutAlign.gt-sm="space-between center" class="mt-2">
<div fxFlex="100" fxFlex.gt-sm="30" fxLayoutAlign="space-between start" fxLayoutAlign.gt-sm="space-between center" class="mt-2">
<button fxFlex="48" fxLayoutAlign="center center" mat-stroked-button color="primary" tabindex="2" type="reset" (click)="resetData()">Clear</button>
<button fxFlex="48" fxLayoutAlign="center center" mat-raised-button color="primary" tabindex="3" type="submit" [disabled]="!password">Login</button>
</div>

2
src/app/shared/models/alertData.ts
View file

@ -82,6 +82,6 @@ export interface ErrorData {
}
export interface DialogConfig {
width: string;
width?: string;
data: AlertData | ConfirmationData | ErrorData | OpenChannelAlert | InvoiceInformation | OnChainAddressInformation | ShowPubkeyData;
}

15
src/app/shared/services/common.service.ts
View file

@ -3,7 +3,8 @@ import { HttpClient } from '@angular/common/http';
import { Subject, of, Observable } from 'rxjs';
import { take, map } from 'rxjs/operators';
import { CurrencyUnitEnum, TimeUnitEnum } from './consts-enums-functions';
import { CurrencyUnitEnum, TimeUnitEnum, ScreenSizeEnum } from './consts-enums-functions';
import { environment } from '../../../environments/environment';
@Injectable()
export class CommonService implements OnInit, OnDestroy {
@ -12,12 +13,22 @@ export class CommonService implements OnInit, OnDestroy {
unitConversionValue = 0;
containerWidthChanged = new Subject<string>();
conversionData = { data: null, last_fetched: null };
private screenSize = ScreenSizeEnum.MD;
private unSubs: Array<Subject<void>> = [new Subject(), new Subject()];
constructor(private httpClient: HttpClient) {}
ngOnInit() {}
getScreenSize() {
return this.screenSize;
}
setScreenSize(screenSize: ScreenSizeEnum) {
this.screenSize = screenSize;
console.warn(this.screenSize);
}
sortDescByKey(array, key) {
return array.sort(function (a, b) {
const x = +a[key];
@ -45,7 +56,7 @@ export class CommonService implements OnInit, OnDestroy {
if(this.conversionData.data && this.conversionData.last_fetched && (latest_date < (this.conversionData.last_fetched.valueOf() + 300000))) {
return of(this.convert(value, from, otherCurrencyUnit));
} else {
return this.httpClient.get('https://blockchain.info/ticker')
return this.httpClient.get(environment.CONF_API + '/rates')
.pipe(take(1),
map(data => {
this.conversionData.data = data;

11
src/app/shared/services/consts-enums-functions.ts
View file

@ -26,8 +26,8 @@ export const TRANS_TYPES = [
];
export enum UserPersonaEnum {
OPERATOR = 'Operator',
MERCHANT = 'Merchant'
OPERATOR = 'operator',
MERCHANT = 'merchant'
}
export enum AlertTypeEnum {
@ -67,3 +67,10 @@ export enum DataTypeEnum {
DATE = 'DATE',
DATE_TIME = 'DATE_TIME'
}
export enum ScreenSizeEnum {
XS = 'XS', // < 600 => mobile handsets
SM = 'SM', // 600 - 839 => tab portrait
MD = 'MD', // 840 - 1439 => tab landscape & small laptops
LG = 'LG' // >1440 => big laptops
}

5
src/app/shared/shared.module.ts
View file

@ -45,7 +45,6 @@ import { AutoFocusDirective } from './directive/auto-focus.directive';
import { RemoveLeadingZerosPipe } from './pipes/app.pipe';
import { OpenChannelComponent } from './components/data-modal/open-channel/open-channel.component';
import { ShowPubkeyComponent } from './components/data-modal/show-pubkey/show-pubkey.component';
import { CommonService } from './services/common.service';
import { SocketService } from './services/socket.service';
@NgModule({
@ -183,9 +182,9 @@ 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: '700px' } },
{ 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' } },
CommonService, DecimalPipe, SocketService
DecimalPipe, SocketService
]
})
export class SharedModule { }

2
src/app/shared/theme/skins/color-swatches/dark-bright-theme.scss
View file

@ -54,7 +54,7 @@ $dark-bright-background: (
background:map_get($dark-grey, 900),
hover: rgba(black, 0.04),
card: map_get($dark-grey, 700),
dialog: map_get($dark-grey, 700),
dialog: map_get($dark-grey, 600),
disabled-button: map_get($dark-grey, 300),
raised-button: map_get($dark-grey, 400),
focused-button: $dark-focused,

34
src/app/shared/theme/styles/change-theme.scss
View file

@ -88,7 +88,16 @@
}
.chart-legend .legend-label:hover, .chart-legend .legend-label .active .legend-label-text {
color: $foreground-text !important;
}
}
.cdk-overlay-dark-backdrop {
background: rgba(255, 255, 255, 0.32);
}
.mat-tree {
background: mat-color($background, dialog);
}
.mat-expansion-panel {
border: 1px solid $foreground-secondary-text;
}
}
&.day {
@ -152,6 +161,16 @@
.mat-progress-bar-fill::after {
background-color: mat-color($primary, 900);
}
.modal-qr-code-container {
background: $foreground-divider;
}
.mat-expansion-panel.flat-expansion-panel {
box-shadow: none;
padding: 0;
border: 1px solid $foreground-divider;
border-radius: 4px;
background: none;
}
}
.mat-progress-bar-buffer {
@ -161,6 +180,7 @@
.foreground-secondary-text {
color: $foreground-secondary-text !important;
white-space: pre-line;
overflow-wrap: break-word;
}
.foreground.mat-progress-spinner circle, .foreground.mat-spinner circle {
@ -298,10 +318,6 @@
}
}
.modal-qr-code-container {
background: $foreground-divider;
}
.tab-badge {
& .mat-badge-content {
width: $dot-size * 1.5;
@ -322,14 +338,6 @@
}
}
.mat-expansion-panel.flat-expansion-panel {
box-shadow: none;
padding: 0;
border: 1px solid $foreground-divider;
border-radius: 4px;
background: none;
}
.rtl-snack-bar .mat-simple-snackbar {
justify-content: center;
align-content: center;

19
src/app/shared/theme/styles/root.scss
View file

@ -219,7 +219,6 @@ body {
.mat-form-field-wrapper {
width: 100%;
margin: 0 1.5rem 0 0;
}
.mat-select {
@ -298,6 +297,10 @@ body {
margin-right: 0 !important;
}
.mr-5px {
margin-right: 0.5rem !important;
}
.mr-1 {
margin-right: 1rem !important;
}
@ -506,6 +509,10 @@ body {
overflow-y: hidden !important;
}
.overflow-x-hidden {
overflow-x: hidden !important;
}
.overflow-auto {
overflow: auto;
}
@ -845,10 +852,20 @@ table {
font-weight: 900 !important;
}
.pre-wrap {
white-space: pre-wrap !important;
}
.display-none {
display: none !important;
}
.lightning-send-tab {
& .mat-tab-body-content {
padding-left: 0.5rem;
}
}
.ellipsis-child {
flex: 1;
white-space: nowrap;

24
src/app/store/rtl.effects.ts
View file

@ -3,7 +3,7 @@ import { HttpClient } from '@angular/common/http';
import { Router } from '@angular/router';
import { Store } from '@ngrx/store';
import { Actions, Effect, ofType } from '@ngrx/effects';
import { of, Subject, forkJoin, Observable } from 'rxjs';
import { of, Subject, forkJoin } from 'rxjs';
import { map, mergeMap, catchError, take, withLatestFrom } from 'rxjs/operators';
import { MatDialog } from '@angular/material';
@ -12,8 +12,9 @@ import { MatSnackBar } from '@angular/material/snack-bar';
import { environment, API_URL } from '../../environments/environment';
import { LoggerService } from '../shared/services/logger.service';
import { SessionService } from '../shared/services/session.service';
import { CommonService } from '../shared/services/common.service';
import { Settings, RTLConfiguration } from '../shared/models/RTLconfig';
import { AuthenticateWith, CURRENCY_UNITS, AlertTypeEnum, DataTypeEnum } from '../shared/services/consts-enums-functions';
import { AuthenticateWith, CURRENCY_UNITS, AlertTypeEnum, 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';
@ -28,6 +29,9 @@ import { ErrorMessageComponent } from '../shared/components/data-modal/error-mes
export class RTLEffects implements OnDestroy {
dialogRef: any;
CHILD_API_URL = API_URL + '/lnd';
screenSize = '';
alertWidth = '55%';
confirmWidth = '70%';
private unSubs: Array<Subject<void>> = [new Subject(), new Subject()];
constructor(
@ -36,9 +40,10 @@ export class RTLEffects implements OnDestroy {
private store: Store<fromRTLReducer.RTLState>,
private logger: LoggerService,
private sessionService: SessionService,
private commonService: CommonService,
public dialog: MatDialog,
private snackBar: MatSnackBar,
private router: Router) { }
private router: Router) {}
@Effect({ dispatch: false })
openSpinner = this.actions$.pipe(
@ -60,6 +65,7 @@ export class RTLEffects implements OnDestroy {
openAlert = this.actions$.pipe(
ofType(RTLActions.OPEN_ALERT),
map((action: RTLActions.OpenAlert) => {
action.payload.width = this.alertWidth;
if(action.payload.data.component) {
this.dialogRef = this.dialog.open(action.payload.data.component, action.payload);
} else {
@ -80,6 +86,7 @@ export class RTLEffects implements OnDestroy {
openConfirm = this.actions$.pipe(
ofType(RTLActions.OPEN_CONFIRMATION),
map((action: RTLActions.OpenConfirmation) => {
action.payload.width = this.confirmWidth;
this.dialogRef = this.dialog.open(ConfirmationMessageComponent, action.payload);
})
);
@ -115,6 +122,17 @@ export class RTLEffects implements OnDestroy {
appConfigFetch = this.actions$.pipe(
ofType(RTLActions.FETCH_RTL_CONFIG),
mergeMap((action: RTLActions.FetchRTLConfig) => {
this.screenSize = this.commonService.getScreenSize();
if(this.screenSize === ScreenSizeEnum.XS || this.screenSize === ScreenSizeEnum.SM) {
this.alertWidth = '95%';
this.confirmWidth = '95%';
} else if(this.screenSize === ScreenSizeEnum.MD) {
this.alertWidth = '80%';
this.confirmWidth = '80%';
} else {
this.alertWidth = '55%';
this.confirmWidth = '70%';
}
this.store.dispatch(new RTLActions.ClearEffectErrorRoot('FetchRTLConfig'));
return this.httpClient.get(environment.CONF_API + '/rtlconf');
}),