diff --git a/src/transaction/Details.tsx b/src/transaction/Details.tsx index bb41b04..e94b43e 100644 --- a/src/transaction/Details.tsx +++ b/src/transaction/Details.tsx @@ -43,7 +43,11 @@ import { useTransactionDescription as useSourcifyTransactionDescription, } from "../sourcify/useSourcify"; import { RuntimeContext } from "../useRuntime"; -import { useSendsToMiner, useTransactionError } from "../useErigonHooks"; +import { + useSendsToMiner, + useTokenTransfers, + useTransactionError, +} from "../useErigonHooks"; import { useChainInfo } from "../useChainInfo"; import { useETHUSDOracle } from "../usePriceOracle"; @@ -73,6 +77,8 @@ const Details: React.FC = ({ txData }) => { txData.confirmedData?.miner ); + const tokenTransfers = useTokenTransfers(txData); + const metadata = useSourcifyMetadata(txData?.to, provider?.network.chainId); const txDesc = useSourcifyTransactionDescription(metadata, txData); @@ -282,9 +288,9 @@ const Details: React.FC = ({ txData }) => { )} - {txData.tokenTransfers.length > 0 && ( - - {txData.tokenTransfers.map((t, i) => ( + {tokenTransfers && tokenTransfers.length > 0 && ( + + {tokenTransfers.map((t, i) => ( ))} diff --git a/src/types.ts b/src/types.ts index 06d7c69..e4ed03b 100644 --- a/src/types.ts +++ b/src/types.ts @@ -36,7 +36,6 @@ export type TransactionData = { from: string; to?: string; value: BigNumber; - tokenTransfers: TokenTransfer[]; type: number; maxFeePerGas?: BigNumber | undefined; maxPriorityFeePerGas?: BigNumber | undefined; diff --git a/src/useErigonHooks.ts b/src/useErigonHooks.ts index 1382715..e1c0815 100644 --- a/src/useErigonHooks.ts +++ b/src/useErigonHooks.ts @@ -198,31 +198,11 @@ export const useTxData = ( document.title = `Transaction ${_response.hash} | Otterscan`; - // Extract token transfers - const tokenTransfers: TokenTransfer[] = []; - if (_receipt) { - for (const l of _receipt.logs) { - if (l.topics.length !== 3) { - continue; - } - if (l.topics[0] !== TRANSFER_TOPIC) { - continue; - } - tokenTransfers.push({ - token: l.address, - from: getAddress(hexDataSlice(arrayify(l.topics[1]), 12)), - to: getAddress(hexDataSlice(arrayify(l.topics[2]), 12)), - value: BigNumber.from(l.data), - }); - } - } - setTxData({ transactionHash: _response.hash, from: _response.from, to: _response.to, value: _response.value, - tokenTransfers, type: _response.type ?? 0, maxFeePerGas: _response.maxFeePerGas, maxPriorityFeePerGas: _response.maxPriorityFeePerGas, @@ -260,6 +240,35 @@ export const useTxData = ( return txData; }; +export const useTokenTransfers = ( + txData: TransactionData +): TokenTransfer[] | undefined => { + const transfers = useMemo(() => { + if (!txData.confirmedData) { + return undefined; + } + + const _transfers: TokenTransfer[] = []; + for (const l of txData.confirmedData.logs) { + if (l.topics.length !== 3) { + continue; + } + if (l.topics[0] !== TRANSFER_TOPIC) { + continue; + } + _transfers.push({ + token: l.address, + from: getAddress(hexDataSlice(arrayify(l.topics[1]), 12)), + to: getAddress(hexDataSlice(arrayify(l.topics[2]), 12)), + value: BigNumber.from(l.data), + }); + } + return _transfers; + }, [txData]); + + return transfers; +}; + export const useInternalOperations = ( provider: JsonRpcProvider | undefined, txHash: string | undefined