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 30ce7a606..6a20f6ff7 100644 --- a/frontend/src/app/components/accelerate-checkout/accelerate-checkout.component.ts +++ b/frontend/src/app/components/accelerate-checkout/accelerate-checkout.component.ts @@ -52,6 +52,7 @@ export class AccelerateCheckout implements OnInit, OnDestroy { @Input() tx: Transaction; @Input() miningStats: MiningStats; @Input() eta: ETA; + @Input() scrollEvent: boolean; @Input() cashappEnabled: boolean = true; @Input() advancedEnabled: boolean = false; @Input() forceMobile: boolean = false; @@ -138,6 +139,12 @@ export class AccelerateCheckout implements OnInit, OnDestroy { } } + ngOnChanges(changes: SimpleChanges): void { + if (changes.scrollEvent && this.scrollEvent) { + this.scrollToElement('acceleratePreviewAnchor', 'start'); + } + } + moveToStep(step: CheckoutStep) { this._step = step; if (!this.estimate && ['quote', 'summary', 'checkout'].includes(this.step)) { @@ -153,6 +160,26 @@ export class AccelerateCheckout implements OnInit, OnDestroy { } } + /** + * Scroll to element id with or without setTimeout + */ + scrollToElementWithTimeout(id: string, position: ScrollLogicalPosition, timeout: number = 1000): void { + setTimeout(() => { + this.scrollToElement(id, position); + }, timeout); + } + scrollToElement(id: string, position: ScrollLogicalPosition) { + const acceleratePreviewAnchor = document.getElementById(id); + if (acceleratePreviewAnchor) { + this.cd.markForCheck(); + acceleratePreviewAnchor.scrollIntoView({ + behavior: 'smooth', + inline: position, + block: position, + }); + } + } + /** * Accelerator */ @@ -410,6 +437,7 @@ export class AccelerateCheckout implements OnInit, OnDestroy { next: (response) => { this.invoice = response; this.cd.markForCheck(); + this.scrollToElementWithTimeout('acceleratePreviewAnchor', 'start', 500); }, error: (response) => { console.log(response); diff --git a/frontend/src/app/components/tracker/tracker.component.html b/frontend/src/app/components/tracker/tracker.component.html index 417038539..6bb0950b5 100644 --- a/frontend/src/app/components/tracker/tracker.component.html +++ b/frontend/src/app/components/tracker/tracker.component.html @@ -75,9 +75,9 @@ } @else { } - @if (!showAccelerationSummary && isMobile && !tx.acceleration && acceleratorAvailable && accelerateCtaType === 'button' && !tx?.acceleration) { + @@ -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 88a929bd7..397f98805 100644 --- a/frontend/src/app/components/tracker/tracker.component.ts +++ b/frontend/src/app/components/tracker/tracker.component.ts @@ -743,7 +743,7 @@ export class TrackerComponent implements OnInit, OnDestroy { } this.enterpriseService.goal(8); this.showAccelerationSummary = true && this.acceleratorAvailable; - this.scrollIntoAccelPreview = !this.scrollIntoAccelPreview; + this.scrollIntoAccelPreview = true; return false; } diff --git a/frontend/src/app/components/transaction/transaction.component.html b/frontend/src/app/components/transaction/transaction.component.html index 1c83bba40..5a2c1510a 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. @@ -540,9 +540,9 @@ @if (eta.blocks >= 7) { In several hours (or more) - @if (!tx?.acceleration && acceleratorAvailable && accelerateCtaType === 'button') { + } @else if (network === 'liquid' || network === 'liquidtestnet') { diff --git a/frontend/src/app/components/transaction/transaction.component.ts b/frontend/src/app/components/transaction/transaction.component.ts index 7b12b3c7b..74f49c69b 100644 --- a/frontend/src/app/components/transaction/transaction.component.ts +++ b/frontend/src/app/components/transaction/transaction.component.ts @@ -710,7 +710,7 @@ export class TransactionComponent implements OnInit, AfterViewInit, OnDestroy { document.location.hash = '#accelerate'; this.enterpriseService.goal(8); this.showAccelerationSummary = true && this.acceleratorAvailable; - this.scrollIntoAccelPreview = !this.scrollIntoAccelPreview; + this.scrollIntoAccelPreview = true; return false; }