diff --git a/src/Transaction.tsx b/src/Transaction.tsx index 4f8c312..e2b6390 100644 --- a/src/Transaction.tsx +++ b/src/Transaction.tsx @@ -22,6 +22,7 @@ import AddressLink from "./components/AddressLink"; import Copy from "./components/Copy"; import Timestamp from "./components/Timestamp"; import InternalTransfer from "./components/InternalTransfer"; +import MethodName from "./components/MethodName"; import GasValue from "./components/GasValue"; import FormattedBalance from "./components/FormattedBalance"; import TokenTransferItem from "./TokenTransferItem"; @@ -232,7 +233,9 @@ const Transaction: React.FC = () => { )} - + + + {txData.tokenTransfers.length > 0 && ( = ({ data }) => { - const methodName = use4Bytes(data); + const rawFourBytes = data.slice(0, 10); + const methodName = use4Bytes(rawFourBytes); + const isSimpleTransfer = data === "0x"; + const methodTitle = isSimpleTransfer + ? "ETH Transfer" + : methodName === rawFourBytes + ? methodName + : `${methodName} [${rawFourBytes}]`; return ( -
-

+

+

{methodName}

diff --git a/src/use4Bytes.ts b/src/use4Bytes.ts index 11f29d2..dad9f75 100644 --- a/src/use4Bytes.ts +++ b/src/use4Bytes.ts @@ -4,12 +4,10 @@ import { fourBytesURL } from "./url"; const cache = new Map(); -export const use4Bytes = (data: string) => { +export const use4Bytes = (rawFourBytes: string) => { const runtime = useContext(RuntimeContext); const assetsURLPrefix = runtime.config?.assetsURLPrefix; - let rawFourBytes = data.slice(0, 10); - const [name, setName] = useState(); const [fourBytes, setFourBytes] = useState(); useEffect(() => { @@ -45,7 +43,7 @@ export const use4Bytes = (data: string) => { }); }, [rawFourBytes, assetsURLPrefix, fourBytes]); - if (data === "0x") { + if (rawFourBytes === "0x") { return "Transfer"; } if (assetsURLPrefix === undefined) {