diff --git a/frontend/src/app/components/transactions-list/transactions-list.component.html b/frontend/src/app/components/transactions-list/transactions-list.component.html
index 96f792f82..80bec2d28 100644
--- a/frontend/src/app/components/transactions-list/transactions-list.component.html
+++ b/frontend/src/app/components/transactions-list/transactions-list.component.html
@@ -20,7 +20,7 @@
- inputRowLimit) ? tx.vin.slice(0, inputRowLimit - 2) : tx.vin.slice(0, inputRowLimit)) : tx.vin" [ngForTrackBy]="trackByIndexFn">
+
- inputRowLimit && tx['@vinLimit']">
+
getVinLimit(tx)">
-
+
|
@@ -158,7 +158,7 @@
- outputRowLimit) ? tx.vout.slice(0, outputRowLimit - 2) : tx.vout.slice(0, outputRowLimit)) : tx.vout" [ngForTrackBy]="trackByIndexFn">
+
- outputRowLimit && tx['@voutLimit']">
+
getVoutLimit(tx)">
-
+
|
diff --git a/frontend/src/app/components/transactions-list/transactions-list.component.ts b/frontend/src/app/components/transactions-list/transactions-list.component.ts
index 9f1245532..e81a79c71 100644
--- a/frontend/src/app/components/transactions-list/transactions-list.component.ts
+++ b/frontend/src/app/components/transactions-list/transactions-list.component.ts
@@ -18,6 +18,7 @@ import { ApiService } from '../../services/api.service';
export class TransactionsListComponent implements OnInit, OnChanges {
network = '';
nativeAssetId = this.stateService.network === 'liquidtestnet' ? environment.nativeTestAssetId : environment.nativeAssetId;
+ showMoreIncrement = 40;
@Input() transactions: Transaction[];
@Input() showConfirmations = false;
@@ -218,6 +219,22 @@ export class TransactionsListComponent implements OnInit, OnChanges {
});
}
+ showMoreInputs(tx: Transaction): void {
+ tx['@vinLimit'] = this.getVinLimit(tx, true);
+ }
+
+ showMoreOutputs(tx: Transaction): void {
+ tx['@voutLimit'] = this.getVoutLimit(tx, true);
+ }
+
+ getVinLimit(tx: Transaction, next = false): number {
+ return Math.min(Math.max(tx['@vinLimit'] || 0, this.inputRowLimit) + (next ? this.showMoreIncrement : 0), tx.vin.length);
+ }
+
+ getVoutLimit(tx: Transaction, next = false): number {
+ return Math.min(Math.max(tx['@voutLimit'] || 0, this.outputRowLimit) + (next ? this.showMoreIncrement : 0), tx.vout.length);
+ }
+
ngOnDestroy(): void {
this.outspendsSubscription.unsubscribe();
}