diff --git a/frontend/src/app/components/transaction/transaction.component.html b/frontend/src/app/components/transaction/transaction.component.html index ae418ffd3..4e3425d5e 100644 --- a/frontend/src/app/components/transaction/transaction.component.html +++ b/frontend/src/app/components/transaction/transaction.component.html @@ -40,64 +40,39 @@
- - - - -
-
+ @if (!error) { +
+
+ @if (isMobile) {
- - - - - - - - - - - - - - - - - - - - + + + +
Timestamp - ‎{{ tx.status.block_time * 1000 | date:'yyyy-MM-dd HH:mm' }} -
- () -
-
Confirmed
Features - -
Audit - - Coinbase - Expected in Block - Seen in Mempool - Not seen in Mempool - Added - Prioritized - Conflict - - - -
+
+ } @else { +
+ + +
- + + + + +
-
+ }
+
+ } - + @@ -113,69 +88,6 @@
- - -
-
-
- - - - - - - - - - - - - - - - - - - - - - - - -
First seen
ETA - - - - - - - In several hours (or more) - Accelerate - - - - - - - - - - Accelerate - - - - -
Features - -
-
-
- -
-
-
- -
@@ -364,42 +276,7 @@ - -
-
-
- - - - - - - - - - - -
-
-
- - - - - - - - - - - -
-
-
-
-
-

Flow

@@ -525,65 +402,264 @@
- - - - + + @if (tx?.status?.confirmed) { + + + } @else { + + + } + + @if (tx?.status?.confirmed) { + + } + + + + + + + + @if (tx?.status?.confirmed) { + + } + + + + @if (!isLoadingTx) { + + + + + } @else { + + } + + + + @if (!isLoadingTx) { + @if (transactionTime > 0) { - - + + + } + } @else { + + } + + + + @if (!isLoadingTx && transactionTime !== -1) { + + + + + } @else { + + } + + + + @if (network !== 'liquid' && network !== 'liquidtestnet') { + @if (!isLoadingTx) { + @if (featuresEnabled) { + + + + + } + } @else { + + } + } + + + + @if (network === '') { + @if (!isLoadingTx) { + @if (auditStatus) { + + + + + } + } @else { + + } + } + + + + @if (!isLoadingTx) { + @if (!replaced && !isCached) { - + - - - + } + } @else { + + } + + + + @if (!isLoadingTx) { + @if (((auditStatus && auditStatus.accelerated) || accelerationInfo || (tx && tx.acceleration)) || filters.length) { + + + + + } + } @else { + + } + + + + @if (!isLoadingTx) { + + + + + } @else { + + } + + + + @if (!isLoadingTx) { + + + + + } @else { + + } + + + + @if (!isLoadingTx) { + @if ((cpfpInfo && hasEffectiveFeeRate) || accelerationInfo) { + + @if (tx.acceleration || accelerationInfo) { + + } @else { + + } - - - - - - -
Timestamp + ‎{{ tx.status.block_time * 1000 | date:'yyyy-MM-dd HH:mm' }} +
+ () +
+
Fee{{ tx.fee | number }} sat Confirmed
First seen
Features + +
Audit + + @if (auditStatus.coinbase) { + Coinbase + } @else if (auditStatus.expected) { + Expected in Block + } @else if (auditStatus.seen) { + Seen in Mempool + } @else if (!auditStatus.conflict) { + Not seen in Mempool + } + @if (auditStatus.added) { + Added + } + @if (auditStatus.prioritized) { + Prioritized + } + @if (auditStatus.conflict) { + Conflict + } + +
Fee rateETA - - -   - - + @if (this.mempoolPosition?.block == null) { + + } @else if (this.mempoolPosition.block >= 7) { + + In several hours (or more) + @if (!tx.acceleration && acceleratorAvailable && accelerateCtaType === 'button' && !tx?.acceleration) { + Accelerate + } + + } @else if (network === 'liquid' || network === 'liquidtestnet') { + + } @else { + + + @if (!tx.acceleration && acceleratorAvailable && accelerateCtaType === 'button' && !tx?.acceleration) { + Accelerate + } + + }
Accelerated fee rateEffective fee rate
+ + + @if ((auditStatus && auditStatus.accelerated) || accelerationInfo || (tx && tx.acceleration)) { + Accelerated + } + + {{ filter.label }} + +
Fee{{ tx.fee | number }} sat
Fee rate + + @if (tx?.status?.confirmed && tx.fee && !hasEffectiveFeeRate && !accelerationInfo) { +   + + } +
Accelerated fee rateEffective fee rate
- - + @if (accelerationInfo) { + + } @else { + + } - - - + @if (tx?.status?.confirmed && !tx.acceleration && !accelerationInfo && tx.fee && tx.effectiveFeePerVsize) { + + }
- + @if (hasCpfp) { + + }
Miner - - {{ pool.name }} - - - -
+ } + } @else { + + } - - - - - - - Accelerated - - {{ filter.label }} - - - + + @if (network === '') { + @if (!isLoadingTx) { + + Miner + @if (pool) { + + + {{ pool.name }} + + + } @else { + + + + } + + } @else { + + } + } + + + + + + \ No newline at end of file diff --git a/frontend/src/app/components/transaction/transaction.component.ts b/frontend/src/app/components/transaction/transaction.component.ts index 93fb97fac..ab55d706a 100644 --- a/frontend/src/app/components/transaction/transaction.component.ts +++ b/frontend/src/app/components/transaction/transaction.component.ts @@ -87,6 +87,7 @@ export class TransactionComponent implements OnInit, AfterViewInit, OnDestroy { rbfReplaces: string[]; rbfInfo: RbfTree; cpfpInfo: CpfpInfo | null; + hasCpfp: boolean = false; accelerationInfo: Acceleration | null = null; sigops: number | null; adjustedVsize: number | null; @@ -491,10 +492,10 @@ export class TransactionComponent implements OnInit, AfterViewInit, OnDestroy { txFeePerVSize: tx.effectiveFeePerVsize, mempoolPosition: this.mempoolPosition, }); - this.cpfpInfo = { + this.setCpfpInfo({ ancestors: tx.ancestors, bestDescendant: tx.bestDescendant, - }; + }); const hasRelatives = !!(tx.ancestors?.length || tx.bestDescendant); this.hasEffectiveFeeRate = hasRelatives || (tx.effectiveFeePerVsize && (Math.abs(tx.effectiveFeePerVsize - tx.feePerVsize) > 0.01)); } else { @@ -646,6 +647,7 @@ export class TransactionComponent implements OnInit, AfterViewInit, OnDestroy { setCpfpInfo(cpfpInfo: CpfpInfo): void { if (!cpfpInfo || !this.tx) { this.cpfpInfo = null; + this.hasCpfp = false; this.hasEffectiveFeeRate = false; return; } @@ -675,6 +677,7 @@ export class TransactionComponent implements OnInit, AfterViewInit, OnDestroy { this.sigops = this.cpfpInfo.sigops; this.adjustedVsize = this.cpfpInfo.adjustedVsize; } + this.hasCpfp =!!(this.cpfpInfo && (this.cpfpInfo.bestDescendant || this.cpfpInfo.descendants?.length || this.cpfpInfo.ancestors?.length)); this.hasEffectiveFeeRate = hasRelatives || (this.tx.effectiveFeePerVsize && (Math.abs(this.tx.effectiveFeePerVsize - this.tx.feePerVsize) > 0.01)); }