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

src/components/ExternalLink.tsx

@@ -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>
 );

src/components/InfoRow.tsx

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

src/transaction/Details.tsx

@@ -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 && (