diff --git a/src/Transaction.tsx b/src/Transaction.tsx index 9f9fbc6..5101193 100644 --- a/src/Transaction.tsx +++ b/src/Transaction.tsx @@ -113,6 +113,7 @@ const Transaction: React.FC = () => {
; events: Record; + errors?: Record | undefined; }; export type DevMethod = { @@ -24,10 +32,17 @@ export type DevMethod = { returns?: Record; }; +export type DevError = [ + { + params?: Record; + } +]; + export type DevDoc = { kind: "dev"; version?: number | undefined; methods: Record; + errors?: Record | undefined; }; export type Metadata = { @@ -236,3 +251,25 @@ export const useTransactionDescription = ( return txDesc; }; + +export const useError = ( + metadata: Metadata | null | undefined, + output: string | null | undefined +): ErrorDescription | null | undefined => { + const err = useMemo(() => { + if (!metadata || !output) { + return undefined; + } + + const abi = metadata.output.abi; + const intf = new Interface(abi as any); + try { + return intf.parseError(output); + } catch (err) { + console.warn("Couldn't find error signature", err); + return null; + } + }, [metadata, output]); + + return err; +}; diff --git a/src/transaction/Details.tsx b/src/transaction/Details.tsx index ca21ea4..66c34e9 100644 --- a/src/transaction/Details.tsx +++ b/src/transaction/Details.tsx @@ -34,13 +34,14 @@ import PercentageBar from "../components/PercentageBar"; import ExternalLink from "../components/ExternalLink"; import RelativePosition from "../components/RelativePosition"; import PercentagePosition from "../components/PercentagePosition"; +import DecodedParamsTable from "./decoder/DecodedParamsTable"; import InputDecoder from "./decoder/InputDecoder"; import { rawInputTo4Bytes, use4Bytes, useTransactionDescription, } from "../use4Bytes"; -import { DevDoc, UserDoc } from "../sourcify/useSourcify"; +import { DevDoc, Metadata, useError, UserDoc } from "../sourcify/useSourcify"; import { ResolvedAddresses } from "../api/address-resolver"; import { RuntimeContext } from "../useRuntime"; import { useContractsMetadata } from "../hooks"; @@ -49,6 +50,7 @@ import { useTransactionError } from "../useErigonHooks"; type DetailsProps = { txData: TransactionData; txDesc: TransactionDescription | null | undefined; + toMetadata: Metadata | null | undefined; userDoc?: UserDoc | undefined; devDoc?: DevDoc | undefined; internalOps?: InternalOperation[]; @@ -60,6 +62,7 @@ type DetailsProps = { const Details: React.FC = ({ txData, txDesc, + toMetadata, userDoc, devDoc, internalOps, @@ -104,6 +107,16 @@ const Details: React.FC = ({ provider, txData.transactionHash ); + const errorDescription = useError( + toMetadata, + isCustomError ? outputData : undefined + ); + const userError = errorDescription + ? userDoc?.errors?.[errorDescription.signature]?.[0] + : undefined; + const devError = errorDescription + ? devDoc?.errors?.[errorDescription.signature]?.[0] + : undefined; const [expanded, setExpanded] = useState(false); return ( @@ -129,7 +142,7 @@ const Details: React.FC = ({ ) : ( <>
-
+
= ({ {errorMsg}' )} - {isCustomError && <> with custom error} + {isCustomError && ( + <> + {" "} + with custom error + {errorDescription && ( + <> + {" '"} + + {errorDescription.name} + + {"'"} + + )} + + )}
{isCustomError && ( @@ -154,27 +181,27 @@ const Details: React.FC = ({ {expanded && ( - Decoded + Decoded Raw - {/* {fourBytes === "0x" ? ( - <>No parameters - ) : resolvedTxDesc === undefined ? ( - <>Waiting for data... - ) : resolvedTxDesc === null ? ( - <>Can't decode data - ) : ( - - )} */} + {errorDescription === undefined ? ( + <>Waiting for data... + ) : errorDescription === null ? ( + <>Can't decode data + ) : errorDescription.args.length === 0 ? ( + <>No parameters + ) : ( + + )}