Enable rich info on InfoRow component title; add EIP hyperlink to tx type

This commit is contained in:
Willian Mitsuda 2021-07-28 16:36:34 -03:00
parent 873541ec64
commit 8cacd01f42
3 changed files with 15 additions and 4 deletions

View File

@ -13,9 +13,9 @@ const ExternalLink: React.FC<ExternalLinkProps> = ({ href, children }) => (
target="_blank"
rel="noopener noreferrer"
>
<span className="inline-flex items-center space-x-1">
<span className="inline-flex items-baseline space-x-1">
<span>{children}</span>
<FontAwesomeIcon icon={faExternalLinkAlt} size="1x" />
<FontAwesomeIcon icon={faExternalLinkAlt} size="sm" />
</span>
</a>
);

View File

@ -1,7 +1,7 @@
import React from "react";
type InfoRowProps = React.PropsWithChildren<{
title: string;
title: React.ReactNode;
}>;
const InfoRow: React.FC<InfoRowProps> = ({ title, children }) => (

View File

@ -21,6 +21,7 @@ import FormattedBalance from "../components/FormattedBalance";
import TokenTransferItem from "../TokenTransferItem";
import { TransactionData, InternalOperation } from "../types";
import PercentageBar from "../components/PercentageBar";
import ExternalLink from "../components/ExternalLink";
type DetailsProps = {
txData: TransactionData;
@ -132,7 +133,17 @@ const Details: React.FC<DetailsProps> = ({
{ethers.utils.formatEther(txData.value)} Ether
</span>
</InfoRow>
<InfoRow title="Type (EIP-2718)">
<InfoRow
title={
<>
Type (
<ExternalLink href="https://eips.ethereum.org/EIPS/eip-2718">
EIP-2718
</ExternalLink>
)
</>
}
>
<TransactionType type={txData.type} />
</InfoRow>
{txData.blockBaseFeePerGas && (