diff --git a/src/transaction/DecodedParamRow.tsx b/src/transaction/DecodedParamRow.tsx new file mode 100644 index 0000000..3e5e2cd --- /dev/null +++ b/src/transaction/DecodedParamRow.tsx @@ -0,0 +1,63 @@ +import React from "react"; +import AddressHighlighter from "../components/AddressHighlighter"; +import DecoratedAddressLink from "../components/DecoratedAddressLink"; +import Copy from "../components/Copy"; +import { ParamType } from "@ethersproject/abi"; +import { TransactionData } from "../types"; + +type DecodedParamRowProps = { + i?: number | undefined; + r: any; + paramType: ParamType; + txData: TransactionData; +}; + +const DecodedParamRow: React.FC = ({ + i, + r, + paramType, + txData, +}) => { + return ( + + + {paramType.name}{" "} + {i !== undefined && ( + ({i}) + )} + + {paramType.type} + + {paramType.type === "address" ? ( +
+ + + + +
+ ) : paramType.type === "bool" ? ( + + {r.toString()} + + ) : paramType.type === "bytes" ? ( + + {r.toString()}{" "} + + {r.toString().length / 2 - 1}{" "} + {r.toString().length / 2 - 1 === 1 ? "byte" : "bytes"} + + + ) : ( + r.toString() + )} + + + ); +}; + +export default React.memo(DecodedParamRow); diff --git a/src/transaction/DecodedParamsTable.tsx b/src/transaction/DecodedParamsTable.tsx index 72c9262..ff439d8 100644 --- a/src/transaction/DecodedParamsTable.tsx +++ b/src/transaction/DecodedParamsTable.tsx @@ -1,8 +1,6 @@ import React from "react"; import { ParamType, Result } from "@ethersproject/abi"; -import AddressHighlighter from "../components/AddressHighlighter"; -import DecoratedAddressLink from "../components/DecoratedAddressLink"; -import Copy from "../components/Copy"; +import DecodedParamRow from "./DecodedParamRow"; import { TransactionData } from "../types"; type DecodedParamsTableProps = { @@ -28,42 +26,13 @@ const DecodedParamsTable: React.FC = ({ {args.map((r, i) => ( - - - {paramTypes[i].name}{" "} - ({i}) - - {paramTypes[i].type} - - {paramTypes[i].type === "address" ? ( -
- - - - -
- ) : paramTypes[i].type === "bool" ? ( - - {r.toString()} - - ) : paramTypes[i].type === "bytes" ? ( - - {r.toString()}{" "} - - {r.toString().length / 2 - 1}{" "} - {r.toString().length / 2 - 1 === 1 ? "byte" : "bytes"} - - - ) : ( - r.toString() - )} - - + ))}