Merge branch 'feature/swr-address-resolution' into develop

src/TokenTransferItem.tsx

@@ -10,13 +10,11 @@ import {
   TokenMeta,
   TokenTransfer,
 } from "./types";
-import { ResolvedAddresses } from "./api/address-resolver";
 import { Metadata } from "./sourcify/useSourcify";
 
 type TokenTransferItemProps = {
   t: TokenTransfer;
   tokenMeta?: TokenMeta | null | undefined;
-  resolvedAddresses: ResolvedAddresses | undefined;
   metadatas: Record<ChecksummedAddress, Metadata | null | undefined>;
 };
 
@@ -24,7 +22,6 @@ type TokenTransferItemProps = {
 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">
@@ -37,7 +34,6 @@ const TokenTransferItem: React.FC<TokenTransferItemProps> = ({
         <TransactionAddress
           address={t.from}
           addressCtx={AddressContext.FROM}
-          resolvedAddresses={resolvedAddresses}
           metadata={metadatas[t.from]}
         />
       </div>
@@ -46,7 +42,6 @@ const TokenTransferItem: React.FC<TokenTransferItemProps> = ({
         <TransactionAddress
           address={t.to}
           addressCtx={AddressContext.TO}
-          resolvedAddresses={resolvedAddresses}
           metadata={metadatas[t.to]}
         />
       </div>
@@ -60,11 +55,7 @@ const TokenTransferItem: React.FC<TokenTransferItemProps> = ({
             />
           </ValueHighlighter>
         </span>
-        <TransactionAddress
+        <TransactionAddress address={t.token} metadata={metadatas[t.token]} />
-          address={t.token}
-          resolvedAddresses={resolvedAddresses}
-          metadata={metadatas[t.token]}
-        />
       </div>
     </div>
   </div>

src/Transaction.tsx

@@ -11,10 +11,6 @@ import { useInternalOperations, useTxData } from "./useErigonHooks";
 import { useETHUSDOracle } from "./usePriceOracle";
 import { useAppConfigContext } from "./useAppConfig";
 import { useSourcify, useTransactionDescription } from "./sourcify/useSourcify";
-import {
-  transactionDataCollector,
-  useResolvedAddresses,
-} from "./useResolvedAddresses";
 import { SelectedTransactionContext } from "./useSelectedTransaction";
 
 const Details = React.lazy(
@@ -45,12 +41,6 @@ const Transaction: React.FC = () => {
   }
 
   const txData = useTxData(provider, txhash);
-  const addrCollector = useMemo(
-    () => transactionDataCollector(txData),
-    [txData]
-  );
-  const resolvedAddresses = useResolvedAddresses(provider, addrCollector);
-
   const internalOps = useInternalOperations(provider, txData);
   const sendsEthToMiner = useMemo(() => {
     if (!txData || !internalOps) {
@@ -119,29 +109,14 @@ const Transaction: React.FC = () => {
                       internalOps={internalOps}
                       sendsEthToMiner={sendsEthToMiner}
                       ethUSDPrice={blockETHUSDPrice}
-                      resolvedAddresses={resolvedAddresses}
                     />
                   }
                 />
                 <Route
                   path="logs"
-                  element={
+                  element={<Logs txData={txData} metadata={metadata} />}
-                    <Logs
-                      txData={txData}
-                      metadata={metadata}
-                      resolvedAddresses={resolvedAddresses}
-                    />
-                  }
-                />
-                <Route
-                  path="trace"
-                  element={
-                    <Trace
-                      txData={txData}
-                      resolvedAddresses={resolvedAddresses}
-                    />
-                  }
                 />
+                <Route path="trace" element={<Trace txData={txData} />} />
               </Routes>
             </React.Suspense>
           </SelectionContext.Provider>

src/address/AddressTransactionResults.tsx

@@ -10,7 +10,6 @@ import { useFeeToggler } from "../search/useFeeToggler";
 import { SelectionContext, useSelection } from "../useSelection";
 import { useMultipleETHUSDOracle } from "../usePriceOracle";
 import { RuntimeContext } from "../useRuntime";
-import { pageCollector, useResolvedAddresses } from "../useResolvedAddresses";
 import { useParams, useSearchParams } from "react-router-dom";
 import { ChecksummedAddress } from "../types";
 import { useContractsMetadata } from "../hooks";
@@ -102,10 +101,6 @@ const AddressTransactionResults: React.FC<AddressTransactionResultsProps> = ({
   }, [page]);
   const priceMap = useMultipleETHUSDOracle(provider, blockTags);
 
-  // Resolve all addresses that appear on this page results
-  const addrCollector = useMemo(() => pageCollector(page), [page]);
-  const resolvedAddresses = useResolvedAddresses(provider, addrCollector);
-
   // Calculate Sourcify metadata for all addresses that appear on this page results
   const addresses = useMemo(() => {
     const _addresses = [address];
@@ -152,7 +147,6 @@ const AddressTransactionResults: React.FC<AddressTransactionResultsProps> = ({
             <TransactionItem
               key={tx.hash}
               tx={tx}
-              resolvedAddresses={resolvedAddresses}
               selectedAddress={address}
               feeDisplay={feeDisplay}
               priceMap={priceMap}

src/api/address-resolver/index.ts

@@ -1,4 +1,3 @@
-import { BaseProvider } from "@ethersproject/providers";
 import { ensRenderer } from "../../components/ENSName";
 import { plainStringRenderer } from "../../components/PlainString";
 import { tokenRenderer } from "../../components/TokenName";
@@ -48,30 +47,3 @@ resolverRendererRegistry.set(uniswapV2Resolver, uniswapV2PairRenderer);
 resolverRendererRegistry.set(uniswapV3Resolver, uniswapV3PairRenderer);
 resolverRendererRegistry.set(ercTokenResolver, tokenRenderer);
 resolverRendererRegistry.set(hardcodedResolver, plainStringRenderer);
-
-// TODO: implement progressive resolving
-export const batchPopulate = async (
-  provider: BaseProvider,
-  addresses: string[],
-  currentMap: ResolvedAddresses | undefined
-): Promise<ResolvedAddresses> => {
-  const solvers: Promise<SelectedResolvedName<any> | undefined>[] = [];
-  const unresolvedAddresses = addresses.filter(
-    (a) => currentMap?.[a] === undefined
-  );
-  for (const a of unresolvedAddresses) {
-    solvers.push(mainResolver.resolveAddress(provider, a));
-  }
-
-  const resultMap: ResolvedAddresses = currentMap ? { ...currentMap } : {};
-  const results = await Promise.all(solvers);
-  for (let i = 0; i < results.length; i++) {
-    const r = results[i];
-    if (r === undefined) {
-      continue;
-    }
-    resultMap[unresolvedAddresses[i]] = r;
-  }
-
-  return resultMap;
-};

src/block/BlockTransactionResults.tsx

@@ -8,7 +8,6 @@ import TransactionItem from "../search/TransactionItem";
 import { useFeeToggler } from "../search/useFeeToggler";
 import { RuntimeContext } from "../useRuntime";
 import { SelectionContext, useSelection } from "../useSelection";
-import { pageCollector, useResolvedAddresses } from "../useResolvedAddresses";
 import { ChecksummedAddress, ProcessedTransaction } from "../types";
 import { PAGE_SIZE } from "../params";
 import { useMultipleETHUSDOracle } from "../usePriceOracle";
@@ -30,8 +29,6 @@ const BlockTransactionResults: React.FC<BlockTransactionResultsProps> = ({
   const { provider } = useContext(RuntimeContext);
   const selectionCtx = useSelection();
   const [feeDisplay, feeDisplayToggler] = useFeeToggler();
-  const addrCollector = useMemo(() => pageCollector(page), [page]);
-  const resolvedAddresses = useResolvedAddresses(provider, addrCollector);
   const blockTags = useMemo(() => [blockTag], [blockTag]);
   const priceMap = useMultipleETHUSDOracle(provider, blockTags);
 
@@ -79,7 +76,6 @@ const BlockTransactionResults: React.FC<BlockTransactionResultsProps> = ({
             <TransactionItem
               key={tx.hash}
               tx={tx}
-              resolvedAddresses={resolvedAddresses}
               feeDisplay={feeDisplay}
               priceMap={priceMap}
               metadatas={metadatas}

src/components/AddressOrENSName.tsx

@@ -1,24 +1,22 @@
-import React from "react";
+import React, { useContext } from "react";
-import {
+import { resolverRendererRegistry } from "../api/address-resolver";
-  ResolvedAddresses,
+import { useResolvedAddress } from "../useResolvedAddresses";
-  resolverRendererRegistry,
+import { RuntimeContext } from "../useRuntime";
-} from "../api/address-resolver";
 import PlainAddress from "./PlainAddress";
 
 type AddressOrENSNameProps = {
   address: string;
   selectedAddress?: string;
   dontOverrideColors?: boolean;
-  resolvedAddresses?: ResolvedAddresses | undefined;
 };
 
 const AddressOrENSName: React.FC<AddressOrENSNameProps> = ({
   address,
   selectedAddress,
   dontOverrideColors,
-  resolvedAddresses,
 }) => {
-  const resolvedAddress = resolvedAddresses?.[address];
+  const { provider } = useContext(RuntimeContext);
+  const resolvedAddress = useResolvedAddress(provider, address);
   const linkable = address !== selectedAddress;
 
   if (!resolvedAddress) {

src/components/DecoratedAddressLink.tsx

@@ -9,7 +9,6 @@ import { faCoins } from "@fortawesome/free-solid-svg-icons/faCoins";
 import AddressOrENSName from "./AddressOrENSName";
 import SourcifyLogo from "../sourcify/SourcifyLogo";
 import { AddressContext, ZERO_ADDRESS } from "../types";
-import { ResolvedAddresses } from "../api/address-resolver";
 import { Metadata } from "../sourcify/useSourcify";
 
 type DecoratedAddressLinkProps = {
@@ -21,7 +20,6 @@ type DecoratedAddressLinkProps = {
   selfDestruct?: boolean;
   txFrom?: boolean;
   txTo?: boolean;
-  resolvedAddresses?: ResolvedAddresses | undefined;
   metadata?: Metadata | null | undefined;
 };
 
@@ -34,7 +32,6 @@ const DecoratedAddressLink: React.FC<DecoratedAddressLinkProps> = ({
   selfDestruct,
   txFrom,
   txTo,
-  resolvedAddresses,
   metadata,
 }) => {
   const mint = addressCtx === AddressContext.FROM && address === ZERO_ADDRESS;
@@ -87,7 +84,6 @@ const DecoratedAddressLink: React.FC<DecoratedAddressLinkProps> = ({
         address={address}
         selectedAddress={selectedAddress}
         dontOverrideColors={mint || burn}
-        resolvedAddresses={resolvedAddresses}
       />
     </div>
   );

src/components/InternalCreate.tsx

@@ -5,17 +5,12 @@ import TransactionAddress from "./TransactionAddress";
 import AddressHighlighter from "./AddressHighlighter";
 import DecoratedAddressLink from "./DecoratedAddressLink";
 import { InternalOperation } from "../types";
-import { ResolvedAddresses } from "../api/address-resolver";
 
 type InternalCreateProps = {
   internalOp: InternalOperation;
-  resolvedAddresses: ResolvedAddresses | undefined;
 };
 
-const InternalCreate: React.FC<InternalCreateProps> = ({
+const InternalCreate: React.FC<InternalCreateProps> = ({ internalOp }) => (
-  internalOp,
-  resolvedAddresses,
-}) => (
   <div className="flex items-baseline space-x-1 whitespace-nowrap">
     <span className="text-gray-500">
       <FontAwesomeIcon icon={faAngleRight} size="1x" /> CREATE
@@ -23,20 +18,11 @@ const InternalCreate: React.FC<InternalCreateProps> = ({
     <span>Contract</span>
     <div className="flex items-baseline">
       <AddressHighlighter address={internalOp.to}>
-        <DecoratedAddressLink
+        <DecoratedAddressLink address={internalOp.to} creation />
-          address={internalOp.to}
-          creation
-          resolvedAddresses={resolvedAddresses}
-        />
       </AddressHighlighter>
     </div>
     <span className="flex items-baseline text-gray-400">
-      (Creator:{" "}
+      (Creator: <TransactionAddress address={internalOp.from} />)
-      <TransactionAddress
-        address={internalOp.from}
-        resolvedAddresses={resolvedAddresses}
-      />
-      )
     </span>
   </div>
 );

src/components/InternalSelfDestruct.tsx

@@ -5,19 +5,16 @@ 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";
 import TransactionAddress from "./TransactionAddress";
 
 type InternalSelfDestructProps = {
   txData: TransactionData;
   internalOp: InternalOperation;
-  resolvedAddresses: ResolvedAddresses | undefined;
 };
 
 const InternalSelfDestruct: React.FC<InternalSelfDestructProps> = ({
   txData,
   internalOp,
-  resolvedAddresses,
 }) => {
   const toMiner =
     txData.confirmedData?.miner !== undefined &&
@@ -32,21 +29,12 @@ const InternalSelfDestruct: React.FC<InternalSelfDestructProps> = ({
         <span>Contract</span>
         <div className="flex items-baseline">
           <AddressHighlighter address={internalOp.from}>
-            <DecoratedAddressLink
+            <DecoratedAddressLink address={internalOp.from} selfDestruct />
-              address={internalOp.from}
-              selfDestruct
-              resolvedAddresses={resolvedAddresses}
-            />
           </AddressHighlighter>
         </div>
         {internalOp.value.isZero() && (
           <div className="flex items-baseline text-gray-400">
-            (To:{" "}
+            (To: <TransactionAddress address={internalOp.to} />)
-            <TransactionAddress
-              address={internalOp.to}
-              resolvedAddresses={resolvedAddresses}
-            />
-            )
           </div>
         )}
       </div>
@@ -64,11 +52,7 @@ const InternalSelfDestruct: React.FC<InternalSelfDestructProps> = ({
                   toMiner ? "rounded px-2 py-1 bg-yellow-100" : ""
                 }`}
               >
-                <DecoratedAddressLink
+                <DecoratedAddressLink address={internalOp.to} miner={toMiner} />
-                  address={internalOp.to}
-                  miner={toMiner}
-                  resolvedAddresses={resolvedAddresses}
-                />
               </div>
             </AddressHighlighter>
           </div>

src/components/InternalTransactionOperation.tsx

@@ -3,37 +3,24 @@ import InternalTransfer from "./InternalTransfer";
 import InternalSelfDestruct from "./InternalSelfDestruct";
 import InternalCreate from "./InternalCreate";
 import { TransactionData, InternalOperation, OperationType } from "../types";
-import { ResolvedAddresses } from "../api/address-resolver";
 
 type InternalTransactionOperationProps = {
   txData: TransactionData;
   internalOp: InternalOperation;
-  resolvedAddresses: ResolvedAddresses | undefined;
 };
 
 const InternalTransactionOperation: React.FC<InternalTransactionOperationProps> =
-  ({ txData, internalOp, resolvedAddresses }) => (
+  ({ txData, internalOp }) => (
     <>
       {internalOp.type === OperationType.TRANSFER && (
-        <InternalTransfer
+        <InternalTransfer txData={txData} internalOp={internalOp} />
-          txData={txData}
-          internalOp={internalOp}
-          resolvedAddresses={resolvedAddresses}
-        />
       )}
       {internalOp.type === OperationType.SELF_DESTRUCT && (
-        <InternalSelfDestruct
+        <InternalSelfDestruct txData={txData} internalOp={internalOp} />
-          txData={txData}
-          internalOp={internalOp}
-          resolvedAddresses={resolvedAddresses}
-        />
       )}
       {(internalOp.type === OperationType.CREATE ||
         internalOp.type === OperationType.CREATE2) && (
-        <InternalCreate
+        <InternalCreate internalOp={internalOp} />
-          internalOp={internalOp}
-          resolvedAddresses={resolvedAddresses}
-        />
       )}
     </>
   );

src/components/InternalTransfer.tsx

@@ -5,18 +5,15 @@ 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 InternalTransferProps = {
   txData: TransactionData;
   internalOp: InternalOperation;
-  resolvedAddresses: ResolvedAddresses | undefined;
 };
 
 const InternalTransfer: React.FC<InternalTransferProps> = ({
   txData,
   internalOp,
-  resolvedAddresses,
 }) => {
   const fromMiner =
     txData.confirmedData?.miner !== undefined &&
@@ -44,7 +41,6 @@ const InternalTransfer: React.FC<InternalTransferProps> = ({
               miner={fromMiner}
               txFrom={internalOp.from === txData.from}
               txTo={internalOp.from === txData.to}
-              resolvedAddresses={resolvedAddresses}
             />
           </div>
         </AddressHighlighter>
@@ -62,7 +58,6 @@ const InternalTransfer: React.FC<InternalTransferProps> = ({
               miner={toMiner}
               txFrom={internalOp.to === txData.from}
               txTo={internalOp.to === txData.to}
-              resolvedAddresses={resolvedAddresses}
             />
           </div>
         </AddressHighlighter>

src/components/TransactionAddress.tsx

@@ -1,7 +1,6 @@
 import React from "react";
 import AddressHighlighter from "./AddressHighlighter";
 import DecoratedAddressLink from "./DecoratedAddressLink";
-import { ResolvedAddresses } from "../api/address-resolver";
 import { useSelectedTransaction } from "../useSelectedTransaction";
 import { AddressContext } from "../types";
 import { Metadata } from "../sourcify/useSourcify";
@@ -9,14 +8,12 @@ import { Metadata } from "../sourcify/useSourcify";
 type TransactionAddressProps = {
   address: string;
   addressCtx?: AddressContext | undefined;
-  resolvedAddresses: ResolvedAddresses | undefined;
   metadata?: Metadata | null | undefined;
 };
 
 const TransactionAddress: React.FC<TransactionAddressProps> = ({
   address,
   addressCtx,
-  resolvedAddresses,
   metadata,
 }) => {
   const txData = useSelectedTransaction();
@@ -32,7 +29,6 @@ const TransactionAddress: React.FC<TransactionAddressProps> = ({
         txFrom={address === txData?.from}
         txTo={address === txData?.to || creation}
         creation={creation}
-        resolvedAddresses={resolvedAddresses}
         metadata={metadata}
       />
     </AddressHighlighter>

src/search/TransactionItem.tsx

@@ -18,12 +18,10 @@ import { ChecksummedAddress, ProcessedTransaction } from "../types";
 import { FeeDisplay } from "./useFeeToggler";
 import { formatValue } from "../components/formatter";
 import ETH2USDValue from "../components/ETH2USDValue";
-import { ResolvedAddresses } from "../api/address-resolver";
 import { Metadata } from "../sourcify/useSourcify";
 
 type TransactionItemProps = {
   tx: ProcessedTransaction;
-  resolvedAddresses?: ResolvedAddresses;
   selectedAddress?: string;
   feeDisplay: FeeDisplay;
   priceMap: Record<BlockTag, BigNumber>;
@@ -32,7 +30,6 @@ type TransactionItemProps = {
 
 const TransactionItem: React.FC<TransactionItemProps> = ({
   tx,
-  resolvedAddresses,
   selectedAddress,
   feeDisplay,
   priceMap,
@@ -87,7 +84,6 @@ const TransactionItem: React.FC<TransactionItemProps> = ({
                 address={tx.from}
                 selectedAddress={selectedAddress}
                 miner={tx.miner === tx.from}
-                resolvedAddresses={resolvedAddresses}
               />
             </AddressHighlighter>
           )}
@@ -110,7 +106,6 @@ const TransactionItem: React.FC<TransactionItemProps> = ({
                 address={tx.to}
                 selectedAddress={selectedAddress}
                 miner={tx.miner === tx.to}
-                resolvedAddresses={resolvedAddresses}
                 metadata={metadatas[tx.to]}
               />
             </AddressHighlighter>
@@ -120,7 +115,6 @@ const TransactionItem: React.FC<TransactionItemProps> = ({
                 address={tx.createdContractAddress!}
                 selectedAddress={selectedAddress}
                 creation
-                resolvedAddresses={resolvedAddresses}
                 metadata={metadatas[tx.createdContractAddress!]}
               />
             </AddressHighlighter>

src/transaction/Details.tsx

@@ -42,7 +42,6 @@ import {
   useTransactionDescription,
 } from "../use4Bytes";
 import { DevDoc, Metadata, useError, UserDoc } from "../sourcify/useSourcify";
-import { ResolvedAddresses } from "../api/address-resolver";
 import { RuntimeContext } from "../useRuntime";
 import { useContractsMetadata } from "../hooks";
 import { useTransactionError } from "../useErigonHooks";
@@ -56,7 +55,6 @@ type DetailsProps = {
   internalOps?: InternalOperation[];
   sendsEthToMiner: boolean;
   ethUSDPrice: BigNumber | undefined;
-  resolvedAddresses: ResolvedAddresses | undefined;
 };
 
 const Details: React.FC<DetailsProps> = ({
@@ -68,7 +66,6 @@ const Details: React.FC<DetailsProps> = ({
   internalOps,
   sendsEthToMiner,
   ethUSDPrice,
-  resolvedAddresses,
 }) => {
   const hasEIP1559 =
     txData.confirmedData?.blockBaseFeePerGas !== undefined &&
@@ -200,7 +197,6 @@ const Details: React.FC<DetailsProps> = ({
                         hasParamNames
                         userMethod={userError}
                         devMethod={devError}
-                        resolvedAddresses={resolvedAddresses}
                       />
                     )}
                   </Tab.Panel>
@@ -252,10 +248,7 @@ const Details: React.FC<DetailsProps> = ({
       <InfoRow title="From / Nonce">
         <div className="flex divide-x-2 divide-dotted divide-gray-300">
           <div className="flex items-baseline space-x-2 -ml-1 mr-3">
-            <TransactionAddress
+            <TransactionAddress address={txData.from} />
-              address={txData.from}
-              resolvedAddresses={resolvedAddresses}
-            />
             <Copy value={txData.from} />
           </div>
           <div className="flex items-baseline pl-3">
@@ -268,7 +261,6 @@ const Details: React.FC<DetailsProps> = ({
           <div className="flex items-baseline space-x-2 -ml-1">
             <TransactionAddress
               address={txData.to}
-              resolvedAddresses={resolvedAddresses}
               metadata={metadatas?.[txData.to]}
             />
             <Copy value={txData.to} />
@@ -281,7 +273,6 @@ const Details: React.FC<DetailsProps> = ({
           <div className="flex items-baseline space-x-2 -ml-1">
             <TransactionAddress
               address={txData.confirmedData?.createdContractAddress!}
-              resolvedAddresses={resolvedAddresses}
               metadata={
                 metadatas?.[txData.confirmedData?.createdContractAddress!]
               }
@@ -296,7 +287,6 @@ const Details: React.FC<DetailsProps> = ({
                 key={i}
                 txData={txData}
                 internalOp={op}
-                resolvedAddresses={resolvedAddresses}
               />
             ))}
           </div>
@@ -314,7 +304,6 @@ const Details: React.FC<DetailsProps> = ({
               key={i}
               t={t}
               tokenMeta={txData.tokenMetas[t.token]}
-              resolvedAddresses={resolvedAddresses}
               metadatas={metadatas}
             />
           ))}
@@ -438,7 +427,6 @@ const Details: React.FC<DetailsProps> = ({
           data={txData.data}
           userMethod={userMethod}
           devMethod={devMethod}
-          resolvedAddresses={resolvedAddresses}
         />
       </InfoRow>
     </ContentFrame>

src/transaction/LogEntry.tsx

@@ -8,23 +8,16 @@ import ModeTab from "../components/ModeTab";
 import DecodedParamsTable from "./decoder/DecodedParamsTable";
 import DecodedLogSignature from "./decoder/DecodedLogSignature";
 import { useTopic0 } from "../useTopic0";
-import { ResolvedAddresses } from "../api/address-resolver";
 import { ChecksummedAddress } from "../types";
 import { Metadata } from "../sourcify/useSourcify";
 
 type LogEntryProps = {
   log: Log;
   logDesc: LogDescription | null | undefined;
-  resolvedAddresses: ResolvedAddresses | undefined;
   metadatas: Record<ChecksummedAddress, Metadata | null | undefined>;
 };
 
-const LogEntry: React.FC<LogEntryProps> = ({
+const LogEntry: React.FC<LogEntryProps> = ({ log, logDesc, metadatas }) => {
-  log,
-  logDesc,
-  resolvedAddresses,
-  metadatas,
-}) => {
   const rawTopic0 = log.topics[0];
   const topic0 = useTopic0(rawTopic0);
 
@@ -65,7 +58,6 @@ const LogEntry: React.FC<LogEntryProps> = ({
             <div className="flex items-baseline space-x-2 -ml-1 mr-3">
               <TransactionAddress
                 address={log.address}
-                resolvedAddresses={resolvedAddresses}
                 metadata={metadatas[log.address]}
               />
               <Copy value={log.address} />
@@ -109,7 +101,6 @@ const LogEntry: React.FC<LogEntryProps> = ({
                         args={resolvedLogDesc.args}
                         paramTypes={resolvedLogDesc.eventFragment.inputs}
                         hasParamNames={resolvedLogDesc === logDesc}
-                        resolvedAddresses={resolvedAddresses}
                       />
                     </div>
                   </div>

src/transaction/Logs.tsx

@@ -4,17 +4,15 @@ import ContentFrame from "../ContentFrame";
 import LogEntry from "./LogEntry";
 import { TransactionData } from "../types";
 import { Metadata } from "../sourcify/useSourcify";
-import { ResolvedAddresses } from "../api/address-resolver";
 import { RuntimeContext } from "../useRuntime";
 import { useContractsMetadata } from "../hooks";
 
 type LogsProps = {
   txData: TransactionData;
   metadata: Metadata | null | undefined;
-  resolvedAddresses: ResolvedAddresses | undefined;
 };
 
-const Logs: React.FC<LogsProps> = ({ txData, metadata, resolvedAddresses }) => {
+const Logs: React.FC<LogsProps> = ({ txData, metadata }) => {
   const baseMetadatas = useMemo((): Record<string, Metadata | null> => {
     if (!txData.to || metadata === undefined) {
       return {};
@@ -68,7 +66,6 @@ const Logs: React.FC<LogsProps> = ({ txData, metadata, resolvedAddresses }) => {
                   key={i}
                   log={l}
                   logDesc={logDescs?.[i]}
-                  resolvedAddresses={resolvedAddresses}
                   metadatas={metadatas}
                 />
               ))}

src/transaction/Trace.tsx

@@ -1,37 +1,18 @@
-import React, { useContext, useMemo } from "react";
+import React, { useContext } from "react";
 import ContentFrame from "../ContentFrame";
 import TransactionAddress from "../components/TransactionAddress";
 import TraceItem from "./TraceItem";
 import { TransactionData } from "../types";
-import { useBatch4Bytes } from "../use4Bytes";
+import { useTraceTransaction } from "../useErigonHooks";
-import { useTraceTransaction, useUniqueSignatures } from "../useErigonHooks";
 import { RuntimeContext } from "../useRuntime";
-import { ResolvedAddresses } from "../api/address-resolver";
-import { tracesCollector, useResolvedAddresses } from "../useResolvedAddresses";
 
 type TraceProps = {
   txData: TransactionData;
-  resolvedAddresses: ResolvedAddresses | undefined;
 };
 
-const Trace: React.FC<TraceProps> = ({ txData, resolvedAddresses }) => {
+const Trace: React.FC<TraceProps> = ({ txData }) => {
   const { provider } = useContext(RuntimeContext);
   const traces = useTraceTransaction(provider, txData.transactionHash);
-  const uniqueSignatures = useUniqueSignatures(traces);
-  const sigMap = useBatch4Bytes(uniqueSignatures);
-
-  const addrCollector = useMemo(() => tracesCollector(traces), [traces]);
-  const traceResolvedAddresses = useResolvedAddresses(provider, addrCollector);
-  const mergedResolvedAddresses = useMemo(() => {
-    const merge = {};
-    if (resolvedAddresses) {
-      Object.assign(merge, resolvedAddresses);
-    }
-    if (traceResolvedAddresses) {
-      Object.assign(merge, traceResolvedAddresses);
-    }
-    return merge;
-  }, [resolvedAddresses, traceResolvedAddresses]);
 
   return (
     <ContentFrame tabs>
@@ -39,20 +20,11 @@ const Trace: React.FC<TraceProps> = ({ txData, resolvedAddresses }) => {
         {traces ? (
           <>
             <div className="border hover:border-gray-500 rounded px-1 py-0.5">
-              <TransactionAddress
+              <TransactionAddress address={txData.from} />
-                address={txData.from}
-                resolvedAddresses={resolvedAddresses}
-              />
             </div>
             <div className="ml-5 space-y-3 self-stretch">
               {traces.map((t, i, a) => (
-                <TraceItem
+                <TraceItem key={i} t={t} last={i === a.length - 1} />
-                  key={i}
-                  t={t}
-                  last={i === a.length - 1}
-                  fourBytesMap={sigMap}
-                  resolvedAddresses={mergedResolvedAddresses}
-                />
               ))}
             </div>
           </>

src/transaction/TraceInput.tsx

@@ -7,26 +7,19 @@ import FunctionSignature from "./FunctionSignature";
 import InputDecoder from "./decoder/InputDecoder";
 import ExpanderSwitch from "../components/ExpanderSwitch";
 import { TraceEntry } from "../useErigonHooks";
-import { ResolvedAddresses } from "../api/address-resolver";
 import {
   extract4Bytes,
-  FourBytesEntry,
+  use4Bytes,
   useTransactionDescription,
 } from "../use4Bytes";
 
 type TraceInputProps = {
   t: TraceEntry;
-  fourBytesMap: Record<string, FourBytesEntry | null | undefined>;
-  resolvedAddresses: ResolvedAddresses | undefined;
 };
 
-const TraceInput: React.FC<TraceInputProps> = ({
+const TraceInput: React.FC<TraceInputProps> = ({ t }) => {
-  t,
-  fourBytesMap,
-  resolvedAddresses,
-}) => {
   const raw4Bytes = extract4Bytes(t.input);
-  const fourBytes = raw4Bytes !== null ? fourBytesMap[raw4Bytes] : null;
+  const fourBytes = use4Bytes(raw4Bytes);
   const sigText =
     raw4Bytes === null ? "<fallback>" : fourBytes?.name ?? raw4Bytes;
   const hasParams = t.input.length > 10;
@@ -54,10 +47,7 @@ const TraceInput: React.FC<TraceInputProps> = ({
         ) : (
           <>
             <span>
-              <TransactionAddress
+              <TransactionAddress address={t.to} />
-                address={t.to}
-                resolvedAddresses={resolvedAddresses}
-              />
             </span>
             {t.type !== "CREATE" && t.type !== "CREATE2" && (
               <>
@@ -93,7 +83,6 @@ const TraceInput: React.FC<TraceInputProps> = ({
               data={t.input}
               userMethod={undefined}
               devMethod={undefined}
-              resolvedAddresses={resolvedAddresses}
             />
           </div>
           <div>)</div>

src/transaction/TraceItem.tsx

@@ -3,24 +3,15 @@ import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { faPlusSquare } from "@fortawesome/free-regular-svg-icons/faPlusSquare";
 import { faMinusSquare } from "@fortawesome/free-regular-svg-icons/faMinusSquare";
 import { Switch } from "@headlessui/react";
-import { FourBytesEntry } from "../use4Bytes";
 import { TraceGroup } from "../useErigonHooks";
-import { ResolvedAddresses } from "../api/address-resolver";
 import TraceInput from "./TraceInput";
 
 type TraceItemProps = {
   t: TraceGroup;
   last: boolean;
-  fourBytesMap: Record<string, FourBytesEntry | null | undefined>;
-  resolvedAddresses: ResolvedAddresses | undefined;
 };
 
-const TraceItem: React.FC<TraceItemProps> = ({
+const TraceItem: React.FC<TraceItemProps> = ({ t, last }) => {
-  t,
-  last,
-  fourBytesMap,
-  resolvedAddresses,
-}) => {
   const [expanded, setExpanded] = useState<boolean>(true);
 
   return (
@@ -42,11 +33,7 @@ const TraceItem: React.FC<TraceItemProps> = ({
             />
           </Switch>
         )}
-        <TraceInput
+        <TraceInput t={t} />
-          t={t}
-          fourBytesMap={fourBytesMap}
-          resolvedAddresses={resolvedAddresses}
-        />
       </div>
       {t.children && (
         <div
@@ -54,11 +41,7 @@ const TraceItem: React.FC<TraceItemProps> = ({
             expanded ? "" : "hidden"
           }`}
         >
-          <TraceChildren
+          <TraceChildren c={t.children} />
-            c={t.children}
-            fourBytesMap={fourBytesMap}
-            resolvedAddresses={resolvedAddresses}
-          />
         </div>
       )}
     </>
@@ -67,26 +50,16 @@ const TraceItem: React.FC<TraceItemProps> = ({
 
 type TraceChildrenProps = {
   c: TraceGroup[];
-  fourBytesMap: Record<string, FourBytesEntry | null | undefined>;
-  resolvedAddresses: ResolvedAddresses | undefined;
 };
 
-const TraceChildren: React.FC<TraceChildrenProps> = React.memo(
+const TraceChildren: React.FC<TraceChildrenProps> = React.memo(({ c }) => {
-  ({ c, fourBytesMap, resolvedAddresses }) => {
+  return (
-    return (
+    <>
-      <>
+      {c.map((tc, i, a) => (
-        {c.map((tc, i, a) => (
+        <TraceItem key={i} t={tc} last={i === a.length - 1} />
-          <TraceItem
+      ))}
-            key={i}
+    </>
-            t={tc}
+  );
-            last={i === a.length - 1}
+});
-            fourBytesMap={fourBytesMap}
-            resolvedAddresses={resolvedAddresses}
-          />
-        ))}
-      </>
-    );
-  }
-);
 
 export default TraceItem;

src/transaction/decoder/AddressDecoder.tsx

@@ -1,19 +1,14 @@
 import React from "react";
 import TransactionAddress from "../../components/TransactionAddress";
 import Copy from "../../components/Copy";
-import { ResolvedAddresses } from "../../api/address-resolver";
 
 type AddressDecoderProps = {
   r: string;
-  resolvedAddresses?: ResolvedAddresses | undefined;
 };
 
-const AddressDecoder: React.FC<AddressDecoderProps> = ({
+const AddressDecoder: React.FC<AddressDecoderProps> = ({ r }) => (
-  r,
-  resolvedAddresses,
-}) => (
   <div className="flex items-baseline space-x-2 -ml-1 mr-3">
-    <TransactionAddress address={r} resolvedAddresses={resolvedAddresses} />
+    <TransactionAddress address={r} />
     <Copy value={r} />
   </div>
 );

src/transaction/decoder/DecodedParamRow.tsx

@@ -8,7 +8,6 @@ import Uint256Decoder from "./Uint256Decoder";
 import AddressDecoder from "./AddressDecoder";
 import BooleanDecoder from "./BooleanDecoder";
 import BytesDecoder from "./BytesDecoder";
-import { ResolvedAddresses } from "../../api/address-resolver";
 import SelectionHighlighter, {
   valueSelector,
 } from "../../components/SelectionHighlighter";
@@ -20,7 +19,6 @@ type DecodedParamRowProps = {
   paramType: ParamType;
   arrayElem?: number | undefined;
   help?: string | undefined;
-  resolvedAddresses: ResolvedAddresses | undefined;
 };
 
 const DecodedParamRow: React.FC<DecodedParamRowProps> = ({
@@ -30,7 +28,6 @@ const DecodedParamRow: React.FC<DecodedParamRowProps> = ({
   paramType,
   arrayElem,
   help,
-  resolvedAddresses,
 }) => {
   const [showHelp, setShowHelp] = useState<boolean>(false);
 
@@ -80,10 +77,7 @@ const DecodedParamRow: React.FC<DecodedParamRowProps> = ({
             {paramType.baseType === "uint256" ? (
               <Uint256Decoder r={r} />
             ) : paramType.baseType === "address" ? (
-              <AddressDecoder
+              <AddressDecoder r={r.toString()} />
-                r={r.toString()}
-                resolvedAddresses={resolvedAddresses}
-              />
             ) : paramType.baseType === "bool" ? (
               <BooleanDecoder r={r} />
             ) : paramType.baseType === "bytes" ? (
@@ -111,7 +105,6 @@ const DecodedParamRow: React.FC<DecodedParamRowProps> = ({
             i={idx}
             r={e}
             paramType={paramType.components[idx]}
-            resolvedAddresses={resolvedAddresses}
           />
         ))}
       {paramType.baseType === "array" &&
@@ -122,7 +115,6 @@ const DecodedParamRow: React.FC<DecodedParamRowProps> = ({
             r={e}
             paramType={paramType.arrayChildren}
             arrayElem={idx}
-            resolvedAddresses={resolvedAddresses}
           />
         ))}
     </>

src/transaction/decoder/DecodedParamsTable.tsx

@@ -2,7 +2,6 @@ import React from "react";
 import { ParamType, Result } from "@ethersproject/abi";
 import DecodedParamRow from "./DecodedParamRow";
 import { DevMethod, UserMethod } from "../../sourcify/useSourcify";
-import { ResolvedAddresses } from "../../api/address-resolver";
 
 type DecodedParamsTableProps = {
   args: Result;
@@ -10,7 +9,6 @@ type DecodedParamsTableProps = {
   hasParamNames?: boolean;
   userMethod?: UserMethod | undefined;
   devMethod?: DevMethod | undefined;
-  resolvedAddresses?: ResolvedAddresses | undefined;
 };
 
 const DecodedParamsTable: React.FC<DecodedParamsTableProps> = ({
@@ -18,7 +16,6 @@ const DecodedParamsTable: React.FC<DecodedParamsTableProps> = ({
   paramTypes,
   hasParamNames = true,
   devMethod,
-  resolvedAddresses,
 }) => (
   <table className="border w-full">
     <thead>
@@ -47,7 +44,6 @@ const DecodedParamsTable: React.FC<DecodedParamsTableProps> = ({
           r={r}
           paramType={paramTypes[i]}
           help={devMethod?.params?.[paramTypes[i].name]}
-          resolvedAddresses={resolvedAddresses}
         />
       ))}
     </tbody>

src/transaction/decoder/InputDecoder.tsx

@@ -5,7 +5,6 @@ import { Tab } from "@headlessui/react";
 import ModeTab from "../../components/ModeTab";
 import DecodedParamsTable from "./DecodedParamsTable";
 import { DevMethod, UserMethod } from "../../sourcify/useSourcify";
-import { ResolvedAddresses } from "../../api/address-resolver";
 
 type InputDecoderProps = {
   fourBytes: string;
@@ -14,7 +13,6 @@ type InputDecoderProps = {
   data: string;
   userMethod: UserMethod | undefined;
   devMethod: DevMethod | undefined;
-  resolvedAddresses: ResolvedAddresses | undefined;
 };
 
 const InputDecoder: React.FC<InputDecoderProps> = ({
@@ -24,7 +22,6 @@ const InputDecoder: React.FC<InputDecoderProps> = ({
   data,
   userMethod,
   devMethod,
-  resolvedAddresses,
 }) => {
   const utfInput = useMemo(() => {
     try {
@@ -57,7 +54,6 @@ const InputDecoder: React.FC<InputDecoderProps> = ({
               hasParamNames={hasParamNames}
               userMethod={userMethod}
               devMethod={devMethod}
-              resolvedAddresses={resolvedAddresses}
             />
           )}
         </Tab.Panel>

src/use4Bytes.ts

@@ -1,11 +1,11 @@
-import { useState, useEffect, useContext, useMemo } from "react";
+import { useContext, useMemo } from "react";
 import {
   Fragment,
   Interface,
   TransactionDescription,
 } from "@ethersproject/abi";
 import { BigNumberish } from "@ethersproject/bignumber";
-import useSWR from "swr";
+import useSWRImmutable from "swr/immutable";
 import { RuntimeContext } from "./useRuntime";
 import { fourBytesURL } from "./url";
 
@@ -14,8 +14,6 @@ export type FourBytesEntry = {
   signature: string | undefined;
 };
 
-export type FourBytesMap = Record<string, FourBytesEntry | null | undefined>;
-
 /**
  * Given a hex input data; extract the method selector
  *
@@ -61,38 +59,6 @@ const fetch4Bytes = async (
   }
 };
 
-// TODO: migrate to swr and merge with use4Bytes
-export const useBatch4Bytes = (
-  rawFourByteSigs: string[] | undefined
-): FourBytesMap => {
-  const runtime = useContext(RuntimeContext);
-  const assetsURLPrefix = runtime.config?.assetsURLPrefix;
-
-  const [fourBytesMap, setFourBytesMap] = useState<FourBytesMap>({});
-  useEffect(() => {
-    if (!rawFourByteSigs || assetsURLPrefix === undefined) {
-      setFourBytesMap({});
-      return;
-    }
-
-    const loadSigs = async () => {
-      const promises = rawFourByteSigs.map((s) =>
-        fetch4Bytes(assetsURLPrefix, s.slice(2))
-      );
-      const results = await Promise.all(promises);
-
-      const _fourBytesMap: Record<string, FourBytesEntry | null> = {};
-      for (let i = 0; i < rawFourByteSigs.length; i++) {
-        _fourBytesMap[rawFourByteSigs[i]] = results[i];
-      }
-      setFourBytesMap(_fourBytesMap);
-    };
-    loadSigs();
-  }, [assetsURLPrefix, rawFourByteSigs]);
-
-  return fourBytesMap;
-};
-
 /**
  * Extract 4bytes DB info
  *
@@ -111,10 +77,6 @@ export const use4Bytes = (
   const assetsURLPrefix = config?.assetsURLPrefix;
 
   const fourBytesFetcher = (key: string | null) => {
-    // TODO: throw error?
-    if (assetsURLPrefix === undefined) {
-      return undefined;
-    }
     if (key === null || key === "0x") {
       return undefined;
     }
@@ -126,17 +88,14 @@ export const use4Bytes = (
       return undefined;
     }
 
-    return fetch4Bytes(assetsURLPrefix, key.slice(2));
+    return fetch4Bytes(assetsURLPrefix!, key.slice(2));
   };
 
-  const { data, error } = useSWR<FourBytesEntry | null | undefined>(
+  const { data, error } = useSWRImmutable<FourBytesEntry | null | undefined>(
-    rawFourBytes,
+    assetsURLPrefix !== undefined ? rawFourBytes : null,
     fourBytesFetcher
   );
-  if (error) {
+  return error ? undefined : data;
-    return undefined;
-  }
-  return data;
 };
 
 export const useMethodSelector = (data: string): [boolean, string, string] => {

src/useErigonHooks.ts

@@ -1,4 +1,4 @@
-import { useState, useEffect, useMemo } from "react";
+import { useState, useEffect } from "react";
 import { Block, BlockWithTransactions } from "@ethersproject/abstract-provider";
 import { JsonRpcProvider } from "@ethersproject/providers";
 import { getAddress } from "@ethersproject/address";
@@ -6,7 +6,6 @@ import { Contract } from "@ethersproject/contracts";
 import { defaultAbiCoder } from "@ethersproject/abi";
 import { BigNumber } from "@ethersproject/bignumber";
 import { arrayify, hexDataSlice, isHexString } from "@ethersproject/bytes";
-import { extract4Bytes } from "./use4Bytes";
 import { getInternalOperations } from "./nodeFunctions";
 import {
   TokenMetas,
@@ -408,46 +407,6 @@ export const useTraceTransaction = (
   return traceGroups;
 };
 
-/**
- * Flatten a trace tree and extract and dedup 4byte function signatures
- */
-export const useUniqueSignatures = (traces: TraceGroup[] | undefined) => {
-  const uniqueSignatures = useMemo(() => {
-    if (!traces) {
-      return undefined;
-    }
-
-    const sigs = new Set<string>();
-    let nextTraces: TraceGroup[] = [...traces];
-    while (nextTraces.length > 0) {
-      const traces = nextTraces;
-      nextTraces = [];
-
-      for (const t of traces) {
-        if (
-          t.type === "CALL" ||
-          t.type === "DELEGATECALL" ||
-          t.type === "STATICCALL" ||
-          t.type === "CALLCODE"
-        ) {
-          const fourBytes = extract4Bytes(t.input);
-          if (fourBytes) {
-            sigs.add(fourBytes);
-          }
-        }
-
-        if (t.children) {
-          nextTraces.push(...t.children);
-        }
-      }
-    }
-
-    return [...sigs];
-  }, [traces]);
-
-  return uniqueSignatures;
-};
-
 const hasCode = async (
   provider: JsonRpcProvider,
   address: ChecksummedAddress

src/useResolvedAddresses.ts

@@ -1,14 +1,11 @@
-import { useState, useEffect, useRef, useContext } from "react";
+import { useState, useEffect, useContext } from "react";
-import { JsonRpcProvider } from "@ethersproject/providers";
+import { BaseProvider } from "@ethersproject/providers";
 import { getAddress, isAddress } from "@ethersproject/address";
-import { batchPopulate, ResolvedAddresses } from "./api/address-resolver";
+import useSWRImmutable from "swr/immutable";
-import { TraceGroup } from "./useErigonHooks";
+import { mainResolver } from "./api/address-resolver";
+import { SelectedResolvedName } from "./api/address-resolver/CompositeAddressResolver";
 import { RuntimeContext } from "./useRuntime";
-import {
+import { ChecksummedAddress } from "./types";
-  ChecksummedAddress,
-  ProcessedTransaction,
-  TransactionData,
-} from "./types";
 
 export const useAddressOrENSFromURL = (
   addressOrName: string,
@@ -69,118 +66,22 @@ export const useAddressOrENSFromURL = (
   return [checksummedAddress, isENS, error];
 };
 
-export type AddressCollector = () => string[];
+export const useResolvedAddress = (
-
+  provider: BaseProvider | undefined,
-export const pageCollector =
+  address: ChecksummedAddress
-  (page: ProcessedTransaction[] | undefined): AddressCollector =>
+): SelectedResolvedName<any> | undefined => {
-  () => {
+  const fetcher = async (
-    if (!page) {
+    key: string
-      return [];
+  ): Promise<SelectedResolvedName<any> | undefined> => {
+    if (!provider) {
+      return undefined;
     }
-
+    return mainResolver.resolveAddress(provider, address);
-    const uniqueAddresses = new Set<string>();
-    for (const tx of page) {
-      if (tx.from) {
-        uniqueAddresses.add(tx.from);
-      }
-      if (tx.to) {
-        uniqueAddresses.add(tx.to);
-      }
-      if (tx.createdContractAddress) {
-        uniqueAddresses.add(tx.createdContractAddress);
-      }
-    }
-
-    return Array.from(uniqueAddresses);
   };
 
-export const transactionDataCollector =
+  const { data, error } = useSWRImmutable(address, fetcher);
-  (txData: TransactionData | null | undefined): AddressCollector =>
+  if (error) {
-  () => {
+    return undefined;
-    if (!txData) {
+  }
-      return [];
+  return data;
-    }
-
-    const uniqueAddresses = new Set<string>();
-
-    // Standard fields
-    uniqueAddresses.add(txData.from);
-    if (txData.to) {
-      uniqueAddresses.add(txData.to);
-    }
-    if (txData.confirmedData?.createdContractAddress) {
-      uniqueAddresses.add(txData.confirmedData?.createdContractAddress);
-    }
-
-    // Dig token transfers
-    for (const t of txData.tokenTransfers) {
-      uniqueAddresses.add(t.from);
-      uniqueAddresses.add(t.to);
-      uniqueAddresses.add(t.token);
-    }
-
-    // Dig log addresses
-    if (txData.confirmedData) {
-      for (const l of txData.confirmedData.logs) {
-        uniqueAddresses.add(l.address);
-        // TODO: find a way to dig over decoded address log attributes
-      }
-    }
-
-    return Array.from(uniqueAddresses);
-  };
-
-export const tracesCollector =
-  (traces: TraceGroup[] | undefined): AddressCollector =>
-  () => {
-    if (traces === undefined) {
-      return [];
-    }
-
-    const uniqueAddresses = new Set<string>();
-    let searchTraces = [...traces];
-    while (searchTraces.length > 0) {
-      const nextSearch: TraceGroup[] = [];
-
-      for (const g of searchTraces) {
-        uniqueAddresses.add(g.from);
-        uniqueAddresses.add(g.to);
-        if (g.children) {
-          nextSearch.push(...g.children);
-        }
-      }
-
-      searchTraces = nextSearch;
-    }
-    return Array.from(uniqueAddresses);
-  };
-
-export const useResolvedAddresses = (
-  provider: JsonRpcProvider | undefined,
-  addrCollector: AddressCollector
-) => {
-  const [names, setNames] = useState<ResolvedAddresses>();
-  const ref = useRef<ResolvedAddresses | undefined>();
-  useEffect(() => {
-    ref.current = names;
-  });
-
-  useEffect(
-    () => {
-      if (!provider) {
-        return;
-      }
-
-      const populate = async () => {
-        const _addresses = addrCollector();
-        const _names = await batchPopulate(provider, _addresses, ref.current);
-        setNames(_names);
-      };
-      populate();
-    },
-    // DON'T put names variables in dependency array; this is intentional; useRef
-    [provider, addrCollector]
-  );
-
-  return names;
 };