You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
302 lines
15 KiB
TypeScript
302 lines
15 KiB
TypeScript
import { Component, OnInit, Inject, OnDestroy, ViewChild, AfterViewInit } from '@angular/core';
|
|
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
|
|
import { Router } from '@angular/router';
|
|
import { DecimalPipe } from '@angular/common';
|
|
import { Subject } from 'rxjs';
|
|
import { takeUntil } from 'rxjs/operators';
|
|
import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
|
|
import { MatStepper } from '@angular/material/stepper';
|
|
import { Store } from '@ngrx/store';
|
|
import { faInfoCircle } from '@fortawesome/free-solid-svg-icons';
|
|
|
|
import { opacityAnimation } from '../../../../animation/opacity-animation';
|
|
import { ScreenSizeEnum, LoopTypeEnum } from '../../../../services/consts-enums-functions';
|
|
import { LoopQuote, LoopStatus } from '../../../../models/loopModels';
|
|
import { LoopAlert } from '../../../../models/alertData';
|
|
import { LoopService } from '../../../../services/loop.service';
|
|
import { LoggerService } from '../../../../services/logger.service';
|
|
import { CommonService } from '../../../../services/common.service';
|
|
import { Channel, ChannelsSummary, LightningBalance } from '../../../../models/lndModels';
|
|
|
|
import { RTLState } from '../../../../../store/rtl.state';
|
|
import { channels } from '../../../../../lnd/store/lnd.selector';
|
|
import { ApiCallStatusPayload } from '../../../../models/apiCallsPayload';
|
|
|
|
@Component({
|
|
selector: 'rtl-loop-modal',
|
|
templateUrl: './loop-modal.component.html',
|
|
styleUrls: ['./loop-modal.component.scss'],
|
|
animations: [opacityAnimation]
|
|
})
|
|
export class LoopModalComponent implements OnInit, AfterViewInit, OnDestroy {
|
|
|
|
@ViewChild('stepper', { static: false }) stepper: MatStepper;
|
|
public faInfoCircle = faInfoCircle;
|
|
public quote: LoopQuote;
|
|
public channel: Channel;
|
|
public minQuote: LoopQuote;
|
|
public maxQuote: LoopQuote;
|
|
public LoopTypeEnum = LoopTypeEnum;
|
|
public direction = LoopTypeEnum.LOOP_OUT;
|
|
public loopDirectionCaption = 'Loop out';
|
|
public loopStatus: LoopStatus | null = null;
|
|
public inputFormLabel = 'Amount to loop out';
|
|
public quoteFormLabel = 'Confirm Quote';
|
|
public addressFormLabel = 'Withdrawal Address';
|
|
public prepayRoutingFee = 36;
|
|
public flgShowInfo = false;
|
|
public stepNumber = 1;
|
|
public screenSize = '';
|
|
public screenSizeEnum = ScreenSizeEnum;
|
|
public animationDirection = 'forward';
|
|
public flgEditable = true;
|
|
public localBalanceToCompare: number | null = null;
|
|
inputFormGroup: FormGroup;
|
|
quoteFormGroup: FormGroup;
|
|
addressFormGroup: FormGroup;
|
|
statusFormGroup: FormGroup;
|
|
private unSubs: Array<Subject<void>> = [new Subject(), new Subject(), new Subject(), new Subject(), new Subject(), new Subject(), new Subject()];
|
|
|
|
constructor(public dialogRef: MatDialogRef<LoopModalComponent>, @Inject(MAT_DIALOG_DATA) public data: LoopAlert, private store: Store<RTLState>, private loopService: LoopService, private formBuilder: FormBuilder, private decimalPipe: DecimalPipe, private logger: LoggerService, private router: Router, private commonService: CommonService) { }
|
|
|
|
ngOnInit() {
|
|
this.screenSize = this.commonService.getScreenSize();
|
|
this.channel = this.data.channel;
|
|
this.minQuote = this.data.minQuote ? this.data.minQuote : {};
|
|
this.maxQuote = this.data.maxQuote ? this.data.maxQuote : {};
|
|
this.direction = this.data.direction || LoopTypeEnum.LOOP_OUT;
|
|
this.loopDirectionCaption = this.direction === LoopTypeEnum.LOOP_IN ? 'Loop in' : 'Loop out';
|
|
this.inputFormLabel = 'Amount to ' + this.loopDirectionCaption;
|
|
this.inputFormGroup = this.formBuilder.group({
|
|
amount: [this.minQuote.amount, [Validators.required, Validators.min(this.minQuote.amount || 0), Validators.max(this.maxQuote.amount || 0)]],
|
|
sweepConfTarget: [6, [Validators.required, Validators.min(1)]],
|
|
routingFeePercent: [2, [Validators.required, Validators.min(0)]],
|
|
fast: [false, [Validators.required]]
|
|
});
|
|
this.quoteFormGroup = this.formBuilder.group({});
|
|
this.addressFormGroup = this.formBuilder.group({
|
|
addressType: ['local', [Validators.required]],
|
|
address: [{ value: '', disabled: true }]
|
|
});
|
|
this.statusFormGroup = this.formBuilder.group({});
|
|
this.onFormValueChanges();
|
|
this.store.select(channels).pipe(takeUntil(this.unSubs[6])).
|
|
subscribe((channelsSelector: { channels: Channel[], channelsSummary: ChannelsSummary, lightningBalance: LightningBalance, apiCallStatus: ApiCallStatusPayload }) => {
|
|
this.localBalanceToCompare = (this.channel && this.channel.local_balance) ? +this.channel.local_balance : (channelsSelector.lightningBalance && channelsSelector.lightningBalance.local) ? +channelsSelector.lightningBalance.local : null;
|
|
});
|
|
}
|
|
|
|
ngAfterViewInit() {
|
|
this.inputFormGroup.setErrors({ Invalid: true });
|
|
if (this.direction === LoopTypeEnum.LOOP_OUT) {
|
|
this.addressFormGroup.setErrors({ Invalid: true });
|
|
}
|
|
}
|
|
|
|
onFormValueChanges() {
|
|
this.inputFormGroup.valueChanges.pipe(takeUntil(this.unSubs[4])).subscribe((changedValues) => {
|
|
this.inputFormGroup.setErrors({ Invalid: true });
|
|
});
|
|
if (this.direction === LoopTypeEnum.LOOP_OUT) {
|
|
this.addressFormGroup.valueChanges.pipe(takeUntil(this.unSubs[5])).subscribe((changedValues) => {
|
|
this.addressFormGroup.setErrors({ Invalid: true });
|
|
});
|
|
}
|
|
}
|
|
|
|
onAddressTypeChange(event: any) {
|
|
if (event.value === 'external') {
|
|
this.addressFormGroup.controls.address.setValidators([Validators.required]);
|
|
this.addressFormGroup.controls.address.markAsTouched();
|
|
this.addressFormGroup.controls.address.enable();
|
|
} else {
|
|
this.addressFormGroup.controls.address.setValidators(null);
|
|
this.addressFormGroup.controls.address.markAsPristine();
|
|
this.addressFormGroup.controls.address.disable();
|
|
this.addressFormGroup.controls.address.setValue('');
|
|
}
|
|
this.addressFormGroup.setErrors({ Invalid: true });
|
|
}
|
|
|
|
onValidateAmount() {
|
|
if (this.localBalanceToCompare && this.inputFormGroup.controls.amount.value <= this.localBalanceToCompare) {
|
|
this.stepper.next();
|
|
}
|
|
}
|
|
|
|
onLoop(): boolean | void {
|
|
if (!this.inputFormGroup.controls.amount.value || (this.minQuote.amount && this.inputFormGroup.controls.amount.value < this.minQuote.amount) || (this.maxQuote.amount && this.inputFormGroup.controls.amount.value > this.maxQuote.amount) ||
|
|
!this.inputFormGroup.controls.sweepConfTarget.value || this.inputFormGroup.controls.sweepConfTarget.value < 2 ||
|
|
(this.direction === LoopTypeEnum.LOOP_OUT && (!this.inputFormGroup.controls.routingFeePercent.value || this.inputFormGroup.controls.routingFeePercent.value < 0)) ||
|
|
(this.direction === LoopTypeEnum.LOOP_OUT && this.addressFormGroup.controls.addressType.value === 'external' &&
|
|
(!this.addressFormGroup.controls.address.value || this.addressFormGroup.controls.address.value.trim() === ''))) {
|
|
return true;
|
|
}
|
|
this.flgEditable = false;
|
|
this.stepper.selected?.stepControl.setErrors(null);
|
|
this.stepper.next();
|
|
if (this.direction === LoopTypeEnum.LOOP_IN) {
|
|
this.loopService.loopIn(this.inputFormGroup.controls.amount.value, +(this.quote.swap_fee_sat || 0), +(this.quote.htlc_publish_fee_sat || 0), '', true).pipe(takeUntil(this.unSubs[0])).
|
|
subscribe({
|
|
next: (loopStatus: any) => {
|
|
this.loopStatus = loopStatus;
|
|
this.loopService.listSwaps();
|
|
this.flgEditable = true;
|
|
}, error: (err) => {
|
|
this.loopStatus = { error: err };
|
|
this.flgEditable = true;
|
|
this.logger.error(err);
|
|
}
|
|
});
|
|
} else {
|
|
const swapRoutingFee = Math.ceil(this.inputFormGroup.controls.amount.value * (this.inputFormGroup.controls.routingFeePercent.value / 100));
|
|
const destAddress = this.addressFormGroup.controls.addressType.value === 'external' ? this.addressFormGroup.controls.address.value : '';
|
|
const swapPublicationDeadline = this.inputFormGroup.controls.fast.value ? 0 : new Date().getTime() + (30 * 60000);
|
|
this.loopService.loopOut(this.inputFormGroup.controls.amount.value, (this.channel && this.channel.chan_id ? this.channel.chan_id : ''), this.inputFormGroup.controls.sweepConfTarget.value, swapRoutingFee, +(this.quote.htlc_sweep_fee_sat || 0), this.prepayRoutingFee, +(this.quote.prepay_amt_sat || 0), +(this.quote.swap_fee_sat || 0), swapPublicationDeadline, destAddress).pipe(takeUntil(this.unSubs[1])).
|
|
subscribe({
|
|
next: (loopStatus: any) => {
|
|
this.loopStatus = loopStatus;
|
|
this.loopService.listSwaps();
|
|
this.flgEditable = true;
|
|
}, error: (err) => {
|
|
this.loopStatus = { error: err };
|
|
this.flgEditable = true;
|
|
this.logger.error(err);
|
|
}
|
|
});
|
|
}
|
|
}
|
|
|
|
onEstimateQuote(): boolean | void {
|
|
if (!this.inputFormGroup.controls.amount.value || (this.minQuote.amount && this.inputFormGroup.controls.amount.value < this.minQuote.amount) || (this.maxQuote.amount && this.inputFormGroup.controls.amount.value > this.maxQuote.amount) || !this.inputFormGroup.controls.sweepConfTarget.value || this.inputFormGroup.controls.sweepConfTarget.value < 2) {
|
|
return true;
|
|
}
|
|
const swapPublicationDeadline = this.inputFormGroup.controls.fast.value ? 0 : new Date().getTime() + (30 * 60000);
|
|
if (this.direction === LoopTypeEnum.LOOP_IN) {
|
|
this.loopService.getLoopInQuote(this.inputFormGroup.controls.amount.value, this.inputFormGroup.controls.sweepConfTarget.value, swapPublicationDeadline).
|
|
pipe(takeUntil(this.unSubs[2])).
|
|
subscribe((response) => {
|
|
this.quote = response;
|
|
this.quote.off_chain_swap_routing_fee_percentage = this.inputFormGroup.controls.routingFeePercent.value ? this.inputFormGroup.controls.routingFeePercent.value : 2;
|
|
});
|
|
} else {
|
|
this.loopService.getLoopOutQuote(this.inputFormGroup.controls.amount.value, this.inputFormGroup.controls.sweepConfTarget.value, swapPublicationDeadline).
|
|
pipe(takeUntil(this.unSubs[3])).
|
|
subscribe((response) => {
|
|
this.quote = response;
|
|
this.quote.off_chain_swap_routing_fee_percentage = this.inputFormGroup.controls.routingFeePercent.value ? this.inputFormGroup.controls.routingFeePercent.value : 2;
|
|
});
|
|
}
|
|
this.stepper.selected?.stepControl.setErrors(null);
|
|
this.stepper.next();
|
|
}
|
|
|
|
stepSelectionChanged(event: any) {
|
|
switch (event.selectedIndex) {
|
|
case 0:
|
|
this.inputFormLabel = 'Amount to ' + this.loopDirectionCaption;
|
|
this.quoteFormLabel = 'Confirm Quote';
|
|
this.addressFormLabel = 'Withdrawal Address';
|
|
break;
|
|
|
|
case 1:
|
|
if (this.inputFormGroup.controls.amount.value || this.inputFormGroup.controls.sweepConfTarget.value) {
|
|
if (this.direction === LoopTypeEnum.LOOP_IN) {
|
|
this.inputFormLabel = this.loopDirectionCaption + ' Amount: ' + (this.decimalPipe.transform(this.inputFormGroup.controls.amount.value ? this.inputFormGroup.controls.amount.value : 0)) + ' Sats | Target Confirmation: ' + (this.inputFormGroup.controls.sweepConfTarget.value ? this.inputFormGroup.controls.sweepConfTarget.value : 6);
|
|
} else {
|
|
this.inputFormLabel = this.loopDirectionCaption + ' Amount: ' +
|
|
(this.decimalPipe.transform(this.inputFormGroup.controls.amount.value ? this.inputFormGroup.controls.amount.value : 0)) + ' Sats | Target Confirmation: ' +
|
|
(this.inputFormGroup.controls.sweepConfTarget.value ? this.inputFormGroup.controls.sweepConfTarget.value : 6) + ' | Percentage: ' +
|
|
(this.inputFormGroup.controls.routingFeePercent.value ? this.inputFormGroup.controls.routingFeePercent.value : '2') + ' | Fast: ' +
|
|
(this.inputFormGroup.controls.fast.value ? 'Enabled' : 'Disabled');
|
|
}
|
|
} else {
|
|
this.inputFormLabel = 'Amount to ' + this.loopDirectionCaption;
|
|
}
|
|
this.quoteFormLabel = 'Confirm Quote';
|
|
this.addressFormLabel = 'Withdrawal Address';
|
|
break;
|
|
|
|
case 2:
|
|
if (this.inputFormGroup.controls.amount.value || this.inputFormGroup.controls.sweepConfTarget.value) {
|
|
if (this.direction === LoopTypeEnum.LOOP_IN) {
|
|
this.inputFormLabel = this.loopDirectionCaption + ' Amount: ' + (this.decimalPipe.transform(this.inputFormGroup.controls.amount.value ? this.inputFormGroup.controls.amount.value : 0)) + ' Sats | Target Confirmation: ' + (this.inputFormGroup.controls.sweepConfTarget.value ? this.inputFormGroup.controls.sweepConfTarget.value : 6);
|
|
} else {
|
|
this.inputFormLabel = this.loopDirectionCaption + ' Amount: ' +
|
|
(this.decimalPipe.transform(this.inputFormGroup.controls.amount.value ? this.inputFormGroup.controls.amount.value : 0)) + ' Sats | Target Confirmation: ' +
|
|
(this.inputFormGroup.controls.sweepConfTarget.value ? this.inputFormGroup.controls.sweepConfTarget.value : 6) + ' | Fast: ' +
|
|
(this.inputFormGroup.controls.fast.value ? 'Enabled' : 'Disabled');
|
|
}
|
|
} else {
|
|
this.inputFormLabel = 'Amount to ' + this.loopDirectionCaption;
|
|
}
|
|
if (this.quote && this.quote.swap_fee_sat && (this.quote.htlc_sweep_fee_sat || this.quote.htlc_publish_fee_sat) && this.quote.prepay_amt_sat) {
|
|
this.quoteFormLabel = 'Quote confirmed | Estimated Fees: ' + this.decimalPipe.transform(+this.quote.swap_fee_sat + +(this.quote.htlc_sweep_fee_sat ? this.quote.htlc_sweep_fee_sat : this.quote.htlc_publish_fee_sat ? this.quote.htlc_publish_fee_sat : 0)) + ' Sats';
|
|
} else {
|
|
this.quoteFormLabel = 'Quote confirmed';
|
|
}
|
|
if (this.addressFormGroup.controls.addressType.value) {
|
|
this.addressFormLabel = 'Withdrawal Address | Type: ' + this.addressFormGroup.controls.addressType.value;
|
|
} else {
|
|
this.addressFormLabel = 'Withdrawal Address';
|
|
}
|
|
break;
|
|
|
|
default:
|
|
this.inputFormLabel = 'Amount to ' + this.loopDirectionCaption;
|
|
this.quoteFormLabel = 'Confirm Quote';
|
|
this.addressFormLabel = 'Withdrawal Address';
|
|
break;
|
|
}
|
|
if ((this.direction === LoopTypeEnum.LOOP_OUT && event.selectedIndex !== 1 && event.selectedIndex < event.previouslySelectedIndex) ||
|
|
(this.direction === LoopTypeEnum.LOOP_IN && event.selectedIndex < event.previouslySelectedIndex)) {
|
|
event.selectedStep.stepControl.setErrors({ Invalid: true });
|
|
}
|
|
}
|
|
|
|
goToLoop() {
|
|
this.dialogRef.close(true);
|
|
this.router.navigateByUrl('/services/loop');
|
|
}
|
|
|
|
onClose() {
|
|
this.dialogRef.close(true);
|
|
}
|
|
|
|
showInfo() {
|
|
this.flgShowInfo = true;
|
|
}
|
|
|
|
onReadMore() {
|
|
if (this.direction === LoopTypeEnum.LOOP_IN) {
|
|
window.open('https://blog.lightning.engineering/announcement/2019/06/25/loop-in.html', '_blank');
|
|
} else {
|
|
window.open('https://blog.lightning.engineering/technical/posts/2019/04/15/loop-out-in-depth.html', '_blank');
|
|
}
|
|
this.onClose();
|
|
}
|
|
|
|
onStepChanged(index: number) {
|
|
this.animationDirection = index < this.stepNumber ? 'backward' : 'forward';
|
|
this.stepNumber = index;
|
|
}
|
|
|
|
onRestart() {
|
|
this.stepper.reset();
|
|
this.flgEditable = true;
|
|
this.inputFormGroup.reset({ amount: this.minQuote.amount, sweepConfTarget: 6, routingFeePercent: 2, fast: false });
|
|
this.quoteFormGroup.reset();
|
|
this.statusFormGroup.reset();
|
|
this.addressFormGroup.reset({ addressType: 'local', address: '' });
|
|
this.addressFormGroup.controls.address.disable();
|
|
}
|
|
|
|
ngOnDestroy() {
|
|
this.unSubs.forEach((completeSub) => {
|
|
completeSub.next(<any>null);
|
|
completeSub.complete();
|
|
});
|
|
}
|
|
|
|
}
|