highperfocused/mempool
1
0
Fork 0
mirror of https://github.com/mempool/mempool.git synced 2025-04-08 03:48:31 +02:00
Code Issues Packages Projects Releases Wiki Activity

[accelerator] restore scroll events, remove eta button

Browse Source
This commit is contained in:
Mononaut 2024-06-30 01:46:11 +00:00
parent c5fc476834
commit f68c8cc621
No known key found for this signature in database
GPG Key ID: A3F058E41374C04E
5 changed files with 36 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
frontend/src/app/components/accelerate-checkout/accelerate-checkout.component.ts
View File

@ -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);

6
frontend/src/app/components/tracker/tracker.component.html
View File

@ -75,9 +75,9 @@
} @else {
<app-time kind="until" [time]="eta.time" [fastRender]="false" [fixedRender]="true"></app-time>
}
@if (!showAccelerationSummary && isMobile && !tx.acceleration && acceleratorAvailable && accelerateCtaType === 'button' && !tx?.acceleration) {
<!-- @if (!showAccelerationSummary && isMobile && !tx.acceleration && acceleratorAvailable && accelerateCtaType === 'button' && !tx?.acceleration) {
<a class="btn btn-sm accelerate btn-small-height" i18n="transaction.accelerate|Accelerate button label" (click)="onAccelerateClicked()">Accelerate</a>
}
} -->
</span>
</ng-container>
<ng-template #etaSkeleton>
@ -122,7 +122,7 @@
<span class="explainer">&nbsp;</span>
} @else if (showAccelerationSummary && !accelerationFlowCompleted) {
<ng-container *ngIf="(ETA$ | async) as eta;">
<app-accelerate-checkout *ngIf="(da$ | async) as da;" [cashappEnabled]="accelerationEligible" [advancedEnabled]="false" [forceMobile]="true" [tx]="tx" [miningStats]="miningStats" [eta]="eta" class="h-100 w-100"></app-accelerate-checkout>
<app-accelerate-checkout *ngIf="(da$ | async) as da;" [cashappEnabled]="accelerationEligible" [advancedEnabled]="false" [forceMobile]="true" [tx]="tx" [miningStats]="miningStats" [eta]="eta" [scrollEvent]="scrollIntoAccelPreview" class="h-100 w-100"></app-accelerate-checkout>
</ng-container>
} @else {
@if (tx?.acceleration && !tx.status?.confirmed) {

2
frontend/src/app/components/tracker/tracker.component.ts
View File

@ -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;
}

6
frontend/src/app/components/transaction/transaction.component.html
View File

@ -84,7 +84,7 @@
<div class="clearfix"></div>
<ng-container *ngIf="(ETA$ | async) as eta;">
<app-accelerate-checkout *ngIf="(da$ | async) as da;" [cashappEnabled]="accelerationEligible" [advancedEnabled]="true" [tx]="tx" [eta]="eta" [miningStats]="miningStats" class="h-100 w-100">
<app-accelerate-checkout *ngIf="(da$ | async) as da;" [cashappEnabled]="accelerationEligible" [advancedEnabled]="true" [tx]="tx" [eta]="eta" [miningStats]="miningStats" [scrollEvent]="scrollIntoAccelPreview" class="h-100 w-100">
<span slot="cta-title">Urgent transaction? Get it confirmed faster.</span>
</app-accelerate-checkout>
</ng-container>
@ -540,9 +540,9 @@
@if (eta.blocks >= 7) {
<span [class]="(!tx?.acceleration && acceleratorAvailable && accelerateCtaType === 'button') ? 'etaDeepMempool d-flex justify-content-end align-items-center' : ''">
<span i18n="transaction.eta.in-several-hours|Transaction ETA in several hours or more">In several hours (or more)</span>
@if (!tx?.acceleration && acceleratorAvailable && accelerateCtaType === 'button') {
<!-- @if (!tx?.acceleration && acceleratorAvailable && accelerateCtaType === 'button') {
<a class="btn btn-sm accelerateDeepMempool btn-small-height" i18n="transaction.accelerate|Accelerate button label" (click)="onAccelerateClicked()">Accelerate</a>
}
} -->
</span>
} @else if (network === 'liquid' || network === 'liquidtestnet') {
<app-time kind="until" [time]="eta.time" [fastRender]="false" [fixedRender]="true"></app-time>

2
frontend/src/app/components/transaction/transaction.component.ts
View File

@ -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;
}