diff --git a/src/address/AddressTransactionResults.tsx b/src/address/AddressTransactionResults.tsx index 88ae415..24793d0 100644 --- a/src/address/AddressTransactionResults.tsx +++ b/src/address/AddressTransactionResults.tsx @@ -2,7 +2,7 @@ import React, { useContext, useEffect, useMemo, useState } from "react"; import { BlockTag } from "@ethersproject/providers"; import ContentFrame from "../ContentFrame"; import InfoRow from "../components/InfoRow"; -import FormattedBalance from "../components/FormattedBalance"; +import TransactionValue from "../components/TransactionValue"; import TransactionAddress from "../components/TransactionAddress"; import Copy from "../components/Copy"; import TransactionLink from "../components/TransactionLink"; @@ -131,7 +131,7 @@ const AddressTransactionResults: React.FC = ({ {balance && ( - Ether + )} {creator && ( diff --git a/src/components/FormattedBalance.tsx b/src/components/FormattedBalance.tsx index 6f83163..7da298e 100644 --- a/src/components/FormattedBalance.tsx +++ b/src/components/FormattedBalance.tsx @@ -7,6 +7,7 @@ type FormatterBalanceProps = { decimals?: number; }; +// TODO: remove duplication with TransactionValue component const FormattedBalance: React.FC = ({ value, decimals = 18, diff --git a/src/components/TransactionValue.tsx b/src/components/TransactionValue.tsx index f403b4a..618ec2e 100644 --- a/src/components/TransactionValue.tsx +++ b/src/components/TransactionValue.tsx @@ -8,6 +8,16 @@ type TransactionValueProps = { hideUnit?: boolean; }; +/** + * Standard component for displaying balances. It: + * + * - Commify non-decimal parts, i.e., 1,000,000.00 + * - Light gray absolute zero values + * - Cut out decimal part is it is 0 to reduce UI clutter, i.e., show + * 123 instead of 123.00 + * + * TODO: remove duplication with FormattedBalance + */ const TransactionValue: React.FC = ({ value, decimals = 18,