Merge pull request #2378 from dusk-network/feature-2347

explorer: add `txType` to transactions
dusk-network · Sep 12, 2024 · 499a6b5 · 499a6b5
2 parents 81be86e + 33dd24b
commit 499a6b5
Show file tree

Hide file tree

Showing 31 changed files with 3,180 additions and 1,453 deletions.
diff --git a/explorer/CHANGELOG.md b/explorer/CHANGELOG.md
@@ -28,6 +28,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - Implement warning for stale market data [#1892]
 - Add tooltip to current and pending stake showing the exact amount [#2363]
 - Add `memo` and `isDeploy` fields in transactions [#2362]
+- Add `txType` fields in transactions and display it [#2347]
 
 ### Changed
 
@@ -65,6 +66,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 [#2348]: https://github.com/dusk-network/rusk/issues/2348
 [#2362]: https://github.com/dusk-network/rusk/issues/2362
 [#2363]: https://github.com/dusk-network/rusk/issues/2363
+[#2363]: https://github.com/dusk-network/rusk/issues/2347
 
 <!-- VERSIONS -->
 

diff --git a/explorer/src/lib/chain-info/__tests__/transformBlock.spec.js b/explorer/src/lib/chain-info/__tests__/transformBlock.spec.js
@@ -38,6 +38,7 @@ describe("transformBlock", () => {
           success: true,
           txerror: "",
           txid: "3a3f6f90a1012ae751b4448bcb8e98def0ba2b18170239bd69fcf8e2e37f0602",
+          txtype: "Moonlight",
         },
         {
           blockhash:
@@ -53,6 +54,7 @@ describe("transformBlock", () => {
           success: true,
           txerror: "",
           txid: "07bfabea1d94c16f2dc3697fa642f6cecea6e81bf76b9644efbb6e2723b76d00",
+          txtype: "Phoenix",
         },
       ],
       stats: { averageGasPrice: 1, gasLimit: 5000000000, gasUsed: 580718 },

diff --git a/explorer/src/lib/chain-info/__tests__/transformTransaction.spec.js b/explorer/src/lib/chain-info/__tests__/transformTransaction.spec.js
@@ -20,6 +20,7 @@ describe("transformTransaction", () => {
     success: true,
     txerror: "",
     txid: "4877687c2dbf154248d3ddee9ba0d81e3431f39056f82a46819da041d4ac0e04",
+    txtype: "Moonlight",
   };
 
   it("should transform a transaction received from the GraphQL API into the format used by the Explorer", () => {

diff --git a/explorer/src/lib/chain-info/chain-info.d.ts b/explorer/src/lib/chain-info/chain-info.d.ts
@@ -47,4 +47,5 @@ type Transaction = {
   success: boolean;
   txerror: string;
   txid: string;
+  txtype: string;
 };
diff --git a/explorer/src/lib/chain-info/transformTransaction.js b/explorer/src/lib/chain-info/transformTransaction.js
@@ -14,6 +14,7 @@ const transformTransaction = (tx) => ({
   success: tx.err === null,
   txerror: tx.err ?? "",
   txid: tx.id,
+  txtype: tx.tx.txType,
 });
 
 export default transformTransaction;
diff --git a/explorer/src/lib/components/__tests__/__snapshots__/TransactionDetails.spec.js.snap b/explorer/src/lib/components/__tests__/__snapshots__/TransactionDetails.spec.js.snap
@@ -166,11 +166,31 @@ exports[`Transaction Details > renders the Transaction Details component 1`] = `
       <dd
         class="details-list__definition"
       >
-        <span
-          class="dusk-badge dusk-badge--variant-neutral transaction-details__type explorer-badge"
+        <div
+          class="transaction-type"
         >
-          transfer
-        </span>
+          <svg
+            class="dusk-icon dusk-icon--size--large"
+            data-tooltip-id="main-tooltip"
+            data-tooltip-place="top"
+            data-tooltip-text="Moonlight"
+            data-tooltip-type="info"
+            role="graphics-symbol"
+            viewBox="0 0 24 24"
+          >
+            <path
+              d="M12,1L3,5V11C3,16.55 6.84,21.74 12,23C17.16,21.74 21,16.55 21,11V5L12,1M12,7C13.4,7 14.8,8.1 14.8,9.5V11C15.4,11 16,11.6 16,12.3V15.8C16,16.4 15.4,17 14.7,17H9.2C8.6,17 8,16.4 8,15.7V12.2C8,11.6 8.6,11 9.2,11V9.5C9.2,8.1 10.6,7 12,7M12,8.2C11.2,8.2 10.5,8.7 10.5,9.5V11H13.5V9.5C13.5,8.7 12.8,8.2 12,8.2Z"
+            />
+          </svg>
+          
+           
+          <span
+            class="dusk-badge dusk-badge--variant-neutral"
+          >
+            transfer
+          </span>
+        </div>
+         
       </dd>
       <dt
         class="details-list__term"
@@ -519,11 +539,31 @@ exports[`Transaction Details > renders the Transaction Details component with th
       <dd
         class="details-list__definition"
       >
-        <span
-          class="dusk-badge dusk-badge--variant-neutral transaction-details__type explorer-badge"
+        <div
+          class="transaction-type"
         >
-          transfer
-        </span>
+          <svg
+            class="dusk-icon dusk-icon--size--large"
+            data-tooltip-id="main-tooltip"
+            data-tooltip-place="top"
+            data-tooltip-text="Moonlight"
+            data-tooltip-type="info"
+            role="graphics-symbol"
+            viewBox="0 0 24 24"
+          >
+            <path
+              d="M12,1L3,5V11C3,16.55 6.84,21.74 12,23C17.16,21.74 21,16.55 21,11V5L12,1M12,7C13.4,7 14.8,8.1 14.8,9.5V11C15.4,11 16,11.6 16,12.3V15.8C16,16.4 15.4,17 14.7,17H9.2C8.6,17 8,16.4 8,15.7V12.2C8,11.6 8.6,11 9.2,11V9.5C9.2,8.1 10.6,7 12,7M12,8.2C11.2,8.2 10.5,8.7 10.5,9.5V11H13.5V9.5C13.5,8.7 12.8,8.2 12,8.2Z"
+            />
+          </svg>
+          
+           
+          <span
+            class="dusk-badge dusk-badge--variant-neutral"
+          >
+            transfer
+          </span>
+        </div>
+         
       </dd>
       <dt
         class="details-list__term"