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 40089ddbf..aba494d0e 100644 --- a/frontend/src/app/components/accelerate-checkout/accelerate-checkout.component.html +++ b/frontend/src/app/components/accelerate-checkout/accelerate-checkout.component.html @@ -1,4 +1,4 @@ -
+
@if (error) {
@@ -10,18 +10,33 @@
-

Accelerate your Bitcoin transaction?

+

Accelerate your Bitcoin transaction?

-
-
+
+
+
+ + +
+
+
-
-
-
-
- - -
+
+ Your transaction will be prioritized by up to {{ etaInfo.hashratePercentage | number : '1.1-1' }}% of miners. +
@@ -62,7 +64,7 @@ } @else if (step === 'paymentMethod') {
-

Select your payment method

+

Select your payment method

@@ -76,14 +78,14 @@
-

Confirm your payment

+

Confirm your payment

- Payment to mempool.space for acceleration of txid {{ txid.substr(0, 10) }}..{{ txid.substr(-10) }} + Payment to mempool.space for acceleration of txid {{ tx.txid.substr(0, 10) }}..{{ tx.txid.substr(-10) }}
@@ -134,7 +136,7 @@ @else if (step === 'processing') {
-

Confirming your payment

+

Confirming your payment

diff --git a/frontend/src/app/components/accelerate-checkout/accelerate-checkout.component.scss b/frontend/src/app/components/accelerate-checkout/accelerate-checkout.component.scss index 268f03f93..af11f6c2b 100644 --- a/frontend/src/app/components/accelerate-checkout/accelerate-checkout.component.scss +++ b/frontend/src/app/components/accelerate-checkout/accelerate-checkout.component.scss @@ -14,4 +14,14 @@ border-radius: 15px; border: 2px solid var(--bg); cursor: pointer; +} + +.default-slot:not(:only-child) { + display: none; +} + +.pie { + display: flex; + align-items: center; + max-width: 330px; } \ 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 ba867d096..9e37cb67f 100644 --- a/frontend/src/app/components/accelerate-checkout/accelerate-checkout.component.ts +++ b/frontend/src/app/components/accelerate-checkout/accelerate-checkout.component.ts @@ -5,7 +5,9 @@ import { nextRoundNumber } from '../../shared/common.utils'; import { StateService } from '../../services/state.service'; import { AudioService } from '../../services/audio.service'; import { AccelerationEstimate } from '../accelerate-preview/accelerate-preview.component'; -import { EtaService } from '../../services/eta.service'; +import { ETA, EtaService } from '../../services/eta.service'; +import { Transaction } from '../../interfaces/electrs.interface'; +import { MiningStats } from '../../services/mining.service'; @Component({ selector: 'app-accelerate-checkout', @@ -13,10 +15,12 @@ import { EtaService } from '../../services/eta.service'; styleUrls: ['./accelerate-checkout.component.scss'] }) export class AccelerateCheckout implements OnInit, OnDestroy { - @Input() eta: number | null = null; - @Input() txid: string = '70c18d76cdb285a1b5bd87fdaae165880afa189809c30b4083ff7c0e69ee09ad'; + @Input() tx: Transaction; + @Input() miningStats: MiningStats; + @Input() eta: ETA; @Input() scrollEvent: boolean; @Input() cashappEnabled: boolean; + @Input() isTracker: boolean = false; @Output() close = new EventEmitter(); calculating = true; @@ -116,7 +120,7 @@ export class AccelerateCheckout implements OnInit, OnDestroy { this.estimateSubscription.unsubscribe(); } this.calculating = true; - this.estimateSubscription = this.servicesApiService.estimate$(this.txid).pipe( + this.estimateSubscription = this.servicesApiService.estimate$(this.tx.txid).pipe( tap((response) => { if (response.status === 204) { this.error = `cannot_accelerate_tx`; @@ -213,13 +217,13 @@ export class AccelerateCheckout implements OnInit, OnDestroy { amount: costUSD.toString(), label: 'Total', pending: true, - productUrl: `${redirectHostname}/tracker/${this.txid}`, + productUrl: `${redirectHostname}/tracker/${this.tx.txid}`, }, button: { shape: 'semiround', size: 'small', theme: 'light'} }); this.cashAppPay = await this.payments.cashAppPay(paymentRequest, { - redirectURL: `${redirectHostname}/tracker/${this.txid}`, - referenceId: `accelerator-${this.txid.substring(0, 15)}-${Math.round(new Date().getTime() / 1000)}`, + redirectURL: `${redirectHostname}/tracker/${this.tx.txid}`, + referenceId: `accelerator-${this.tx.txid.substring(0, 15)}-${Math.round(new Date().getTime() / 1000)}`, button: { shape: 'semiround', size: 'small', theme: 'light'} }); @@ -235,7 +239,7 @@ export class AccelerateCheckout implements OnInit, OnDestroy { this.error = error; } else if (tokenResult.status === 'OK') { that.servicesApiService.accelerateWithCashApp$( - that.txid, + that.tx.txid, tokenResult.token, tokenResult.details.cashAppPay.cashtag, tokenResult.details.cashAppPay.referenceId, @@ -277,7 +281,7 @@ export class AccelerateCheckout implements OnInit, OnDestroy { * BTCPay */ async requestBTCPayInvoice() { - this.servicesApiService.generateBTCPayAcceleratorInvoice$(this.txid).subscribe({ + this.servicesApiService.generateBTCPayAcceleratorInvoice$(this.tx.txid).subscribe({ next: (response) => { this.invoice = response; this.cd.markForCheck(); diff --git a/frontend/src/app/components/tracker/tracker.component.html b/frontend/src/app/components/tracker/tracker.component.html index 1380990df..c0f77c424 100644 --- a/frontend/src/app/components/tracker/tracker.component.html +++ b/frontend/src/app/components/tracker/tracker.component.html @@ -116,7 +116,9 @@
@if (showAccelerationSummary && !accelerationFlowCompleted) { - + + + } @else { @if (tx?.acceleration && !tx.status?.confirmed) {
diff --git a/frontend/src/app/components/transaction/transaction.component.html b/frontend/src/app/components/transaction/transaction.component.html index 43ead974d..65c859e5c 100644 --- a/frontend/src/app/components/transaction/transaction.component.html +++ b/frontend/src/app/components/transaction/transaction.component.html @@ -84,9 +84,17 @@
-
- -
+ @if (isLoggedIn()) { +
+ +
+ } @else { + + + 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 570242a9a..c84eb8787 100644 --- a/frontend/src/app/components/transaction/transaction.component.ts +++ b/frontend/src/app/components/transaction/transaction.component.ts @@ -140,6 +140,7 @@ export class TransactionComponent implements OnInit, AfterViewInit, OnDestroy { showAccelerationSummary = false; showAccelerationDetails = false; scrollIntoAccelPreview = false; + accelerationEligible = false; auditEnabled: boolean = this.stateService.env.AUDIT && this.stateService.env.BASE_MODULE === 'mempool' && this.stateService.env.MINING_DASHBOARD === true; @ViewChild('graphContainer') @@ -397,6 +398,7 @@ export class TransactionComponent implements OnInit, AfterViewInit, OnDestroy { } else if ((this.tx?.acceleration && txPosition.position.acceleratedBy)) { this.tx.acceleratedBy = txPosition.position.acceleratedBy; } + this.accelerationEligible = txPosition?.position?.block > 0 && this.tx?.weight < 4000; } } else { this.mempoolPosition = null; @@ -910,6 +912,11 @@ export class TransactionComponent implements OnInit, AfterViewInit, OnDestroy { } } + isLoggedIn(): boolean { + const auth = this.storageService.getAuth(); + return auth !== null; + } + ngOnDestroy() { this.subscription.unsubscribe(); this.fetchCpfpSubscription.unsubscribe(); diff --git a/frontend/src/app/components/transaction/transaction.module.ts b/frontend/src/app/components/transaction/transaction.module.ts index eb663c9ac..ac09067de 100644 --- a/frontend/src/app/components/transaction/transaction.module.ts +++ b/frontend/src/app/components/transaction/transaction.module.ts @@ -6,7 +6,10 @@ import { SharedModule } from '../../shared/shared.module'; import { TxBowtieModule } from '../tx-bowtie-graph/tx-bowtie.module'; import { GraphsModule } from '../../graphs/graphs.module'; import { AcceleratePreviewComponent } from '../accelerate-preview/accelerate-preview.component'; +import { AccelerateCheckout } from '../accelerate-checkout/accelerate-checkout.component'; import { AccelerateFeeGraphComponent } from '../accelerate-preview/accelerate-fee-graph.component'; +import { TrackerComponent } from '../tracker/tracker.component'; +import { TrackerBarComponent } from '../tracker/tracker-bar.component'; const routes: Routes = [ { @@ -38,7 +41,10 @@ export class TransactionRoutingModule { } ], declarations: [ TransactionComponent, + TrackerComponent, + TrackerBarComponent, AcceleratePreviewComponent, + AccelerateCheckout, AccelerateFeeGraphComponent, ] }) diff --git a/frontend/src/app/shared/shared.module.ts b/frontend/src/app/shared/shared.module.ts index e3f219aba..c060bbbd2 100644 --- a/frontend/src/app/shared/shared.module.ts +++ b/frontend/src/app/shared/shared.module.ts @@ -50,8 +50,6 @@ import { BlockOverviewGraphComponent } from '../components/block-overview-graph/ import { BlockOverviewTooltipComponent } from '../components/block-overview-tooltip/block-overview-tooltip.component'; import { BlockFiltersComponent } from '../components/block-filters/block-filters.component'; import { AddressGroupComponent } from '../components/address-group/address-group.component'; -import { TrackerComponent } from '../components/tracker/tracker.component'; -import { TrackerBarComponent } from '../components/tracker/tracker-bar.component'; import { SearchFormComponent } from '../components/search-form/search-form.component'; import { AddressLabelsComponent } from '../components/address-labels/address-labels.component'; import { FooterComponent } from '../components/footer/footer.component'; @@ -100,7 +98,6 @@ import { MempoolErrorComponent } from './components/mempool-error/mempool-error. import { AccelerationsListComponent } from '../components/acceleration/accelerations-list/accelerations-list.component'; import { PendingStatsComponent } from '../components/acceleration/pending-stats/pending-stats.component'; import { AccelerationStatsComponent } from '../components/acceleration/acceleration-stats/acceleration-stats.component'; -import { AccelerateCheckout } from '../components/accelerate-checkout/accelerate-checkout.component'; import { BlockViewComponent } from '../components/block-view/block-view.component'; import { EightBlocksComponent } from '../components/eight-blocks/eight-blocks.component'; @@ -165,8 +162,6 @@ import { OnlyVsizeDirective, OnlyWeightDirective } from './components/weight-dir BlockFiltersComponent, TransactionsListComponent, AddressGroupComponent, - TrackerComponent, - TrackerBarComponent, SearchFormComponent, AddressLabelsComponent, FooterComponent, @@ -225,7 +220,6 @@ import { OnlyVsizeDirective, OnlyWeightDirective } from './components/weight-dir MempoolErrorComponent, AccelerationsListComponent, AccelerationStatsComponent, - AccelerateCheckout, PendingStatsComponent, HttpErrorComponent, TwitterWidgetComponent, @@ -307,8 +301,6 @@ import { OnlyVsizeDirective, OnlyWeightDirective } from './components/weight-dir BlockFiltersComponent, TransactionsListComponent, AddressGroupComponent, - TrackerComponent, - TrackerBarComponent, SearchFormComponent, AddressLabelsComponent, FooterComponent, @@ -356,7 +348,6 @@ import { OnlyVsizeDirective, OnlyWeightDirective } from './components/weight-dir MempoolErrorComponent, AccelerationsListComponent, AccelerationStatsComponent, - AccelerateCheckout, PendingStatsComponent, HttpErrorComponent, TwitterWidgetComponent,