From 8e29326ff560f4b4424255a0acb910e5472caf81 Mon Sep 17 00:00:00 2001
From: Willian Mitsuda <wmitsuda@gmail.com>
Date: Thu, 11 Nov 2021 15:37:40 -0300
Subject: [PATCH 1/6] Remove unused attribute

---
 src/TokenTransferItem.tsx   | 9 +--------
 src/transaction/Details.tsx | 1 -
 2 files changed, 1 insertion(+), 9 deletions(-)

diff --git a/src/TokenTransferItem.tsx b/src/TokenTransferItem.tsx
index d28a538..eb3e0b2 100644
--- a/src/TokenTransferItem.tsx
+++ b/src/TokenTransferItem.tsx
@@ -4,17 +4,11 @@ import { faCaretRight } from "@fortawesome/free-solid-svg-icons/faCaretRight";
 import TransactionAddress from "./components/TransactionAddress";
 import ValueHighlighter from "./components/ValueHighlighter";
 import FormattedBalance from "./components/FormattedBalance";
-import {
-  AddressContext,
-  TokenMeta,
-  TokenTransfer,
-  TransactionData,
-} from "./types";
+import { AddressContext, TokenMeta, TokenTransfer } from "./types";
 import { ResolvedAddresses } from "./api/address-resolver";
 
 type TokenTransferItemProps = {
   t: TokenTransfer;
-  txData: TransactionData;
   tokenMeta?: TokenMeta | undefined;
   resolvedAddresses: ResolvedAddresses | undefined;
 };
@@ -22,7 +16,6 @@ type TokenTransferItemProps = {
 // TODO: handle partial
 const TokenTransferItem: React.FC<TokenTransferItemProps> = ({
   t,
-  txData,
   tokenMeta,
   resolvedAddresses,
 }) => (
diff --git a/src/transaction/Details.tsx b/src/transaction/Details.tsx
index 37226f7..2c87e79 100644
--- a/src/transaction/Details.tsx
+++ b/src/transaction/Details.tsx
@@ -225,7 +225,6 @@ const Details: React.FC<DetailsProps> = ({
               <TokenTransferItem
                 key={i}
                 t={t}
-                txData={txData}
                 tokenMeta={txData.tokenMetas[t.token]}
                 resolvedAddresses={resolvedAddresses}
               />

From 36b5437643091e7d2dbd0c76779490da799762b1 Mon Sep 17 00:00:00 2001
From: Willian Mitsuda <wmitsuda@gmail.com>
Date: Thu, 11 Nov 2021 15:51:03 -0300
Subject: [PATCH 2/6] Fix missing Sourcify decoration on token transfers

---
 src/TokenTransferItem.tsx   | 13 ++++++++++++-
 src/transaction/Details.tsx |  6 ++++++
 2 files changed, 18 insertions(+), 1 deletion(-)

diff --git a/src/TokenTransferItem.tsx b/src/TokenTransferItem.tsx
index eb3e0b2..5b9fc72 100644
--- a/src/TokenTransferItem.tsx
+++ b/src/TokenTransferItem.tsx
@@ -4,13 +4,20 @@ import { faCaretRight } from "@fortawesome/free-solid-svg-icons/faCaretRight";
 import TransactionAddress from "./components/TransactionAddress";
 import ValueHighlighter from "./components/ValueHighlighter";
 import FormattedBalance from "./components/FormattedBalance";
-import { AddressContext, TokenMeta, TokenTransfer } from "./types";
+import {
+  AddressContext,
+  ChecksummedAddress,
+  TokenMeta,
+  TokenTransfer,
+} from "./types";
 import { ResolvedAddresses } from "./api/address-resolver";
+import { Metadata } from "./useSourcify";
 
 type TokenTransferItemProps = {
   t: TokenTransfer;
   tokenMeta?: TokenMeta | undefined;
   resolvedAddresses: ResolvedAddresses | undefined;
+  metadatas: Record<ChecksummedAddress, Metadata | null | undefined>;
 };
 
 // TODO: handle partial
@@ -18,6 +25,7 @@ const TokenTransferItem: React.FC<TokenTransferItemProps> = ({
   t,
   tokenMeta,
   resolvedAddresses,
+  metadatas,
 }) => (
   <div className="flex items-baseline space-x-2 px-2 py-1 truncate hover:bg-gray-100">
     <span className="text-gray-500">
@@ -30,6 +38,7 @@ const TokenTransferItem: React.FC<TokenTransferItemProps> = ({
           address={t.from}
           addressCtx={AddressContext.FROM}
           resolvedAddresses={resolvedAddresses}
+          metadata={metadatas[t.from]}
         />
       </div>
       <div className="flex space-x-1">
@@ -38,6 +47,7 @@ const TokenTransferItem: React.FC<TokenTransferItemProps> = ({
           address={t.to}
           addressCtx={AddressContext.TO}
           resolvedAddresses={resolvedAddresses}
+          metadata={metadatas[t.to]}
         />
       </div>
       <div className="col-span-3 flex space-x-1">
@@ -53,6 +63,7 @@ const TokenTransferItem: React.FC<TokenTransferItemProps> = ({
         <TransactionAddress
           address={t.token}
           resolvedAddresses={resolvedAddresses}
+          metadata={metadatas[t.token]}
         />
       </div>
     </div>
diff --git a/src/transaction/Details.tsx b/src/transaction/Details.tsx
index 2c87e79..afa2628 100644
--- a/src/transaction/Details.tsx
+++ b/src/transaction/Details.tsx
@@ -95,6 +95,11 @@ const Details: React.FC<DetailsProps> = ({
     if (txData.confirmedData?.createdContractAddress) {
       _addresses.push(txData.confirmedData.createdContractAddress);
     }
+    for (const t of txData.tokenTransfers) {
+      _addresses.push(t.from);
+      _addresses.push(t.to);
+      _addresses.push(t.token);
+    }
     return _addresses;
   }, [txData]);
   const { sourcifySource } = useAppConfigContext();
@@ -227,6 +232,7 @@ const Details: React.FC<DetailsProps> = ({
                 t={t}
                 tokenMeta={txData.tokenMetas[t.token]}
                 resolvedAddresses={resolvedAddresses}
+                metadatas={metadatas}
               />
             ))}
           </div>

From 5b203bc8d40d11876f1b82f9cc8eb1509990fce9 Mon Sep 17 00:00:00 2001
From: Willian Mitsuda <wmitsuda@gmail.com>
Date: Thu, 11 Nov 2021 16:14:04 -0300
Subject: [PATCH 3/6] Remove unnecessary nested spans

---
 src/transaction/Details.tsx | 66 +++++++++++++++----------------------
 1 file changed, 27 insertions(+), 39 deletions(-)

diff --git a/src/transaction/Details.tsx b/src/transaction/Details.tsx
index afa2628..1fc10bd 100644
--- a/src/transaction/Details.tsx
+++ b/src/transaction/Details.tsx
@@ -225,17 +225,15 @@ const Details: React.FC<DetailsProps> = ({
       )}
       {txData.tokenTransfers.length > 0 && (
         <InfoRow title={`Tokens Transferred (${txData.tokenTransfers.length})`}>
-          <div>
-            {txData.tokenTransfers.map((t, i) => (
-              <TokenTransferItem
-                key={i}
-                t={t}
-                tokenMeta={txData.tokenMetas[t.token]}
-                resolvedAddresses={resolvedAddresses}
-                metadatas={metadatas}
-              />
-            ))}
-          </div>
+          {txData.tokenTransfers.map((t, i) => (
+            <TokenTransferItem
+              key={i}
+              t={t}
+              tokenMeta={txData.tokenMetas[t.token]}
+              resolvedAddresses={resolvedAddresses}
+              metadatas={metadatas}
+            />
+          ))}
         </InfoRow>
       )}
       <InfoRow title="Value">
@@ -262,24 +260,16 @@ const Details: React.FC<DetailsProps> = ({
       {txData.type === 2 && (
         <>
           <InfoRow title="Max Priority Fee Per Gas">
-            <span>
-              <FormattedBalance value={txData.maxPriorityFeePerGas!} /> Ether (
-              <FormattedBalance
-                value={txData.maxPriorityFeePerGas!}
-                decimals={9}
-              />{" "}
-              Gwei)
-            </span>
+            <FormattedBalance value={txData.maxPriorityFeePerGas!} /> Ether (
+            <FormattedBalance
+              value={txData.maxPriorityFeePerGas!}
+              decimals={9}
+            />{" "}
+            Gwei)
           </InfoRow>
           <InfoRow title="Max Fee Per Gas">
-            <span>
-              <FormattedBalance value={txData.maxFeePerGas!} /> Ether (
-              <FormattedBalance
-                value={txData.maxFeePerGas!}
-                decimals={9}
-              />{" "}
-              Gwei)
-            </span>
+            <FormattedBalance value={txData.maxFeePerGas!} /> Ether (
+            <FormattedBalance value={txData.maxFeePerGas!} decimals={9} /> Gwei)
           </InfoRow>
         </>
       )}
@@ -321,18 +311,16 @@ const Details: React.FC<DetailsProps> = ({
       )}
       {txData.confirmedData && hasEIP1559 && (
         <InfoRow title="Block Base Fee">
-          <span>
-            <FormattedBalance
-              value={txData.confirmedData.blockBaseFeePerGas!}
-              decimals={9}
-            />{" "}
-            Gwei (
-            <FormattedBalance
-              value={txData.confirmedData.blockBaseFeePerGas!}
-              decimals={0}
-            />{" "}
-            wei)
-          </span>
+          <FormattedBalance
+            value={txData.confirmedData.blockBaseFeePerGas!}
+            decimals={9}
+          />{" "}
+          Gwei (
+          <FormattedBalance
+            value={txData.confirmedData.blockBaseFeePerGas!}
+            decimals={0}
+          />{" "}
+          wei)
         </InfoRow>
       )}
       {txData.confirmedData && (

From c9f7f46ebc3dd43a001486e6670fee3df5cbf1bd Mon Sep 17 00:00:00 2001
From: Willian Mitsuda <wmitsuda@gmail.com>
Date: Thu, 18 Nov 2021 15:46:09 -0300
Subject: [PATCH 4/6] Add generic resolvers support to internal ops

---
 src/components/InternalCreate.tsx             | 12 +++++-
 src/components/InternalSelfDestruct.tsx       | 40 ++++++++++++-------
 .../InternalTransactionOperation.tsx          | 12 +++++-
 src/components/InternalTransfer.tsx           |  4 +-
 src/transaction/Details.tsx                   |  2 +-
 5 files changed, 50 insertions(+), 20 deletions(-)

diff --git a/src/components/InternalCreate.tsx b/src/components/InternalCreate.tsx
index 7a723ce..dcf050f 100644
--- a/src/components/InternalCreate.tsx
+++ b/src/components/InternalCreate.tsx
@@ -4,26 +4,33 @@ import { faAngleRight } from "@fortawesome/free-solid-svg-icons/faAngleRight";
 import AddressHighlighter from "./AddressHighlighter";
 import DecoratedAddressLink from "./DecoratedAddressLink";
 import { TransactionData, InternalOperation } from "../types";
+import { ResolvedAddresses } from "../api/address-resolver";
 
 type InternalCreateProps = {
   txData: TransactionData;
   internalOp: InternalOperation;
+  resolvedAddresses: ResolvedAddresses | undefined;
 };
 
 const InternalCreate: React.FC<InternalCreateProps> = ({
   txData,
   internalOp,
+  resolvedAddresses,
 }) => {
   return (
     <>
-      <div className="flex items-baseline space-x-1 text-xs">
+      <div className="flex items-baseline space-x-1 whitespace-nowrap">
         <span className="text-gray-500">
           <FontAwesomeIcon icon={faAngleRight} size="1x" /> CREATE
         </span>
         <span>Contract</span>
         <div className="flex items-baseline">
           <AddressHighlighter address={internalOp.to}>
-            <DecoratedAddressLink address={internalOp.to} creation />
+            <DecoratedAddressLink
+              address={internalOp.to}
+              creation
+              resolvedAddresses={resolvedAddresses}
+            />
           </AddressHighlighter>
         </div>
         <span className="flex items-baseline text-gray-400">
@@ -33,6 +40,7 @@ const InternalCreate: React.FC<InternalCreateProps> = ({
               address={internalOp.from}
               txFrom={internalOp.from === txData.from}
               txTo={internalOp.from === txData.to}
+              resolvedAddresses={resolvedAddresses}
             />
           </AddressHighlighter>
           )
diff --git a/src/components/InternalSelfDestruct.tsx b/src/components/InternalSelfDestruct.tsx
index 007fb32..be71afd 100644
--- a/src/components/InternalSelfDestruct.tsx
+++ b/src/components/InternalSelfDestruct.tsx
@@ -1,11 +1,12 @@
-import React, { useContext } from "react";
+import React from "react";
 import { formatEther } from "@ethersproject/units";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { faAngleRight } from "@fortawesome/free-solid-svg-icons/faAngleRight";
 import AddressHighlighter from "./AddressHighlighter";
 import DecoratedAddressLink from "./DecoratedAddressLink";
-import { RuntimeContext } from "../useRuntime";
 import { TransactionData, InternalOperation } from "../types";
+import { ResolvedAddresses } from "../api/address-resolver";
+import TransactionAddress from "./TransactionAddress";
 
 const CHI_ADDRESS = "0x0000000000004946c0e9F43F4Dee607b0eF1fA1c";
 const GST2_ADDRESS = "0x0000000000b3F879cb30FE243b4Dfee438691c04";
@@ -13,40 +14,47 @@ const GST2_ADDRESS = "0x0000000000b3F879cb30FE243b4Dfee438691c04";
 type InternalSelfDestructProps = {
   txData: TransactionData;
   internalOp: InternalOperation;
+  resolvedAddresses: ResolvedAddresses | undefined;
 };
 
 const InternalSelfDestruct: React.FC<InternalSelfDestructProps> = ({
   txData,
   internalOp,
+  resolvedAddresses,
 }) => {
-  const { provider } = useContext(RuntimeContext);
-  const network = provider?.network;
-
   const toMiner =
     txData.confirmedData?.miner !== undefined &&
     internalOp.to === txData.confirmedData.miner;
 
   return (
     <>
-      <div className="flex items-baseline space-x-1 text-xs">
+      <div className="flex items-baseline space-x-1 whitespace-nowrap">
         <span className="text-gray-500">
           <FontAwesomeIcon icon={faAngleRight} size="1x" /> SELF DESTRUCT
         </span>
         <span>Contract</span>
         <div className="flex items-baseline">
           <AddressHighlighter address={internalOp.from}>
-            <DecoratedAddressLink address={internalOp.from} selfDestruct />
+            <DecoratedAddressLink
+              address={internalOp.from}
+              selfDestruct
+              resolvedAddresses={resolvedAddresses}
+            />
           </AddressHighlighter>
         </div>
-        {network?.chainId === 1 && internalOp.to === CHI_ADDRESS && (
-          <span className="text-gray-400">(Chi Gastoken)</span>
-        )}
-        {network?.chainId === 1 && internalOp.to === GST2_ADDRESS && (
-          <span className="text-gray-400">(GST2 Gastoken)</span>
+        {internalOp.value.isZero() && (
+          <div className="flex items-baseline text-gray-400">
+            (To:{" "}
+            <TransactionAddress
+              address={internalOp.to}
+              resolvedAddresses={resolvedAddresses}
+            />
+            )
+          </div>
         )}
       </div>
       {!internalOp.value.isZero() && (
-        <div className="ml-5 flex items-baseline space-x-1 text-xs">
+        <div className="ml-5 flex items-baseline space-x-1">
           <span className="text-gray-500">
             <FontAwesomeIcon icon={faAngleRight} size="1x" /> TRANSFER
           </span>
@@ -59,7 +67,11 @@ const InternalSelfDestruct: React.FC<InternalSelfDestructProps> = ({
                   toMiner ? "rounded px-2 py-1 bg-yellow-100" : ""
                 }`}
               >
-                <DecoratedAddressLink address={internalOp.to} miner={toMiner} />
+                <DecoratedAddressLink
+                  address={internalOp.to}
+                  miner={toMiner}
+                  resolvedAddresses={resolvedAddresses}
+                />
               </div>
             </AddressHighlighter>
           </div>
diff --git a/src/components/InternalTransactionOperation.tsx b/src/components/InternalTransactionOperation.tsx
index 7de3bb2..f35319d 100644
--- a/src/components/InternalTransactionOperation.tsx
+++ b/src/components/InternalTransactionOperation.tsx
@@ -22,11 +22,19 @@ const InternalTransactionOperation: React.FC<InternalTransactionOperationProps>
         />
       )}
       {internalOp.type === OperationType.SELF_DESTRUCT && (
-        <InternalSelfDestruct txData={txData} internalOp={internalOp} />
+        <InternalSelfDestruct
+          txData={txData}
+          internalOp={internalOp}
+          resolvedAddresses={resolvedAddresses}
+        />
       )}
       {(internalOp.type === OperationType.CREATE ||
         internalOp.type === OperationType.CREATE2) && (
-        <InternalCreate txData={txData} internalOp={internalOp} />
+        <InternalCreate
+          txData={txData}
+          internalOp={internalOp}
+          resolvedAddresses={resolvedAddresses}
+        />
       )}
     </>
   );
diff --git a/src/components/InternalTransfer.tsx b/src/components/InternalTransfer.tsx
index 2958452..1dce1db 100644
--- a/src/components/InternalTransfer.tsx
+++ b/src/components/InternalTransfer.tsx
@@ -26,7 +26,7 @@ const InternalTransfer: React.FC<InternalTransferProps> = ({
     internalOp.to === txData.confirmedData.miner;
 
   return (
-    <div className="flex items-baseline space-x-1 text-xs">
+    <div className="flex items-baseline space-x-1 whitespace-nowrap">
       <span className="text-gray-500">
         <FontAwesomeIcon icon={faAngleRight} size="1x" /> TRANSFER
       </span>
@@ -44,6 +44,7 @@ const InternalTransfer: React.FC<InternalTransferProps> = ({
               miner={fromMiner}
               txFrom={internalOp.from === txData.from}
               txTo={internalOp.from === txData.to}
+              resolvedAddresses={resolvedAddresses}
             />
           </div>
         </AddressHighlighter>
@@ -61,6 +62,7 @@ const InternalTransfer: React.FC<InternalTransferProps> = ({
               miner={toMiner}
               txFrom={internalOp.to === txData.from}
               txTo={internalOp.to === txData.to}
+              resolvedAddresses={resolvedAddresses}
             />
           </div>
         </AddressHighlighter>
diff --git a/src/transaction/Details.tsx b/src/transaction/Details.tsx
index 1fc10bd..0b474af 100644
--- a/src/transaction/Details.tsx
+++ b/src/transaction/Details.tsx
@@ -206,7 +206,7 @@ const Details: React.FC<DetailsProps> = ({
           </div>
         )}
         {internalOps && internalOps.length > 0 && (
-          <div className="mt-2 space-y-1">
+          <div className="mt-2 space-y-1 overflow-x-auto">
             {internalOps.map((op, i) => (
               <InternalTransactionOperation
                 key={i}

From 454f785878176e2324062c0c73db5a3f68d5b73f Mon Sep 17 00:00:00 2001
From: Willian Mitsuda <wmitsuda@gmail.com>
Date: Thu, 18 Nov 2021 15:51:08 -0300
Subject: [PATCH 5/6] Remove unnecessary code

---
 src/components/InternalCreate.tsx       | 64 ++++++++++++-------------
 src/components/InternalSelfDestruct.tsx |  5 +-
 src/components/InternalTransfer.tsx     |  2 +-
 3 files changed, 32 insertions(+), 39 deletions(-)

diff --git a/src/components/InternalCreate.tsx b/src/components/InternalCreate.tsx
index dcf050f..5a6a543 100644
--- a/src/components/InternalCreate.tsx
+++ b/src/components/InternalCreate.tsx
@@ -16,38 +16,34 @@ const InternalCreate: React.FC<InternalCreateProps> = ({
   txData,
   internalOp,
   resolvedAddresses,
-}) => {
-  return (
-    <>
-      <div className="flex items-baseline space-x-1 whitespace-nowrap">
-        <span className="text-gray-500">
-          <FontAwesomeIcon icon={faAngleRight} size="1x" /> CREATE
-        </span>
-        <span>Contract</span>
-        <div className="flex items-baseline">
-          <AddressHighlighter address={internalOp.to}>
-            <DecoratedAddressLink
-              address={internalOp.to}
-              creation
-              resolvedAddresses={resolvedAddresses}
-            />
-          </AddressHighlighter>
-        </div>
-        <span className="flex items-baseline text-gray-400">
-          (Creator:{" "}
-          <AddressHighlighter address={internalOp.from}>
-            <DecoratedAddressLink
-              address={internalOp.from}
-              txFrom={internalOp.from === txData.from}
-              txTo={internalOp.from === txData.to}
-              resolvedAddresses={resolvedAddresses}
-            />
-          </AddressHighlighter>
-          )
-        </span>
-      </div>
-    </>
-  );
-};
+}) => (
+  <div className="flex items-baseline space-x-1 whitespace-nowrap">
+    <span className="text-gray-500">
+      <FontAwesomeIcon icon={faAngleRight} size="1x" /> CREATE
+    </span>
+    <span>Contract</span>
+    <div className="flex items-baseline">
+      <AddressHighlighter address={internalOp.to}>
+        <DecoratedAddressLink
+          address={internalOp.to}
+          creation
+          resolvedAddresses={resolvedAddresses}
+        />
+      </AddressHighlighter>
+    </div>
+    <span className="flex items-baseline text-gray-400">
+      (Creator:{" "}
+      <AddressHighlighter address={internalOp.from}>
+        <DecoratedAddressLink
+          address={internalOp.from}
+          txFrom={internalOp.from === txData.from}
+          txTo={internalOp.from === txData.to}
+          resolvedAddresses={resolvedAddresses}
+        />
+      </AddressHighlighter>
+      )
+    </span>
+  </div>
+);
 
-export default React.memo(InternalCreate);
+export default InternalCreate;
diff --git a/src/components/InternalSelfDestruct.tsx b/src/components/InternalSelfDestruct.tsx
index be71afd..794b987 100644
--- a/src/components/InternalSelfDestruct.tsx
+++ b/src/components/InternalSelfDestruct.tsx
@@ -8,9 +8,6 @@ import { TransactionData, InternalOperation } from "../types";
 import { ResolvedAddresses } from "../api/address-resolver";
 import TransactionAddress from "./TransactionAddress";
 
-const CHI_ADDRESS = "0x0000000000004946c0e9F43F4Dee607b0eF1fA1c";
-const GST2_ADDRESS = "0x0000000000b3F879cb30FE243b4Dfee438691c04";
-
 type InternalSelfDestructProps = {
   txData: TransactionData;
   internalOp: InternalOperation;
@@ -81,4 +78,4 @@ const InternalSelfDestruct: React.FC<InternalSelfDestructProps> = ({
   );
 };
 
-export default React.memo(InternalSelfDestruct);
+export default InternalSelfDestruct;
diff --git a/src/components/InternalTransfer.tsx b/src/components/InternalTransfer.tsx
index 1dce1db..bf46778 100644
--- a/src/components/InternalTransfer.tsx
+++ b/src/components/InternalTransfer.tsx
@@ -71,4 +71,4 @@ const InternalTransfer: React.FC<InternalTransferProps> = ({
   );
 };
 
-export default React.memo(InternalTransfer);
+export default InternalTransfer;

From 2e586789a45d93be5e8615e9a491e012a744ae09 Mon Sep 17 00:00:00 2001
From: Willian Mitsuda <wmitsuda@gmail.com>
Date: Thu, 18 Nov 2021 16:01:11 -0300
Subject: [PATCH 6/6] Replace by TransactionAddress component

---
 src/components/InternalCreate.tsx               | 17 ++++++-----------
 src/components/InternalTransactionOperation.tsx |  1 -
 2 files changed, 6 insertions(+), 12 deletions(-)

diff --git a/src/components/InternalCreate.tsx b/src/components/InternalCreate.tsx
index 5a6a543..e086e9d 100644
--- a/src/components/InternalCreate.tsx
+++ b/src/components/InternalCreate.tsx
@@ -1,19 +1,18 @@
 import React from "react";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { faAngleRight } from "@fortawesome/free-solid-svg-icons/faAngleRight";
+import TransactionAddress from "./TransactionAddress";
 import AddressHighlighter from "./AddressHighlighter";
 import DecoratedAddressLink from "./DecoratedAddressLink";
-import { TransactionData, InternalOperation } from "../types";
+import { InternalOperation } from "../types";
 import { ResolvedAddresses } from "../api/address-resolver";
 
 type InternalCreateProps = {
-  txData: TransactionData;
   internalOp: InternalOperation;
   resolvedAddresses: ResolvedAddresses | undefined;
 };
 
 const InternalCreate: React.FC<InternalCreateProps> = ({
-  txData,
   internalOp,
   resolvedAddresses,
 }) => (
@@ -33,14 +32,10 @@ const InternalCreate: React.FC<InternalCreateProps> = ({
     </div>
     <span className="flex items-baseline text-gray-400">
       (Creator:{" "}
-      <AddressHighlighter address={internalOp.from}>
-        <DecoratedAddressLink
-          address={internalOp.from}
-          txFrom={internalOp.from === txData.from}
-          txTo={internalOp.from === txData.to}
-          resolvedAddresses={resolvedAddresses}
-        />
-      </AddressHighlighter>
+      <TransactionAddress
+        address={internalOp.from}
+        resolvedAddresses={resolvedAddresses}
+      />
       )
     </span>
   </div>
diff --git a/src/components/InternalTransactionOperation.tsx b/src/components/InternalTransactionOperation.tsx
index f35319d..f167eb5 100644
--- a/src/components/InternalTransactionOperation.tsx
+++ b/src/components/InternalTransactionOperation.tsx
@@ -31,7 +31,6 @@ const InternalTransactionOperation: React.FC<InternalTransactionOperationProps>
       {(internalOp.type === OperationType.CREATE ||
         internalOp.type === OperationType.CREATE2) && (
         <InternalCreate
-          txData={txData}
           internalOp={internalOp}
           resolvedAddresses={resolvedAddresses}
         />