Loading invoice...
diff --git a/frontend/src/app/components/bitcoin-invoice/bitcoin-invoice.component.html b/frontend/src/app/components/bitcoin-invoice/bitcoin-invoice.component.html
index 5fd4f6701..790f046f7 100644
--- a/frontend/src/app/components/bitcoin-invoice/bitcoin-invoice.component.html
+++ b/frontend/src/app/components/bitcoin-invoice/bitcoin-invoice.component.html
@@ -6,7 +6,7 @@
- A transaction has been detected in the mempool fully paying for this invoice. Waiting for on-chain confirmation.
+ A transaction has been detected in the mempool fully paying for this invoice. Waiting for on-chain confirmation.
}
@@ -16,13 +16,13 @@
1" class="form-group">
-
-
+
-
@@ -30,63 +30,63 @@
-
+
@if (!minimal) {
- {{ loadedInvoice.btcDue | number: '1.0-8' }} BTC
+ {{ invoice.btcDue | number: '1.0-8' }} BTC
}
-
+
@if (!minimal) {
- {{ loadedInvoice.btcDue * 100_000_000 | number: '1.0-0' }} sats
+ {{ invoice.btcDue * 100_000_000 | number: '1.0-0' }} sats
}
-
+
@if (!minimal) {
- {{ loadedInvoice.btcDue | number: '1.0-8' }} BTC
+ {{ invoice.btcDue | number: '1.0-8' }} BTC
}
diff --git a/frontend/src/app/components/bitcoin-invoice/bitcoin-invoice.component.ts b/frontend/src/app/components/bitcoin-invoice/bitcoin-invoice.component.ts
index cb7e78ebd..20f88d5c5 100644
--- a/frontend/src/app/components/bitcoin-invoice/bitcoin-invoice.component.ts
+++ b/frontend/src/app/components/bitcoin-invoice/bitcoin-invoice.component.ts
@@ -13,7 +13,6 @@ import { ServicesApiServices } from '../../services/services-api.service';
})
export class BitcoinInvoiceComponent implements OnInit, OnChanges, OnDestroy {
@Input() invoice;
- @Input() invoiceId: string;
@Input() redirect = true;
@Input() minimal = false;
@Output() completed = new EventEmitter();
@@ -21,7 +20,6 @@ export class BitcoinInvoiceComponent implements OnInit, OnChanges, OnDestroy {
paymentForm: FormGroup;
requestSubscription: Subscription | undefined;
paymentStatusSubscription: Subscription | undefined;
- loadedInvoice: any;
paymentStatus = 1; // 1 - Waiting for invoice | 2 - Pending payment | 3 - Payment completed
paramMapSubscription: Subscription | undefined;
invoiceSubscription: Subscription | undefined;
@@ -53,55 +51,37 @@ export class BitcoinInvoiceComponent implements OnInit, OnChanges, OnDestroy {
this.paymentForm = this.formBuilder.group({
'method': 'lightning'
});
-
- /**
- * If the invoice is passed in the url, fetch it and display btcpay payment
- * Otherwise get a new invoice
- */
- this.paramMapSubscription = this.activatedRoute.paramMap
- .pipe(
- tap((paramMap) => {
- this.fetchInvoice(paramMap.get('invoiceId') ?? this.invoiceId);
- })
- ).subscribe();
}
ngOnChanges(changes: SimpleChanges): void {
- if ((changes.invoice || changes.invoiceId) && this.invoiceId) {
- this.fetchInvoice(this.invoiceId);
+ if (changes.invoice) {
+ this.watchInvoice();
}
}
- fetchInvoice(invoiceId: string): void {
- if (invoiceId) {
- if (this.paymentStatusSubscription) {
- this.paymentStatusSubscription.unsubscribe();
- }
- this.paymentStatusSubscription = ((this.invoice && this.invoice.id === invoiceId) ? of(this.invoice) : this.apiService.retreiveInvoice$(invoiceId)).pipe(
- tap((invoice: any) => {
- this.loadedInvoice = invoice;
- if (this.loadedInvoice.btcDue > 0) {
- this.paymentStatus = 2;
- } else {
- this.paymentStatus = 4;
- }
- }),
- switchMap(() => this.apiService.getPaymentStatus$(this.loadedInvoice.id)
- .pipe(
- retry({ delay: () => timer(2000)})
- )
- ),
- ).subscribe({
- next: ((result) => {
- this.paymentStatus = 3;
- this.completed.emit();
- }),
- });
+ watchInvoice(): void {
+ if (this.paymentStatusSubscription) {
+ this.paymentStatusSubscription.unsubscribe();
}
+ if (!this.invoice) {
+ this.paymentStatus = 1;
+ return;
+ }
+ if (this.invoice.btcDue > 0) {
+ this.paymentStatus = 2;
+ } else {
+ this.paymentStatus = 4;
+ }
+ this.paymentStatusSubscription = this.apiService.getPaymentStatus$(this.invoice.btcpayInvoiceId).pipe(
+ retry({ delay: () => timer(2000)})
+ ).subscribe((result) => {
+ this.paymentStatus = 3;
+ this.completed.emit();
+ });
}
get availableMethods(): string[] {
- return Object.keys(this.loadedInvoice?.addresses || {}).filter(k => k === 'BTC_LightningLike');
+ return Object.keys(this.invoice?.addresses || {}).filter(k => k === 'BTC_LightningLike');
}
bypassSecurityTrustUrl(text: string): SafeUrl {