diff --git a/src/Block.tsx b/src/Block.tsx index 00ca0dc..9e061e7 100644 --- a/src/Block.tsx +++ b/src/Block.tsx @@ -1,6 +1,6 @@ import React, { useEffect, useMemo, useContext } from "react"; import { useParams, NavLink } from "react-router-dom"; -import { ethers } from "ethers"; +import { BigNumber, ethers } from "ethers"; import StandardFrame from "./StandardFrame"; import StandardSubtitle from "./StandardSubtitle"; import NavBlock from "./block/NavBlock"; @@ -10,6 +10,7 @@ import GasValue from "./components/GasValue"; import BlockLink from "./components/BlockLink"; import DecoratedAddressLink from "./components/DecoratedAddressLink"; import TransactionValue from "./components/TransactionValue"; +import FormattedBalance from "./components/FormattedBalance"; import HexValue from "./components/HexValue"; import { RuntimeContext } from "./useRuntime"; import { useLatestBlockNumber } from "./useLatestBlock"; @@ -39,6 +40,9 @@ const Block: React.FC = () => { console.error(err); } }, [block]); + const burnedFees = + block?.baseFeePerGas && block.baseFeePerGas.mul(block.gasUsed); + const netFeeReward = block && block.feeReward.sub(burnedFees ?? 0); const latestBlockNumber = useLatestBlockNumber(provider); @@ -81,12 +85,18 @@ const Block: React.FC = () => { - + {!block.feeReward.isZero() && ( <> {" "} ( +{" "} - ) + + ) )} @@ -102,6 +112,24 @@ const Block: React.FC = () => { {ethers.utils.commify(block.size)} bytes + {block.baseFeePerGas && ( + + + {" "} + Gwei ( + {" "} + wei) + + + )} + {burnedFees && ( + + Ether + + )}