otterscan/src/components/TransactionAddress.tsx

57 lines
1.7 KiB
TypeScript

import React, { useContext } from "react";
import AddressHighlighter from "./AddressHighlighter";
import DecoratedAddressLink from "./DecoratedAddressLink";
import { useSelectedTransaction } from "../useSelectedTransaction";
import { useBlockNumberContext } from "../useBlockTagContext";
import { RuntimeContext } from "../useRuntime";
import { useHasCode } from "../useErigonHooks";
import { AddressContext, ChecksummedAddress } from "../types";
type TransactionAddressProps = {
address: ChecksummedAddress;
addressCtx?: AddressContext | undefined;
showCodeIndicator?: boolean;
};
const TransactionAddress: React.FC<TransactionAddressProps> = ({
address,
addressCtx,
showCodeIndicator = false,
}) => {
const txData = useSelectedTransaction();
// TODO: push down creation coloring logic into DecoratedAddressLink
const creation = address === txData?.confirmedData?.createdContractAddress;
const { provider } = useContext(RuntimeContext);
const blockNumber = useBlockNumberContext();
const toHasCode = useHasCode(
provider,
address,
blockNumber !== undefined
? blockNumber === "latest"
? "latest"
: blockNumber - 1
: undefined
);
return (
<AddressHighlighter address={address}>
<DecoratedAddressLink
address={address}
addressCtx={addressCtx}
miner={address === txData?.confirmedData?.miner}
txFrom={address === txData?.from}
txTo={address === txData?.to || creation}
creation={creation}
eoa={
showCodeIndicator && blockNumber !== undefined
? !toHasCode
: undefined
}
/>
</AddressHighlighter>
);
};
export default TransactionAddress;