diff --git a/src/components/InternalTransactionOperation.tsx b/src/components/InternalTransactionOperation.tsx index 5870336..3037dd2 100644 --- a/src/components/InternalTransactionOperation.tsx +++ b/src/components/InternalTransactionOperation.tsx @@ -1,4 +1,5 @@ import React from "react"; +import { BigNumber } from "@ethersproject/bignumber"; import InternalTransfer from "./InternalTransfer"; import InternalSelfDestruct from "./InternalSelfDestruct"; import InternalCreate from "./InternalCreate"; @@ -7,22 +8,29 @@ import { TransactionData, InternalOperation, OperationType } from "../types"; type InternalTransactionOperationProps = { txData: TransactionData; internalOp: InternalOperation; + // TODO: migrate all this logic to SWR + ethUSDPrice: BigNumber | undefined; }; -const InternalTransactionOperation: React.FC = - ({ txData, internalOp }) => ( - <> - {internalOp.type === OperationType.TRANSFER && ( - - )} - {internalOp.type === OperationType.SELF_DESTRUCT && ( - - )} - {(internalOp.type === OperationType.CREATE || - internalOp.type === OperationType.CREATE2) && ( - - )} - - ); +const InternalTransactionOperation: React.FC< + InternalTransactionOperationProps +> = ({ txData, internalOp, ethUSDPrice }) => ( + <> + {internalOp.type === OperationType.TRANSFER && ( + + )} + {internalOp.type === OperationType.SELF_DESTRUCT && ( + + )} + {(internalOp.type === OperationType.CREATE || + internalOp.type === OperationType.CREATE2) && ( + + )} + +); export default React.memo(InternalTransactionOperation); diff --git a/src/components/InternalTransfer.tsx b/src/components/InternalTransfer.tsx index 09c3111..af7001d 100644 --- a/src/components/InternalTransfer.tsx +++ b/src/components/InternalTransfer.tsx @@ -1,4 +1,5 @@ import React, { useContext } from "react"; +import { BigNumber } from "@ethersproject/bignumber"; import { formatEther } from "@ethersproject/units"; import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; import { faAngleRight } from "@fortawesome/free-solid-svg-icons/faAngleRight"; @@ -6,6 +7,7 @@ import { faCaretRight } from "@fortawesome/free-solid-svg-icons/faCaretRight"; import { faSackDollar } from "@fortawesome/free-solid-svg-icons/faSackDollar"; import AddressHighlighter from "./AddressHighlighter"; import DecoratedAddressLink from "./DecoratedAddressLink"; +import USDAmount from "./USDAmount"; import { RuntimeContext } from "../useRuntime"; import { useHasCode } from "../useErigonHooks"; import { useChainInfo } from "../useChainInfo"; @@ -14,14 +16,17 @@ import { TransactionData, InternalOperation } from "../types"; type InternalTransferProps = { txData: TransactionData; internalOp: InternalOperation; + // TODO: migrate all this logic to SWR + ethUSDPrice: BigNumber | undefined; }; const InternalTransfer: React.FC = ({ txData, internalOp, + ethUSDPrice, }) => { const { - nativeCurrency: { symbol }, + nativeCurrency: { symbol, decimals }, } = useChainInfo(); const fromMiner = txData.confirmedData?.miner !== undefined && @@ -94,6 +99,17 @@ const InternalTransfer: React.FC = ({ {formatEther(internalOp.value)} {symbol} + {ethUSDPrice && ( + + + + )} diff --git a/src/transaction/Details.tsx b/src/transaction/Details.tsx index 5764d99..e39346b 100644 --- a/src/transaction/Details.tsx +++ b/src/transaction/Details.tsx @@ -298,6 +298,7 @@ const Details: React.FC = ({ key={i} txData={txData} internalOp={op} + ethUSDPrice={blockETHUSDPrice} /> ))}