diff --git a/src/AddressTransactions.tsx b/src/AddressTransactions.tsx index 53f92bf..3bbd6df 100644 --- a/src/AddressTransactions.tsx +++ b/src/AddressTransactions.tsx @@ -165,7 +165,7 @@ const AddressTransactions: React.FC = () => { }, [provider, checksummedAddress, params.direction, hash, controller]); const page = useMemo(() => controller?.getPage(), [controller]); - const reverseCache = useENSCache(provider, page); + const resolvedAddresses = useENSCache(provider, page); const blockTags: BlockTag[] = useMemo(() => { if (!page) { @@ -283,7 +283,7 @@ const AddressTransactions: React.FC = () => { = ({ const selectionCtx = useSelection(); const [feeDisplay, feeDisplayToggler] = useFeeToggler(); const { provider } = useContext(RuntimeContext); - const reverseCache = useENSCache(provider, page); + const resolvedAddresses = useENSCache(provider, page); const blockTags = useMemo(() => [blockTag], [blockTag]); const priceMap = useMultipleETHUSDOracle(provider, blockTags); @@ -59,7 +59,7 @@ const BlockTransactionResults: React.FC = ({ diff --git a/src/components/AddressOrENSName.tsx b/src/components/AddressOrENSName.tsx index 9cb2f9e..43d40e1 100644 --- a/src/components/AddressOrENSName.tsx +++ b/src/components/AddressOrENSName.tsx @@ -3,49 +3,53 @@ import Address from "./Address"; import AddressLink from "./AddressLink"; import ENSName from "./ENSName"; import ENSNameLink from "./ENSNameLink"; +import { ResolvedAddresses } from "../api/address-resolver"; type AddressOrENSNameProps = { address: string; - ensName?: string; selectedAddress?: string; text?: string; dontOverrideColors?: boolean; + resolvedAddresses?: ResolvedAddresses | undefined; }; const AddressOrENSName: React.FC = ({ address, - ensName, selectedAddress, text, dontOverrideColors, -}) => ( - <> - {address === selectedAddress ? ( - <> - {ensName ? ( - - ) : ( -
- )} - - ) : ( - <> - {ensName ? ( - - ) : ( - - )} - - )} - -); + resolvedAddresses, +}) => { + const name = resolvedAddresses?.[address]; + return ( + <> + {address === selectedAddress ? ( + <> + {name ? ( + + ) : ( +
+ )} + + ) : ( + <> + {name ? ( + + ) : ( + + )} + + )} + + ); +}; export default React.memo(AddressOrENSName); diff --git a/src/components/DecoratedAddressLink.tsx b/src/components/DecoratedAddressLink.tsx index ca42a90..ee88b31 100644 --- a/src/components/DecoratedAddressLink.tsx +++ b/src/components/DecoratedAddressLink.tsx @@ -8,10 +8,10 @@ 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 { ResolvedAddresses } from "../api/address-resolver"; type DecoratedAddressLinkProps = { address: string; - ensName?: string; selectedAddress?: string; text?: string; addressCtx?: AddressContext; @@ -21,11 +21,11 @@ type DecoratedAddressLinkProps = { txFrom?: boolean; txTo?: boolean; tokenMeta?: TokenMeta; + resolvedAddresses?: ResolvedAddresses | undefined; }; const DecoratedAddressLink: React.FC = ({ address, - ensName, selectedAddress, text, addressCtx, @@ -35,6 +35,7 @@ const DecoratedAddressLink: React.FC = ({ txFrom, txTo, tokenMeta, + resolvedAddresses, }) => { const mint = addressCtx === AddressContext.FROM && address === ZERO_ADDRESS; const burn = addressCtx === AddressContext.TO && address === ZERO_ADDRESS; @@ -81,10 +82,10 @@ const DecoratedAddressLink: React.FC = ({ )} ); diff --git a/src/search/TransactionItem.tsx b/src/search/TransactionItem.tsx index 3917e24..f71457e 100644 --- a/src/search/TransactionItem.tsx +++ b/src/search/TransactionItem.tsx @@ -22,7 +22,7 @@ import { ResolvedAddresses } from "../api/address-resolver"; type TransactionItemProps = { tx: ProcessedTransaction; - ensCache?: ResolvedAddresses; + resolvedAddresses?: ResolvedAddresses; selectedAddress?: string; feeDisplay: FeeDisplay; priceMap: Record; @@ -30,7 +30,7 @@ type TransactionItemProps = { const TransactionItem: React.FC = ({ tx, - ensCache, + resolvedAddresses, selectedAddress, feeDisplay, priceMap, @@ -51,12 +51,6 @@ const TransactionItem: React.FC = ({ } } - const ensFrom = ensCache && tx.from && ensCache[tx.from]; - const ensTo = ensCache && tx.to && ensCache[tx.to]; - const ensCreated = - ensCache && - tx.createdContractAddress && - ensCache[tx.createdContractAddress]; const flash = tx.gasPrice.isZero() && tx.internalMinerInteraction; return ( @@ -88,9 +82,9 @@ const TransactionItem: React.FC = ({ )} @@ -108,18 +102,18 @@ const TransactionItem: React.FC = ({ ) : ( )}