Migrate remaining token decoration support to the new resolver framework

src/TokenTransferItem.tsx

@@ -11,11 +11,13 @@ import {
   TokenTransfer,
   TransactionData,
 } from "./types";
+import { ResolvedAddresses } from "./api/address-resolver";
 
 type TokenTransferItemProps = {
   t: TokenTransfer;
   txData: TransactionData;
   tokenMeta?: TokenMeta | undefined;
+  resolvedAddresses: ResolvedAddresses | undefined;
 };
 
 // TODO: handle partial
@@ -23,6 +25,7 @@ const TokenTransferItem: React.FC<TokenTransferItemProps> = ({
   t,
   txData,
   tokenMeta,
+  resolvedAddresses,
 }) => (
   <div className="flex items-baseline space-x-2 px-2 py-1 truncate hover:bg-gray-100">
     <span className="text-gray-500">
@@ -64,10 +67,7 @@ const TokenTransferItem: React.FC<TokenTransferItemProps> = ({
         <AddressHighlighter address={t.token}>
           <DecoratedAddressLink
             address={t.token}
-            text={
+            resolvedAddresses={resolvedAddresses}
-              tokenMeta ? `${tokenMeta.name} (${tokenMeta.symbol})` : undefined
-            }
-            tokenMeta={tokenMeta}
           />
         </AddressHighlighter>
       </div>

src/components/AddressOrENSName.tsx

@@ -8,7 +8,6 @@ import PlainAddress from "./PlainAddress";
 type AddressOrENSNameProps = {
   address: string;
   selectedAddress?: string;
-  text?: string;
   dontOverrideColors?: boolean;
   resolvedAddresses?: ResolvedAddresses | undefined;
 };
@@ -16,7 +15,6 @@ type AddressOrENSNameProps = {
 const AddressOrENSName: React.FC<AddressOrENSNameProps> = ({
   address,
   selectedAddress,
-  text,
   dontOverrideColors,
   resolvedAddresses,
 }) => {
@@ -27,7 +25,6 @@ const AddressOrENSName: React.FC<AddressOrENSNameProps> = ({
     return (
       <PlainAddress
         address={address}
-        text={text}
         linkable={linkable}
         dontOverrideColors={dontOverrideColors}
       />
@@ -40,7 +37,6 @@ const AddressOrENSName: React.FC<AddressOrENSNameProps> = ({
     return (
       <PlainAddress
         address={address}
-        text={text}
         linkable={linkable}
         dontOverrideColors={dontOverrideColors}
       />

src/components/DecoratedAddressLink.tsx

@@ -5,36 +5,31 @@ import { faBomb } from "@fortawesome/free-solid-svg-icons/faBomb";
 import { faMoneyBillAlt } from "@fortawesome/free-solid-svg-icons/faMoneyBillAlt";
 import { faBurn } from "@fortawesome/free-solid-svg-icons/faBurn";
 import { faCoins } from "@fortawesome/free-solid-svg-icons/faCoins";
-import TokenLogo from "./TokenLogo";
 import AddressOrENSName from "./AddressOrENSName";
-import { AddressContext, TokenMeta, ZERO_ADDRESS } from "../types";
+import { AddressContext, ZERO_ADDRESS } from "../types";
 import { ResolvedAddresses } from "../api/address-resolver";
 
 type DecoratedAddressLinkProps = {
   address: string;
   selectedAddress?: string;
-  text?: string;
   addressCtx?: AddressContext;
   creation?: boolean;
   miner?: boolean;
   selfDestruct?: boolean;
   txFrom?: boolean;
   txTo?: boolean;
-  tokenMeta?: TokenMeta;
   resolvedAddresses?: ResolvedAddresses | undefined;
 };
 
 const DecoratedAddressLink: React.FC<DecoratedAddressLinkProps> = ({
   address,
   selectedAddress,
-  text,
   addressCtx,
   creation,
   miner,
   selfDestruct,
   txFrom,
   txTo,
-  tokenMeta,
   resolvedAddresses,
 }) => {
   const mint = addressCtx === AddressContext.FROM && address === ZERO_ADDRESS;
@@ -75,15 +70,9 @@ const DecoratedAddressLink: React.FC<DecoratedAddressLinkProps> = ({
           <FontAwesomeIcon icon={faCoins} size="1x" />
         </span>
       )}
-      {tokenMeta && (
-        <div className="self-center">
-          <TokenLogo address={address} name={tokenMeta.name} />
-        </div>
-      )}
       <AddressOrENSName
         address={address}
         selectedAddress={selectedAddress}
-        text={text}
         dontOverrideColors={mint || burn}
         resolvedAddresses={resolvedAddresses}
       />

src/components/PlainAddress.tsx

@@ -3,14 +3,12 @@ import { NavLink } from "react-router-dom";
 
 type PlainAddressProps = {
   address: string;
-  text: string | undefined;
   linkable: boolean;
   dontOverrideColors: boolean | undefined;
 };
 
 const PlainAddress: React.FC<PlainAddressProps> = ({
   address,
-  text,
   linkable,
   dontOverrideColors,
 }) => {
@@ -21,9 +19,9 @@ const PlainAddress: React.FC<PlainAddressProps> = ({
           dontOverrideColors ? "" : "text-link-blue hover:text-link-blue-hover"
         } font-address truncate`}
         to={`/address/${address}`}
-        title={text ?? address}
+        title={address}
       >
-        <>{text ?? address}</>
+        {address}
       </NavLink>
     );
   }

src/transaction/Details.tsx

@@ -225,6 +225,7 @@ const Details: React.FC<DetailsProps> = ({
                 t={t}
                 txData={txData}
                 tokenMeta={txData.tokenMetas[t.token]}
+                resolvedAddresses={resolvedAddresses}
               />
             ))}
           </div>