kopia lustrzana https://github.com/bugout-dev/moonstream
108 wiersze
3.0 KiB
JavaScript
108 wiersze
3.0 KiB
JavaScript
import React from "react";
|
|
import {
|
|
Code,
|
|
Stat,
|
|
StatLabel,
|
|
StatGroup,
|
|
StatHelpText,
|
|
StatNumber,
|
|
Box,
|
|
VStack,
|
|
} from "@chakra-ui/react";
|
|
import ContractSource from "./ContractSource";
|
|
import { Table, Thead, Tbody, Tr, Th, Td } from "@chakra-ui/react";
|
|
const toEth = (wei) => {
|
|
return wei / Math.pow(10, 18);
|
|
};
|
|
const TxABI = (props) => {
|
|
const byteCode = props.byteCode;
|
|
const abi = props.abi;
|
|
return (
|
|
<VStack spacing={3}>
|
|
<br />
|
|
<h2>Transaction smart contract bytecode:</h2>
|
|
<Code w="95%" colorScheme="facebook">
|
|
{byteCode}
|
|
</Code>
|
|
<h2>Smart contract abi:</h2>
|
|
<Table>
|
|
<Thead>
|
|
<Tr>
|
|
<Th>Signature hex</Th>
|
|
<Th>Decompiled signature</Th>
|
|
<Th>Signature type</Th>
|
|
</Tr>
|
|
</Thead>
|
|
<Tbody>
|
|
{abi.methods.concat(abi.events).map((el) => (
|
|
<Tr key={el.hex_signature}>
|
|
<Td>{el.hex_signature}</Td>
|
|
<Td>
|
|
{el.text_signature_candidates.length > 0
|
|
? el.text_signature_candidates.join(", ")
|
|
: "Unknown"}
|
|
</Td>
|
|
<Td>{el.type}</Td>
|
|
</Tr>
|
|
))}
|
|
</Tbody>
|
|
</Table>
|
|
</VStack>
|
|
);
|
|
};
|
|
const TxInfo = (props) => {
|
|
const transaction = props.transaction;
|
|
const dont_display = (key) => {
|
|
return !["input"].includes(key);
|
|
};
|
|
return (
|
|
<Box boxShadow="xs" p="6" rounded="md">
|
|
<StatGroup>
|
|
<Stat px={2}>
|
|
<StatLabel>Value</StatLabel>
|
|
<StatNumber fontSize="md">
|
|
{toEth(transaction.tx.value)} eth
|
|
</StatNumber>
|
|
<StatHelpText>amount of ETH to transfer</StatHelpText>
|
|
</Stat>
|
|
<Stat>
|
|
<StatLabel>Gas limit</StatLabel>
|
|
<StatNumber fontSize="md">{transaction.tx.gas}</StatNumber>
|
|
<StatHelpText>Maximum amount of gas </StatHelpText>
|
|
<StatHelpText>provided for the transaction</StatHelpText>
|
|
</Stat>
|
|
<Stat>
|
|
<StatLabel>Gas price</StatLabel>
|
|
<StatNumber fontSize="md">
|
|
{toEth(transaction.tx.gas_price)} eth
|
|
</StatNumber>
|
|
<StatHelpText>the fee the sender pays per unit of gas</StatHelpText>
|
|
</Stat>
|
|
</StatGroup>
|
|
|
|
<Table variant="simple" size="sm">
|
|
<Tbody>
|
|
{Object.keys(transaction.tx)
|
|
.filter(dont_display)
|
|
.map(
|
|
(key) =>
|
|
transaction.tx[key] != undefined && (
|
|
<Tr key={key}>
|
|
<Td>{key}</Td>
|
|
<Td wordBreak="break-all">{transaction.tx[key]}</Td>
|
|
</Tr>
|
|
)
|
|
)}
|
|
</Tbody>
|
|
</Table>
|
|
{transaction.smart_contract_info && (
|
|
<ContractSource source_info={transaction.smart_contract_info} />
|
|
)}
|
|
{transaction.tx.input && transaction.tx.input !== "0x" && (
|
|
<TxABI byteCode={transaction.tx.input} abi={transaction.abi} />
|
|
)}
|
|
</Box>
|
|
);
|
|
};
|
|
export default TxInfo;
|