diff --git a/frontend/src/app/components/accelerate-checkout/accelerate-checkout.component.html b/frontend/src/app/components/accelerate-checkout/accelerate-checkout.component.html index 5a57b492b..a77347cdf 100644 --- a/frontend/src/app/components/accelerate-checkout/accelerate-checkout.component.html +++ b/frontend/src/app/components/accelerate-checkout/accelerate-checkout.component.html @@ -240,119 +240,141 @@ } @else if (step === 'summary') { - -
-
-

Accelerate your Bitcoin transaction?

+ + +
+
+

Accelerate your Bitcoin transaction?

+
-
-
+ +
+
+
+ + +
+
+
+
+ + +
+
+
+ Your transaction will be prioritized by up to {{ etaInfo.hashratePercentage | number : '1.1-1' }}% of miners. + +
+
+
+
+ +
+
+
+ +
-
- - +
+
+
+ + } @else if (step === 'checkout') { + +
-
- - +
+ Accelerate to ~{{ ((userBid + estimate.txSummary.effectiveFee) / estimate.txSummary.effectiveVsize) | number : '1.0-0' }} sat/vB + + @if (!calculating) { + For an additional ({{ cost | number }} sats) + } @else { + Calculating cost... + } + + + Reducing expected confirmation time to +
-
+
Your transaction will be prioritized by up to {{ etaInfo.hashratePercentage | number : '1.1-1' }}% of miners.
-
-
-
-
- - } @else if (step === 'checkout') { -
-
-
- Accelerate to ~{{ ((userBid + estimate.txSummary.effectiveFee) / estimate.txSummary.effectiveVsize) | number : '1.0-0' }} sat/vB - - @if (!calculating) { - For an additional ({{ cost | number }} sats) - } @else { - Calculating cost... - } - - - Reducing expected confirmation time to - -
-
-
- Your transaction will be prioritized by up to {{ etaInfo.hashratePercentage | number : '1.1-1' }}% of miners. - -
-
- @if (canPayWithBalance || !(canPayWithBitcoin || canPayWithCashapp)) { -
- -
- } @else { -
-
-

Payment to mempool.space for acceleration of txid {{ tx.txid.substr(0, 10) }}..{{ tx.txid.substr(-10) }}

-
-
- @if (canPayWithBitcoin) { -
- @if (invoice) { -

Pay {{ cost | number }} sats

- - } @else { - Loading invoice... - + } @else { +
+
+

Payment to mempool.space for acceleration of txid {{ tx.txid.substr(0, 10) }}..{{ tx.txid.substr(-10) }}

+
+
+ @if (canPayWithBitcoin) { +
+ @if (invoice) { +

Pay {{ cost | number }} sats

+ + } @else { + Loading invoice... + + } +
+ @if (canPayWithCashapp) { +
+

—OR—

+
} -
- @if (canPayWithCashapp) { -
-

—OR—

+ } + @if (cashappEnabled) { +
+

Pay with

+
} - } - @if (cashappEnabled) { -
-

Pay with

- -
- } +
+
+ } + + +
+
+
+ +
- } + @if (showSummary) {
@@ -413,7 +435,6 @@
} - @else if (step === 'processing') {
@@ -434,4 +455,20 @@
} + @else if (step === 'paid') { +
+
+

Accelerating your transaction

+
+
+ +
+
+
+

Confirming your acceleration with our mining pool partners...

+ +
+
+
+ }
\ No newline at end of file diff --git a/frontend/src/app/components/accelerate-checkout/accelerate-checkout.component.ts b/frontend/src/app/components/accelerate-checkout/accelerate-checkout.component.ts index 6af453706..a580360a5 100644 --- a/frontend/src/app/components/accelerate-checkout/accelerate-checkout.component.ts +++ b/frontend/src/app/components/accelerate-checkout/accelerate-checkout.component.ts @@ -41,7 +41,7 @@ export const MIN_BID_RATIO = 1; export const DEFAULT_BID_RATIO = 2; export const MAX_BID_RATIO = 4; -type CheckoutStep = 'quote' | 'summary' | 'checkout' | 'cashapp' | 'processing'; +type CheckoutStep = 'quote' | 'summary' | 'checkout' | 'cashapp' | 'processing' | 'paid'; @Component({ selector: 'app-accelerate-checkout', @@ -58,7 +58,6 @@ export class AccelerateCheckout implements OnInit, OnDestroy { @Input() forceSummary: boolean = false; @Input() forceMobile: boolean = false; @Output() changeMode = new EventEmitter(); - @Output() close = new EventEmitter(); calculating = true; choosenOption: 'wait' | 'accel'; @@ -294,7 +293,7 @@ export class AccelerateCheckout implements OnInit, OnDestroy { this.audioService.playSound('ascend-chime-cartoon'); this.showSuccess = true; this.estimateSubscription.unsubscribe(); - this.closeModal(2000); + this.moveToStep('paid') }, error: (response) => { if (response.status === 403 && response.error === 'not_available') { @@ -409,7 +408,7 @@ export class AccelerateCheckout implements OnInit, OnDestroy { that.cashAppPay.destroy(); } setTimeout(() => { - that.closeModal(); + this.moveToStep('paid'); if (window.history.replaceState) { const urlParams = new URLSearchParams(window.location.search); window.history.replaceState(null, null, window.location.toString().replace(`?cash_request_id=${urlParams.get('cash_request_id')}`, '')); @@ -457,13 +456,6 @@ export class AccelerateCheckout implements OnInit, OnDestroy { selectedOptionChanged(event) { this.choosenOption = event.target.id; } - closeModal(timeout: number = 0): void { - setTimeout(() => { - this._step = 'processing'; - this.cd.markForCheck(); - this.close.emit(); - }, timeout); - } isLoggedIn(): boolean { const auth = this.storageService.getAuth(); diff --git a/frontend/src/app/components/tracker/tracker.component.html b/frontend/src/app/components/tracker/tracker.component.html index 64277e3e0..f65e1a204 100644 --- a/frontend/src/app/components/tracker/tracker.component.html +++ b/frontend/src/app/components/tracker/tracker.component.html @@ -122,7 +122,7 @@   } @else if (showAccelerationSummary && !accelerationFlowCompleted) { - + } @else { @if (tx?.acceleration && !tx.status?.confirmed) { diff --git a/frontend/src/app/components/tracker/tracker.component.ts b/frontend/src/app/components/tracker/tracker.component.ts index 00051350b..b9c2b5ae7 100644 --- a/frontend/src/app/components/tracker/tracker.component.ts +++ b/frontend/src/app/components/tracker/tracker.component.ts @@ -386,6 +386,10 @@ export class TrackerComponent implements OnInit, OnDestroy { if (txPosition.position?.block > 0 && this.tx.weight < 4000) { this.accelerationEligible = true; } + } else if (this.showAccelerationSummary) { + setTimeout(() => { + this.accelerationFlowCompleted = true; + }, 2000); } } } else { diff --git a/frontend/src/app/components/transaction/transaction.component.html b/frontend/src/app/components/transaction/transaction.component.html index cb20abe1e..0e67887dc 100644 --- a/frontend/src/app/components/transaction/transaction.component.html +++ b/frontend/src/app/components/transaction/transaction.component.html @@ -84,7 +84,7 @@
- + Urgent transaction? Get it confirmed faster. diff --git a/frontend/src/app/components/transaction/transaction.component.ts b/frontend/src/app/components/transaction/transaction.component.ts index c4b4a6af1..1e37ca3fc 100644 --- a/frontend/src/app/components/transaction/transaction.component.ts +++ b/frontend/src/app/components/transaction/transaction.component.ts @@ -767,8 +767,14 @@ export class TransactionComponent implements OnInit, AfterViewInit, OnDestroy { setIsAccelerated(initialState: boolean = false) { this.isAcceleration = (this.tx.acceleration || (this.accelerationInfo && this.pool && this.accelerationInfo.pools.some(pool => (pool === this.pool.id)))); - if (this.isAcceleration && initialState) { - this.showAccelerationSummary = false; + if (this.isAcceleration) { + if (initialState) { + this.showAccelerationSummary = false; + } else if (this.showAccelerationSummary) { + setTimeout(() => { + this.showAccelerationSummary = false; + }, 2000); + } } if (this.isAcceleration) { // this immediately returns cached stats if we fetched them recently