diff --git a/src/Block.tsx b/src/Block.tsx index bcffc27..9fd6e25 100644 --- a/src/Block.tsx +++ b/src/Block.tsx @@ -14,7 +14,7 @@ import NavButton from "./components/NavButton"; import Timestamp from "./components/Timestamp"; import GasValue from "./components/GasValue"; import BlockLink from "./components/BlockLink"; -import AddressLink from "./components/AddressLink"; +import AddressOrENSName from "./components/AddressOrENSName"; import TransactionValue from "./components/TransactionValue"; import HexValue from "./components/HexValue"; import { useLatestBlockNumber } from "./useLatestBlock"; @@ -154,9 +154,10 @@ const Block: React.FC = () => { in this block -
- -
+
diff --git a/src/Transaction.tsx b/src/Transaction.tsx index c538bc4..2041b2b 100644 --- a/src/Transaction.tsx +++ b/src/Transaction.tsx @@ -13,6 +13,7 @@ import StandardSubtitle from "./StandardSubtitle"; import Tab from "./components/Tab"; import ContentFrame from "./ContentFrame"; import BlockLink from "./components/BlockLink"; +import AddressOrENSName from "./components/AddressOrENSName"; import AddressLink from "./components/AddressLink"; import Copy from "./components/Copy"; import Timestamp from "./components/Timestamp"; @@ -194,13 +195,19 @@ const Transaction: React.FC = () => {
- +
- +
{transfers && ( @@ -284,7 +291,11 @@ const Transaction: React.FC = () => { />{" "} Gwei) - {sendsEthToMiner && Flashbots} + {sendsEthToMiner && ( + + Flashbots + + )}
N/A diff --git a/src/components/AddressOrENSName.tsx b/src/components/AddressOrENSName.tsx index e3cfdb9..8bcf024 100644 --- a/src/components/AddressOrENSName.tsx +++ b/src/components/AddressOrENSName.tsx @@ -1,4 +1,6 @@ import React from "react"; +import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; +import { faCoins } from "@fortawesome/free-solid-svg-icons"; import Address from "./Address"; import AddressLink from "./AddressLink"; import ENSName from "./ENSName"; @@ -8,30 +10,39 @@ type AddressOrENSNameProps = { address: string; ensName?: string; selectedAddress?: string; + minerAddress?: string; }; const AddressOrENSName: React.FC = ({ address, ensName, selectedAddress, -}) => { - return address === selectedAddress ? ( - <> - {ensName ? ( - - ) : ( -
- )} - - ) : ( - <> - {ensName ? ( - - ) : ( - - )} - - ); -}; + minerAddress, +}) => ( +
+ {minerAddress !== undefined && minerAddress === address && ( + + + + )} + {address === selectedAddress ? ( + <> + {ensName ? ( + + ) : ( +
+ )} + + ) : ( + <> + {ensName ? ( + + ) : ( + + )} + + )} +
+); export default React.memo(AddressOrENSName); diff --git a/src/search/TransactionItem.tsx b/src/search/TransactionItem.tsx index 73fc211..7cfaf76 100644 --- a/src/search/TransactionItem.tsx +++ b/src/search/TransactionItem.tsx @@ -1,9 +1,6 @@ import React from "react"; import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; -import { - faExclamationCircle, - faCoins, -} from "@fortawesome/free-solid-svg-icons"; +import { faExclamationCircle } from "@fortawesome/free-solid-svg-icons"; import MethodName from "../components/MethodName"; import BlockLink from "../components/BlockLink"; import TransactionLink from "../components/TransactionLink"; @@ -72,18 +69,12 @@ const TransactionItem: React.FC = ({ {tx.from && ( -
- {tx.miner && tx.miner === tx.from && ( - - - - )} - -
+ )}
@@ -99,6 +90,7 @@ const TransactionItem: React.FC = ({ address={tx.to} ensName={ensTo} selectedAddress={selectedAddress} + minerAddress={tx.miner} /> )}