Fix pizza tracker loading state
This commit is contained in:
parent
5872b2c46b
commit
193c41cb81
@ -335,7 +335,7 @@
|
|||||||
<app-bitcoin-invoice style="width: 100%;" [invoiceId]="invoice.btcpayInvoiceId" [minimal]="true" (completed)="closeModal(2000)"></app-bitcoin-invoice>
|
<app-bitcoin-invoice style="width: 100%;" [invoiceId]="invoice.btcpayInvoiceId" [minimal]="true" (completed)="closeModal(2000)"></app-bitcoin-invoice>
|
||||||
} @else {
|
} @else {
|
||||||
<span>Loading invoice...</span>
|
<span>Loading invoice...</span>
|
||||||
<div class="ml-2 spinner-border text-light" style="width: 25px; height: 25px"></div>
|
<div class="m-4 spinner-border text-light" style="width: 25px; height: 25px"></div>
|
||||||
}
|
}
|
||||||
</div>
|
</div>
|
||||||
@if (canPayWithCashapp) {
|
@if (canPayWithCashapp) {
|
||||||
|
@ -115,7 +115,12 @@
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="bottom-panel">
|
<div class="bottom-panel">
|
||||||
@if (showAccelerationSummary && !accelerationFlowCompleted) {
|
@if (isLoading) {
|
||||||
|
<div class="progress-icon">
|
||||||
|
<div class="spinner-border text-light" style="width: 1em; height: 1em"></div>
|
||||||
|
</div>
|
||||||
|
<span class="explainer"> </span>
|
||||||
|
} @else if (showAccelerationSummary && !accelerationFlowCompleted) {
|
||||||
<ng-container *ngIf="(ETA$ | async) as eta;">
|
<ng-container *ngIf="(ETA$ | async) as eta;">
|
||||||
<app-accelerate-checkout *ngIf="(da$ | async) as da;" [forceSummary]="true" [cashappEnabled]="accelerationEligible" [advancedEnabled]="false" [forceMobile]="true" [tx]="tx" [miningStats]="miningStats" [eta]="eta" (close)="accelerationFlowCompleted = true" [scrollEvent]="scrollIntoAccelPreview" class="h-100 w-100"></app-accelerate-checkout>
|
<app-accelerate-checkout *ngIf="(da$ | async) as da;" [forceSummary]="true" [cashappEnabled]="accelerationEligible" [advancedEnabled]="false" [forceMobile]="true" [tx]="tx" [miningStats]="miningStats" [eta]="eta" (close)="accelerationFlowCompleted = true" [scrollEvent]="scrollIntoAccelPreview" class="h-100 w-100"></app-accelerate-checkout>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
|
@ -63,8 +63,9 @@ export class TrackerComponent implements OnInit, OnDestroy {
|
|||||||
mempoolPosition: MempoolPosition;
|
mempoolPosition: MempoolPosition;
|
||||||
accelerationPositions: AccelerationPosition[];
|
accelerationPositions: AccelerationPosition[];
|
||||||
isLoadingTx = true;
|
isLoadingTx = true;
|
||||||
error: any = undefined;
|
|
||||||
loadingCachedTx = false;
|
loadingCachedTx = false;
|
||||||
|
loadingPosition = true;
|
||||||
|
error: any = undefined;
|
||||||
waitingForTransaction = false;
|
waitingForTransaction = false;
|
||||||
latestBlock: BlockExtended;
|
latestBlock: BlockExtended;
|
||||||
transactionTime = -1;
|
transactionTime = -1;
|
||||||
@ -148,13 +149,6 @@ export class TrackerComponent implements OnInit, OnDestroy {
|
|||||||
ngOnInit() {
|
ngOnInit() {
|
||||||
this.onResize();
|
this.onResize();
|
||||||
|
|
||||||
window['setStage'] = ((stage: TrackerStage) => {
|
|
||||||
this.zone.run(() => {
|
|
||||||
this.trackerStage = stage;
|
|
||||||
this.cd.markForCheck();
|
|
||||||
});
|
|
||||||
}).bind(this);
|
|
||||||
|
|
||||||
this.acceleratorAvailable = this.stateService.env.OFFICIAL_MEMPOOL_SPACE && this.stateService.env.ACCELERATOR && this.stateService.network === '';
|
this.acceleratorAvailable = this.stateService.env.OFFICIAL_MEMPOOL_SPACE && this.stateService.env.ACCELERATOR && this.stateService.network === '';
|
||||||
|
|
||||||
const urlParams = new URLSearchParams(window.location.search);
|
const urlParams = new URLSearchParams(window.location.search);
|
||||||
@ -361,6 +355,7 @@ export class TrackerComponent implements OnInit, OnDestroy {
|
|||||||
this.mempoolPositionSubscription = this.stateService.mempoolTxPosition$.subscribe(txPosition => {
|
this.mempoolPositionSubscription = this.stateService.mempoolTxPosition$.subscribe(txPosition => {
|
||||||
this.now = Date.now();
|
this.now = Date.now();
|
||||||
if (txPosition && txPosition.txid === this.txId && txPosition.position) {
|
if (txPosition && txPosition.txid === this.txId && txPosition.position) {
|
||||||
|
this.loadingPosition = false;
|
||||||
this.mempoolPosition = txPosition.position;
|
this.mempoolPosition = txPosition.position;
|
||||||
this.accelerationPositions = txPosition.accelerationPositions;
|
this.accelerationPositions = txPosition.accelerationPositions;
|
||||||
if (this.tx && !this.tx.status.confirmed) {
|
if (this.tx && !this.tx.status.confirmed) {
|
||||||
@ -443,6 +438,7 @@ export class TrackerComponent implements OnInit, OnDestroy {
|
|||||||
))
|
))
|
||||||
.subscribe((tx: Transaction) => {
|
.subscribe((tx: Transaction) => {
|
||||||
if (!tx) {
|
if (!tx) {
|
||||||
|
this.loadingPosition = false;
|
||||||
this.fetchCachedTx$.next(this.txId);
|
this.fetchCachedTx$.next(this.txId);
|
||||||
this.seoService.logSoft404();
|
this.seoService.logSoft404();
|
||||||
return;
|
return;
|
||||||
@ -475,6 +471,7 @@ export class TrackerComponent implements OnInit, OnDestroy {
|
|||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
this.trackerStage = 'confirmed';
|
this.trackerStage = 'confirmed';
|
||||||
|
this.loadingPosition = false;
|
||||||
this.fetchAcceleration$.next(tx.status.block_hash);
|
this.fetchAcceleration$.next(tx.status.block_hash);
|
||||||
this.fetchMiningInfo$.next({ hash: tx.status.block_hash, height: tx.status.block_height, txid: tx.txid });
|
this.fetchMiningInfo$.next({ hash: tx.status.block_hash, height: tx.status.block_height, txid: tx.txid });
|
||||||
this.transactionTime = 0;
|
this.transactionTime = 0;
|
||||||
@ -735,12 +732,17 @@ export class TrackerComponent implements OnInit, OnDestroy {
|
|||||||
return false;
|
return false;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
get isLoading(): boolean {
|
||||||
|
return this.isLoadingTx || this.loadingCachedTx || this.loadingPosition;
|
||||||
|
}
|
||||||
|
|
||||||
resetTransaction() {
|
resetTransaction() {
|
||||||
this.error = undefined;
|
this.error = undefined;
|
||||||
this.tx = null;
|
this.tx = null;
|
||||||
this.txChanged$.next(true);
|
this.txChanged$.next(true);
|
||||||
this.waitingForTransaction = false;
|
this.waitingForTransaction = false;
|
||||||
this.isLoadingTx = true;
|
this.isLoadingTx = true;
|
||||||
|
this.loadingPosition = true;
|
||||||
this.rbfTransaction = undefined;
|
this.rbfTransaction = undefined;
|
||||||
this.replaced = false;
|
this.replaced = false;
|
||||||
this.latestReplacement = '';
|
this.latestReplacement = '';
|
||||||
|
Loading…
x
Reference in New Issue
Block a user