48 lines
1.3 KiB
TypeScript
48 lines
1.3 KiB
TypeScript
import React, { useContext } from "react";
|
|
import { BigNumber } from "@ethersproject/bignumber";
|
|
import TransactionValue from "./components/TransactionValue";
|
|
import FiatValue from "./components/FiatValue";
|
|
import { RuntimeContext } from "./useRuntime";
|
|
import { ExtendedBlock } from "./useErigonHooks";
|
|
import { useETHUSDOracle } from "./usePriceOracle";
|
|
|
|
type BlockRewardProps = {
|
|
block: ExtendedBlock;
|
|
};
|
|
|
|
const BlockReward: React.FC<BlockRewardProps> = ({ block }) => {
|
|
const { provider } = useContext(RuntimeContext);
|
|
const eth2USDValue = useETHUSDOracle(provider, block.number);
|
|
|
|
const netFeeReward = block?.feeReward ?? BigNumber.from(0);
|
|
const value = eth2USDValue
|
|
? block.blockReward
|
|
.add(netFeeReward)
|
|
.mul(eth2USDValue)
|
|
.div(10 ** 8)
|
|
: undefined;
|
|
|
|
return (
|
|
<>
|
|
<TransactionValue value={block.blockReward.add(netFeeReward)} />
|
|
{!netFeeReward.isZero() && (
|
|
<>
|
|
{" "}
|
|
(<TransactionValue value={block.blockReward} hideUnit /> +{" "}
|
|
<TransactionValue value={netFeeReward} hideUnit />)
|
|
</>
|
|
)}
|
|
{value && (
|
|
<>
|
|
{" "}
|
|
<span className="px-2 border-amber-200 border rounded-lg bg-amber-100 text-amber-600">
|
|
<FiatValue value={value} />
|
|
</span>
|
|
</>
|
|
)}
|
|
</>
|
|
);
|
|
};
|
|
|
|
export default BlockReward;
|