Rename jsonrpc method

This commit is contained in:
Willian Mitsuda 2021-07-21 16:06:51 -03:00
parent cf1c23dfa8
commit 9b957d8d20
10 changed files with 95 additions and 94 deletions

View File

@ -10,7 +10,7 @@ import erc20 from "./erc20.json";
import { TokenMetas, TokenTransfer, TransactionData } from "./types"; import { TokenMetas, TokenTransfer, TransactionData } from "./types";
import { RuntimeContext } from "./useRuntime"; import { RuntimeContext } from "./useRuntime";
import { SelectionContext, useSelection } from "./useSelection"; import { SelectionContext, useSelection } from "./useSelection";
import { useInternalTransfers } from "./useErigonHooks"; import { useInternalOperations } from "./useErigonHooks";
const TRANSFER_TOPIC = const TRANSFER_TOPIC =
"0xddf252ad1be2c89b69c2b068fc378daa952ba7f163c4a11628f55a4df523b3ef"; "0xddf252ad1be2c89b69c2b068fc378daa952ba7f163c4a11628f55a4df523b3ef";
@ -106,19 +106,19 @@ const Transaction: React.FC = () => {
readBlock(); readBlock();
}, [provider, txhash]); }, [provider, txhash]);
const intTransfers = useInternalTransfers(provider, txData); const internalOps = useInternalOperations(provider, txData);
const sendsEthToMiner = useMemo(() => { const sendsEthToMiner = useMemo(() => {
if (!txData || !intTransfers) { if (!txData || !internalOps) {
return false; return false;
} }
for (const t of intTransfers) { for (const t of internalOps) {
if (t.to === txData.miner) { if (t.to === txData.miner) {
return true; return true;
} }
} }
return false; return false;
}, [txData, intTransfers]); }, [txData, internalOps]);
const selectionCtx = useSelection(); const selectionCtx = useSelection();
@ -137,7 +137,7 @@ const Transaction: React.FC = () => {
<Route path="/tx/:txhash/" exact> <Route path="/tx/:txhash/" exact>
<Details <Details
txData={txData} txData={txData}
internalTransfers={intTransfers} internalOps={internalOps}
sendsEthToMiner={sendsEthToMiner} sendsEthToMiner={sendsEthToMiner}
/> />
</Route> </Route>

View File

@ -1,19 +1,18 @@
import React, { useContext } from "react"; import React from "react";
import { ethers } from "ethers";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { faAngleRight, faBomb } from "@fortawesome/free-solid-svg-icons"; import { faAngleRight } from "@fortawesome/free-solid-svg-icons";
import AddressHighlighter from "./AddressHighlighter"; import AddressHighlighter from "./AddressHighlighter";
import DecoratedAddressLink from "./DecoratedAddressLink"; import DecoratedAddressLink from "./DecoratedAddressLink";
import { TransactionData, Transfer } from "../types"; import { TransactionData, InternalOperation } from "../types";
type InternalCreateProps = { type InternalCreateProps = {
txData: TransactionData; txData: TransactionData;
transfer: Transfer; internalOp: InternalOperation;
}; };
const InternalCreate: React.FC<InternalCreateProps> = ({ const InternalCreate: React.FC<InternalCreateProps> = ({
txData, txData,
transfer, internalOp,
}) => { }) => {
return ( return (
<> <>
@ -23,17 +22,17 @@ const InternalCreate: React.FC<InternalCreateProps> = ({
</span> </span>
<span>Contract</span> <span>Contract</span>
<div className="flex items-baseline"> <div className="flex items-baseline">
<AddressHighlighter address={transfer.to}> <AddressHighlighter address={internalOp.to}>
<DecoratedAddressLink address={transfer.to} creation /> <DecoratedAddressLink address={internalOp.to} creation />
</AddressHighlighter> </AddressHighlighter>
</div> </div>
<span className="flex items-baseline text-gray-400"> <span className="flex items-baseline text-gray-400">
(Creator:{" "} (Creator:{" "}
<AddressHighlighter address={transfer.from}> <AddressHighlighter address={internalOp.from}>
<DecoratedAddressLink <DecoratedAddressLink
address={transfer.from} address={internalOp.from}
txFrom={transfer.from === txData.from} txFrom={internalOp.from === txData.from}
txTo={transfer.from === txData.to} txTo={internalOp.from === txData.to}
/> />
</AddressHighlighter> </AddressHighlighter>
) )

View File

@ -1,30 +0,0 @@
import React from "react";
import InternalTransfer from "./InternalTransfer";
import InternalSelfDestruct from "./InternalSelfDestruct";
import InternalCreate from "./InternalCreate";
import { TransactionData, Transfer, TransferType } from "../types";
type InternalOperationProps = {
txData: TransactionData;
transfer: Transfer;
};
const InternalOperation: React.FC<InternalOperationProps> = ({
txData,
transfer,
}) => (
<>
{transfer.type === TransferType.TRANSFER && (
<InternalTransfer txData={txData} transfer={transfer} />
)}
{transfer.type === TransferType.SELF_DESTRUCT && (
<InternalSelfDestruct txData={txData} transfer={transfer} />
)}
{(transfer.type === TransferType.CREATE ||
transfer.type === TransferType.CREATE2) && (
<InternalCreate txData={txData} transfer={transfer} />
)}
</>
);
export default React.memo(InternalOperation);

View File

@ -5,24 +5,24 @@ import { faAngleRight, faBomb } from "@fortawesome/free-solid-svg-icons";
import AddressHighlighter from "./AddressHighlighter"; import AddressHighlighter from "./AddressHighlighter";
import DecoratedAddressLink from "./DecoratedAddressLink"; import DecoratedAddressLink from "./DecoratedAddressLink";
import { RuntimeContext } from "../useRuntime"; import { RuntimeContext } from "../useRuntime";
import { TransactionData, Transfer } from "../types"; import { TransactionData, InternalOperation } from "../types";
const CHI_ADDRESS = "0x0000000000004946c0e9F43F4Dee607b0eF1fA1c"; const CHI_ADDRESS = "0x0000000000004946c0e9F43F4Dee607b0eF1fA1c";
const GST2_ADDRESS = "0x0000000000b3F879cb30FE243b4Dfee438691c04"; const GST2_ADDRESS = "0x0000000000b3F879cb30FE243b4Dfee438691c04";
type InternalSelfDestructProps = { type InternalSelfDestructProps = {
txData: TransactionData; txData: TransactionData;
transfer: Transfer; internalOp: InternalOperation;
}; };
const InternalSelfDestruct: React.FC<InternalSelfDestructProps> = ({ const InternalSelfDestruct: React.FC<InternalSelfDestructProps> = ({
txData, txData,
transfer, internalOp,
}) => { }) => {
const { provider } = useContext(RuntimeContext); const { provider } = useContext(RuntimeContext);
const network = provider?.network; const network = provider?.network;
const toMiner = txData.miner !== undefined && transfer.to === txData.miner; const toMiner = txData.miner !== undefined && internalOp.to === txData.miner;
return ( return (
<> <>
@ -35,32 +35,32 @@ const InternalSelfDestruct: React.FC<InternalSelfDestructProps> = ({
</span> </span>
<span>Contract</span> <span>Contract</span>
<div className="flex items-baseline"> <div className="flex items-baseline">
<AddressHighlighter address={transfer.from}> <AddressHighlighter address={internalOp.from}>
<DecoratedAddressLink address={transfer.from} selfDestruct /> <DecoratedAddressLink address={internalOp.from} selfDestruct />
</AddressHighlighter> </AddressHighlighter>
</div> </div>
{network?.chainId === 1 && transfer.to === CHI_ADDRESS && ( {network?.chainId === 1 && internalOp.to === CHI_ADDRESS && (
<span className="text-gray-400">(Chi Gastoken)</span> <span className="text-gray-400">(Chi Gastoken)</span>
)} )}
{network?.chainId === 1 && transfer.to === GST2_ADDRESS && ( {network?.chainId === 1 && internalOp.to === GST2_ADDRESS && (
<span className="text-gray-400">(GST2 Gastoken)</span> <span className="text-gray-400">(GST2 Gastoken)</span>
)} )}
</div> </div>
{!transfer.value.isZero() && ( {!internalOp.value.isZero() && (
<div className="ml-5 flex items-baseline space-x-1 text-xs"> <div className="ml-5 flex items-baseline space-x-1 text-xs">
<span className="text-gray-500"> <span className="text-gray-500">
<FontAwesomeIcon icon={faAngleRight} size="1x" /> TRANSFER <FontAwesomeIcon icon={faAngleRight} size="1x" /> TRANSFER
</span> </span>
<span>{ethers.utils.formatEther(transfer.value)} Ether</span> <span>{ethers.utils.formatEther(internalOp.value)} Ether</span>
<div className="flex items-baseline"> <div className="flex items-baseline">
<span className="text-gray-500">To</span> <span className="text-gray-500">To</span>
<AddressHighlighter address={transfer.to}> <AddressHighlighter address={internalOp.to}>
<div <div
className={`flex items-baseline space-x-1 ${ className={`flex items-baseline space-x-1 ${
toMiner ? "rounded px-2 py-1 bg-yellow-100" : "" toMiner ? "rounded px-2 py-1 bg-yellow-100" : ""
}`} }`}
> >
<DecoratedAddressLink address={transfer.to} miner={toMiner} /> <DecoratedAddressLink address={internalOp.to} miner={toMiner} />
</div> </div>
</AddressHighlighter> </AddressHighlighter>
</div> </div>

View File

@ -0,0 +1,28 @@
import React from "react";
import InternalTransfer from "./InternalTransfer";
import InternalSelfDestruct from "./InternalSelfDestruct";
import InternalCreate from "./InternalCreate";
import { TransactionData, InternalOperation, OperationType } from "../types";
type InternalTransactionOperationProps = {
txData: TransactionData;
internalOp: InternalOperation;
};
const InternalTransactionOperation: React.FC<InternalTransactionOperationProps> =
({ txData, internalOp }) => (
<>
{internalOp.type === OperationType.TRANSFER && (
<InternalTransfer txData={txData} internalOp={internalOp} />
)}
{internalOp.type === OperationType.SELF_DESTRUCT && (
<InternalSelfDestruct txData={txData} internalOp={internalOp} />
)}
{(internalOp.type === OperationType.CREATE ||
internalOp.type === OperationType.CREATE2) && (
<InternalCreate txData={txData} internalOp={internalOp} />
)}
</>
);
export default React.memo(InternalTransactionOperation);

View File

@ -4,57 +4,57 @@ import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { faAngleRight } from "@fortawesome/free-solid-svg-icons"; import { faAngleRight } from "@fortawesome/free-solid-svg-icons";
import AddressHighlighter from "./AddressHighlighter"; import AddressHighlighter from "./AddressHighlighter";
import DecoratedAddressLink from "./DecoratedAddressLink"; import DecoratedAddressLink from "./DecoratedAddressLink";
import { TransactionData, Transfer } from "../types"; import { TransactionData, InternalOperation } from "../types";
type InternalTransferProps = { type InternalTransferProps = {
txData: TransactionData; txData: TransactionData;
transfer: Transfer; internalOp: InternalOperation;
}; };
const InternalTransfer: React.FC<InternalTransferProps> = ({ const InternalTransfer: React.FC<InternalTransferProps> = ({
txData, txData,
transfer, internalOp,
}) => { }) => {
const fromMiner = const fromMiner =
txData.miner !== undefined && transfer.from === txData.miner; txData.miner !== undefined && internalOp.from === txData.miner;
const toMiner = txData.miner !== undefined && transfer.to === txData.miner; const toMiner = txData.miner !== undefined && internalOp.to === txData.miner;
return ( return (
<div className="flex items-baseline space-x-1 text-xs"> <div className="flex items-baseline space-x-1 text-xs">
<span className="text-gray-500"> <span className="text-gray-500">
<FontAwesomeIcon icon={faAngleRight} size="1x" /> TRANSFER <FontAwesomeIcon icon={faAngleRight} size="1x" /> TRANSFER
</span> </span>
<span>{ethers.utils.formatEther(transfer.value)} Ether</span> <span>{ethers.utils.formatEther(internalOp.value)} Ether</span>
<div className="flex items-baseline"> <div className="flex items-baseline">
<span className="text-gray-500">From</span> <span className="text-gray-500">From</span>
<AddressHighlighter address={transfer.from}> <AddressHighlighter address={internalOp.from}>
<div <div
className={`flex items-baseline space-x-1 ${ className={`flex items-baseline space-x-1 ${
fromMiner ? "rounded px-2 py-1 bg-yellow-100" : "" fromMiner ? "rounded px-2 py-1 bg-yellow-100" : ""
}`} }`}
> >
<DecoratedAddressLink <DecoratedAddressLink
address={transfer.from} address={internalOp.from}
miner={fromMiner} miner={fromMiner}
txFrom={transfer.from === txData.from} txFrom={internalOp.from === txData.from}
txTo={transfer.from === txData.to} txTo={internalOp.from === txData.to}
/> />
</div> </div>
</AddressHighlighter> </AddressHighlighter>
</div> </div>
<div className="flex items-baseline"> <div className="flex items-baseline">
<span className="text-gray-500">To</span> <span className="text-gray-500">To</span>
<AddressHighlighter address={transfer.to}> <AddressHighlighter address={internalOp.to}>
<div <div
className={`flex items-baseline space-x-1 ${ className={`flex items-baseline space-x-1 ${
toMiner ? "rounded px-2 py-1 bg-yellow-100" : "" toMiner ? "rounded px-2 py-1 bg-yellow-100" : ""
}`} }`}
> >
<DecoratedAddressLink <DecoratedAddressLink
address={transfer.to} address={internalOp.to}
miner={toMiner} miner={toMiner}
txFrom={transfer.to === txData.from} txFrom={internalOp.to === txData.from}
txTo={transfer.to === txData.to} txTo={internalOp.to === txData.to}
/> />
</div> </div>
</AddressHighlighter> </AddressHighlighter>

View File

@ -1,15 +1,15 @@
import { ethers } from "ethers"; import { ethers } from "ethers";
import { TransactionData, Transfer } from "./types"; import { TransactionData, InternalOperation } from "./types";
export const getTransactionTransfers = async ( export const getInternalOperations = async (
provider: ethers.providers.JsonRpcProvider, provider: ethers.providers.JsonRpcProvider,
txData: TransactionData txData: TransactionData
) => { ) => {
const rawTransfers = await provider.send("ots_getTransactionTransfers", [ const rawTransfers = await provider.send("ots_getInternalOperations", [
txData.transactionHash, txData.transactionHash,
]); ]);
const _transfers: Transfer[] = []; const _transfers: InternalOperation[] = [];
for (const t of rawTransfers) { for (const t of rawTransfers) {
_transfers.push({ _transfers.push({
type: t.type, type: t.type,

View File

@ -12,22 +12,22 @@ import AddressHighlighter from "../components/AddressHighlighter";
import DecoratedAddressLink from "../components/DecoratedAddressLink"; import DecoratedAddressLink from "../components/DecoratedAddressLink";
import Copy from "../components/Copy"; import Copy from "../components/Copy";
import Timestamp from "../components/Timestamp"; import Timestamp from "../components/Timestamp";
import InternalOperation from "../components/InternalOperation"; import InternalTransactionOperation from "../components/InternalTransactionOperation";
import MethodName from "../components/MethodName"; import MethodName from "../components/MethodName";
import GasValue from "../components/GasValue"; import GasValue from "../components/GasValue";
import FormattedBalance from "../components/FormattedBalance"; import FormattedBalance from "../components/FormattedBalance";
import TokenTransferItem from "../TokenTransferItem"; import TokenTransferItem from "../TokenTransferItem";
import { TransactionData, Transfer } from "../types"; import { TransactionData, InternalOperation } from "../types";
type DetailsProps = { type DetailsProps = {
txData: TransactionData; txData: TransactionData;
internalTransfers?: Transfer[]; internalOps?: InternalOperation[];
sendsEthToMiner: boolean; sendsEthToMiner: boolean;
}; };
const Details: React.FC<DetailsProps> = ({ const Details: React.FC<DetailsProps> = ({
txData, txData,
internalTransfers, internalOps,
sendsEthToMiner, sendsEthToMiner,
}) => ( }) => (
<ContentFrame tabs> <ContentFrame tabs>
@ -97,10 +97,14 @@ const Details: React.FC<DetailsProps> = ({
<Copy value={txData.createdContractAddress!} /> <Copy value={txData.createdContractAddress!} />
</div> </div>
)} )}
{internalTransfers && ( {internalOps && (
<div className="mt-2 space-y-1"> <div className="mt-2 space-y-1">
{internalTransfers.map((t, i) => ( {internalOps.map((op, i) => (
<InternalOperation key={i} txData={txData} transfer={t} /> <InternalTransactionOperation
key={i}
txData={txData}
internalOp={op}
/>
))} ))}
</div> </div>
)} )}

View File

@ -72,15 +72,15 @@ export type From = {
depth: number; depth: number;
}; };
export enum TransferType { export enum OperationType {
TRANSFER = 0, TRANSFER = 0,
SELF_DESTRUCT = 1, SELF_DESTRUCT = 1,
CREATE = 2, CREATE = 2,
CREATE2 = 3, CREATE2 = 3,
} }
export type Transfer = { export type InternalOperation = {
type: TransferType; type: OperationType;
from: string; from: string;
to: string; to: string;
value: BigNumber; value: BigNumber;

View File

@ -1,13 +1,13 @@
import { ethers } from "ethers"; import { ethers } from "ethers";
import { useState, useEffect } from "react"; import { useState, useEffect } from "react";
import { getTransactionTransfers } from "./nodeFunctions"; import { getInternalOperations } from "./nodeFunctions";
import { TransactionData, Transfer } from "./types"; import { TransactionData, InternalOperation } from "./types";
export const useInternalTransfers = ( export const useInternalOperations = (
provider: ethers.providers.JsonRpcProvider | undefined, provider: ethers.providers.JsonRpcProvider | undefined,
txData: TransactionData | undefined txData: TransactionData | undefined
): Transfer[] | undefined => { ): InternalOperation[] | undefined => {
const [intTransfers, setIntTransfers] = useState<Transfer[]>(); const [intTransfers, setIntTransfers] = useState<InternalOperation[]>();
useEffect(() => { useEffect(() => {
const traceTransfers = async () => { const traceTransfers = async () => {
@ -15,7 +15,7 @@ export const useInternalTransfers = (
return; return;
} }
const _transfers = await getTransactionTransfers(provider, txData); const _transfers = await getInternalOperations(provider, txData);
for (const t of _transfers) { for (const t of _transfers) {
t.from = provider.formatter.address(t.from); t.from = provider.formatter.address(t.from);
t.to = provider.formatter.address(t.to); t.to = provider.formatter.address(t.to);