diff --git a/src/PriceBox.tsx b/src/PriceBox.tsx index ad73d06..2ebb5d7 100644 --- a/src/PriceBox.tsx +++ b/src/PriceBox.tsx @@ -10,6 +10,7 @@ import { useLatestBlock } from "./useLatestBlock"; const ETH_FEED_DECIMALS = 8; +// TODO: reduce duplication with useETHUSDOracle const PriceBox: React.FC = () => { const { provider } = useContext(RuntimeContext); const latestBlock = useLatestBlock(provider); diff --git a/src/address/AddressTransactionResults.tsx b/src/address/AddressTransactionResults.tsx index 24793d0..1a95535 100644 --- a/src/address/AddressTransactionResults.tsx +++ b/src/address/AddressTransactionResults.tsx @@ -3,6 +3,7 @@ import { BlockTag } from "@ethersproject/providers"; import ContentFrame from "../ContentFrame"; import InfoRow from "../components/InfoRow"; import TransactionValue from "../components/TransactionValue"; +import ETH2USDValue from "../components/ETH2USDValue"; import TransactionAddress from "../components/TransactionAddress"; import Copy from "../components/Copy"; import TransactionLink from "../components/TransactionLink"; @@ -101,9 +102,12 @@ const AddressTransactionResults: React.FC = ({ // TODO: dedup blockTags const blockTags: BlockTag[] = useMemo(() => { if (!page) { - return []; + return ["latest"]; } - return page.map((t) => t.blockNumber); + + const blockTags: BlockTag[] = page.map((t) => t.blockNumber); + blockTags.push("latest"); + return blockTags; }, [page]); const priceMap = useMultipleETHUSDOracle(provider, blockTags); @@ -131,7 +135,17 @@ const AddressTransactionResults: React.FC = ({ {balance && ( - +
+ + {!balance.isZero() && priceMap["latest"] !== undefined && ( + + + + )} +
)} {creator && ( diff --git a/src/components/ETH2USDValue.tsx b/src/components/ETH2USDValue.tsx index ef131d8..53ece53 100644 --- a/src/components/ETH2USDValue.tsx +++ b/src/components/ETH2USDValue.tsx @@ -7,6 +7,13 @@ type ETH2USDValueProps = { eth2USDValue: BigNumber; }; +/** + * Basic display of ETH -> USD values WITHOUT box decoration, only + * text formatting. + * + * USD amounts are displayed commified with 2 decimals places and $ prefix, + * i.e., "$1,000.00". + */ const ETH2USDValue: React.FC = ({ ethAmount, eth2USDValue,