Retrofit name resolvers into transaction/* pages

This commit is contained in:
Willian Mitsuda 2021-10-30 22:44:33 -03:00
parent 41be42d1ce
commit 7bfa479d6c
5 changed files with 71 additions and 4 deletions

View File

@ -11,6 +11,10 @@ import { useInternalOperations, useTxData } from "./useErigonHooks";
import { useETHUSDOracle } from "./usePriceOracle";
import { useAppConfigContext } from "./useAppConfig";
import { useSourcify, useTransactionDescription } from "./useSourcify";
import {
transactionDataCollector,
useResolvedAddresses,
} from "./useResolvedAddresses";
const Details = React.lazy(
() =>
@ -36,6 +40,11 @@ const Transaction: React.FC = () => {
const { txhash } = params;
const txData = useTxData(provider, txhash);
const addrCollector = useMemo(
() => transactionDataCollector(txData),
[txData]
);
const resolvedAddresses = useResolvedAddresses(provider, addrCollector);
const internalOps = useInternalOperations(provider, txData);
const sendsEthToMiner = useMemo(() => {
@ -100,10 +109,15 @@ const Transaction: React.FC = () => {
internalOps={internalOps}
sendsEthToMiner={sendsEthToMiner}
ethUSDPrice={blockETHUSDPrice}
resolvedAddresses={resolvedAddresses}
/>
</Route>
<Route path="/tx/:txhash/logs/" exact>
<Logs txData={txData} metadata={metadata} />
<Logs
txData={txData}
metadata={metadata}
resolvedAddresses={resolvedAddresses}
/>
</Route>
</Switch>
</React.Suspense>

View File

@ -38,6 +38,7 @@ import ModeTab from "../components/ModeTab";
import DecodedParamsTable from "./decoder/DecodedParamsTable";
import { rawInputTo4Bytes, use4Bytes } from "../use4Bytes";
import { DevDoc, UserDoc } from "../useSourcify";
import { ResolvedAddresses } from "../api/address-resolver";
type DetailsProps = {
txData: TransactionData;
@ -47,6 +48,7 @@ type DetailsProps = {
internalOps?: InternalOperation[];
sendsEthToMiner: boolean;
ethUSDPrice: BigNumber | undefined;
resolvedAddresses: ResolvedAddresses | undefined;
};
const Details: React.FC<DetailsProps> = ({
@ -57,6 +59,7 @@ const Details: React.FC<DetailsProps> = ({
internalOps,
sendsEthToMiner,
ethUSDPrice,
resolvedAddresses,
}) => {
const hasEIP1559 =
txData.confirmedData?.blockBaseFeePerGas !== undefined &&
@ -154,6 +157,7 @@ const Details: React.FC<DetailsProps> = ({
address={txData.from}
miner={txData.from === txData.confirmedData?.miner}
txFrom
resolvedAddresses={resolvedAddresses}
/>
</AddressHighlighter>
<Copy value={txData.from} />
@ -171,6 +175,7 @@ const Details: React.FC<DetailsProps> = ({
address={txData.to}
miner={txData.to === txData.confirmedData?.miner}
txTo
resolvedAddresses={resolvedAddresses}
/>
</AddressHighlighter>
<Copy value={txData.to} />
@ -188,6 +193,7 @@ const Details: React.FC<DetailsProps> = ({
address={txData.confirmedData.createdContractAddress!}
creation
txTo
resolvedAddresses={resolvedAddresses}
/>
</AddressHighlighter>
<Copy value={txData.confirmedData.createdContractAddress!} />

View File

@ -10,14 +10,21 @@ import DecodedParamsTable from "./decoder/DecodedParamsTable";
import DecodedLogSignature from "./decoder/DecodedLogSignature";
import { TransactionData } from "../types";
import { useTopic0 } from "../useTopic0";
import { ResolvedAddresses } from "../api/address-resolver";
type LogEntryProps = {
txData: TransactionData;
log: Log;
logDesc: LogDescription | null | undefined;
resolvedAddresses: ResolvedAddresses | undefined;
};
const LogEntry: React.FC<LogEntryProps> = ({ txData, log, logDesc }) => {
const LogEntry: React.FC<LogEntryProps> = ({
txData,
log,
logDesc,
resolvedAddresses,
}) => {
const rawTopic0 = log.topics[0];
const topic0 = useTopic0(rawTopic0);
@ -62,6 +69,7 @@ const LogEntry: React.FC<LogEntryProps> = ({ txData, log, logDesc }) => {
miner={log.address === txData.confirmedData?.miner}
txFrom={log.address === txData.from}
txTo={log.address === txData.to}
resolvedAddresses={resolvedAddresses}
/>
</AddressHighlighter>
<Copy value={log.address} />

View File

@ -5,13 +5,15 @@ import LogEntry from "./LogEntry";
import { TransactionData } from "../types";
import { useAppConfigContext } from "../useAppConfig";
import { Metadata, useMultipleMetadata } from "../useSourcify";
import { ResolvedAddresses } from "../api/address-resolver";
type LogsProps = {
txData: TransactionData;
metadata: Metadata | null | undefined;
resolvedAddresses: ResolvedAddresses | undefined;
};
const Logs: React.FC<LogsProps> = ({ txData, metadata }) => {
const Logs: React.FC<LogsProps> = ({ txData, metadata, resolvedAddresses }) => {
const baseMetadatas = useMemo((): Record<string, Metadata | null> => {
if (!txData.to || metadata === undefined) {
return {};
@ -70,6 +72,7 @@ const Logs: React.FC<LogsProps> = ({ txData, metadata }) => {
txData={txData}
log={l}
logDesc={logDescs?.[i]}
resolvedAddresses={resolvedAddresses}
/>
))}
</>

View File

@ -1,6 +1,6 @@
import { useState, useEffect } from "react";
import { JsonRpcProvider } from "@ethersproject/providers";
import { ProcessedTransaction } from "./types";
import { ProcessedTransaction, TransactionData } from "./types";
import { batchPopulate, ResolvedAddresses } from "./api/address-resolver";
export type AddressCollector = () => string[];
@ -25,6 +25,42 @@ export const pageCollector =
return Array.from(uniqueAddresses);
};
export const transactionDataCollector =
(txData: TransactionData | null | undefined): AddressCollector =>
() => {
if (!txData) {
return [];
}
const uniqueAddresses = new Set<string>();
// Standard fields
uniqueAddresses.add(txData.from);
if (txData.to) {
uniqueAddresses.add(txData.to);
}
if (txData.confirmedData?.createdContractAddress) {
uniqueAddresses.add(txData.confirmedData?.createdContractAddress);
}
// Dig token transfers
for (const t of txData.tokenTransfers) {
uniqueAddresses.add(t.from);
uniqueAddresses.add(t.to);
uniqueAddresses.add(t.token);
}
// Dig log addresses
if (txData.confirmedData) {
for (const l of txData.confirmedData.logs) {
uniqueAddresses.add(l.address);
// TODO: find a way to dig over decoded address log attributes
}
}
return Array.from(uniqueAddresses);
};
export const useResolvedAddresses = (
provider: JsonRpcProvider | undefined,
addrCollector: AddressCollector