diff --git a/packages/app/mock/transactions/Execute.json b/packages/app/mock/transactions/Execute.json
index ade6fbb50d..32b78b14b5 100644
--- a/packages/app/mock/transactions/Execute.json
+++ b/packages/app/mock/transactions/Execute.json
@@ -165,5 +165,11 @@
],
"isL1BatchSealed": false,
"to": "0x4732C03B2CF6eDe46500e799DE79a15Df44929eB",
- "value": "0x00"
+ "value": "0x00",
+ "gasPrice": "4000",
+ "gasLimit": "5000",
+ "gasUsed": "3000",
+ "gasPerPubdata": "800",
+ "maxFeePerGas": "7000",
+ "maxPriorityFeePerGas": "8000"
}
diff --git a/packages/app/src/components/transactions/infoTable/GeneralInfo.vue b/packages/app/src/components/transactions/infoTable/GeneralInfo.vue
index 9141e4769f..eafef5b7ba 100644
--- a/packages/app/src/components/transactions/infoTable/GeneralInfo.vue
+++ b/packages/app/src/components/transactions/infoTable/GeneralInfo.vue
@@ -166,7 +166,48 @@
-
+
+
+ {{ t("transactions.table.gasLimitAndUsed") }}
+ {{
+ t("transactions.table.gasLimitAndUsedTooltip")
+ }}
+
+ {{ transaction?.gasLimit }} | {{ transaction?.gasUsed }} ({{ gasUsedPercent }}%)
+
+
+
+ {{ t("transactions.table.gasPerPubdata") }}
+ {{
+ t("transactions.table.gasPerPubdataTooltip")
+ }}
+
+ {{ transaction.gasPerPubdata }}
+
+
+
+ {{ t("transactions.table.maxFeePerGas") }}
+
+ {{ t("transactions.table.maxFeePerGasTooltip") }}
+
+
+
+
+
+
+
+
+ {{ t("transactions.table.maxPriorityFeePerGas") }}
+
+ {{ t("transactions.table.maxPriorityFeePerGasTooltip") }}
+
+
+
+
+
+
{{ t("transactions.table.nonce") }}
@@ -242,6 +283,15 @@ const tokenTransfers = computed(() => {
// exclude transfers with no amount, such as NFT until we fully support them
return props.transaction?.transfers.filter((transfer) => transfer.amount) || [];
});
+
+const gasUsedPercent = computed(() => {
+ if (props.transaction) {
+ const gasLimit = parseInt(props.transaction.gasLimit, 10);
+ const gasUsed = parseInt(props.transaction.gasUsed, 10);
+ return parseFloat(((gasUsed / gasLimit) * 100).toFixed(2));
+ }
+ return null;
+});