Confirmation badge component, fix negative confirmations
This commit is contained in:
@@ -0,0 +1,13 @@
|
||||
<ng-template [ngIf]="confirmations">
|
||||
<button type="button" class="btn btn-sm btn-success {{buttonClass}}">
|
||||
<ng-container *ngTemplateOutlet="confirmations == 1 ? confirmationSingular : confirmationPlural; context: {$implicit: confirmations}"></ng-container>
|
||||
<ng-template #confirmationSingular let-i i18n="shared.confirmation-count.singular|Transaction singular confirmation count">{{ i }} confirmation</ng-template>
|
||||
<ng-template #confirmationPlural let-i i18n="shared.confirmation-count.plural|Transaction plural confirmation count">{{ i }} confirmations</ng-template>
|
||||
</button>
|
||||
</ng-template>
|
||||
<ng-template [ngIf]="!hideUnconfirmed && !confirmations && replaced">
|
||||
<button type="button" class="btn btn-sm btn-danger {{buttonClass}}" i18n="transaction.unconfirmed|Transaction unconfirmed state">Replaced</button>
|
||||
</ng-template>
|
||||
<ng-template [ngIf]="!hideUnconfirmed && !confirmations && !replaced">
|
||||
<button type="button" class="btn btn-sm btn-danger {{buttonClass}}" i18n="transaction.unconfirmed|Transaction unconfirmed state">Unconfirmed</button>
|
||||
</ng-template>
|
||||
@@ -0,0 +1,25 @@
|
||||
import { Component, Input, OnChanges } from '@angular/core';
|
||||
|
||||
|
||||
@Component({
|
||||
selector: 'app-confirmations',
|
||||
templateUrl: './confirmations.component.html',
|
||||
styleUrls: ['./confirmations.component.scss'],
|
||||
})
|
||||
export class ConfirmationsComponent implements OnChanges {
|
||||
@Input() chainTip: number;
|
||||
@Input() height: number;
|
||||
@Input() replaced: boolean = false;
|
||||
@Input() hideUnconfirmed: boolean = false;
|
||||
@Input() buttonClass: string = '';
|
||||
|
||||
confirmations: number = 0;
|
||||
|
||||
ngOnChanges(): void {
|
||||
if (this.chainTip != null && this.height != null) {
|
||||
this.confirmations = Math.max(1, this.chainTip - this.height + 1);
|
||||
} else {
|
||||
this.confirmations = 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -85,6 +85,7 @@ import { SatsComponent } from './components/sats/sats.component';
|
||||
import { TruncateComponent } from './components/truncate/truncate.component';
|
||||
import { SearchResultsComponent } from '../components/search-form/search-results/search-results.component';
|
||||
import { TimestampComponent } from './components/timestamp/timestamp.component';
|
||||
import { ConfirmationsComponent } from './components/confirmations/confirmations.component';
|
||||
import { ToggleComponent } from './components/toggle/toggle.component';
|
||||
import { GeolocationComponent } from '../shared/components/geolocation/geolocation.component';
|
||||
import { TestnetAlertComponent } from './components/testnet-alert/testnet-alert.component';
|
||||
@@ -175,6 +176,7 @@ import { ClockMempoolComponent } from '../components/clock/clock-mempool.compone
|
||||
TruncateComponent,
|
||||
SearchResultsComponent,
|
||||
TimestampComponent,
|
||||
ConfirmationsComponent,
|
||||
ToggleComponent,
|
||||
GeolocationComponent,
|
||||
TestnetAlertComponent,
|
||||
@@ -289,6 +291,7 @@ import { ClockMempoolComponent } from '../components/clock/clock-mempool.compone
|
||||
TruncateComponent,
|
||||
SearchResultsComponent,
|
||||
TimestampComponent,
|
||||
ConfirmationsComponent,
|
||||
ToggleComponent,
|
||||
GeolocationComponent,
|
||||
PreviewTitleComponent,
|
||||
|
||||
Reference in New Issue
Block a user