Apply USD oracle to internal ETH transfers section
This commit is contained in:
parent
a1edc3d632
commit
2c0f576d23
|
@ -1,4 +1,5 @@
|
||||||
import React from "react";
|
import React from "react";
|
||||||
|
import { BigNumber } from "@ethersproject/bignumber";
|
||||||
import InternalTransfer from "./InternalTransfer";
|
import InternalTransfer from "./InternalTransfer";
|
||||||
import InternalSelfDestruct from "./InternalSelfDestruct";
|
import InternalSelfDestruct from "./InternalSelfDestruct";
|
||||||
import InternalCreate from "./InternalCreate";
|
import InternalCreate from "./InternalCreate";
|
||||||
|
@ -7,22 +8,29 @@ import { TransactionData, InternalOperation, OperationType } from "../types";
|
||||||
type InternalTransactionOperationProps = {
|
type InternalTransactionOperationProps = {
|
||||||
txData: TransactionData;
|
txData: TransactionData;
|
||||||
internalOp: InternalOperation;
|
internalOp: InternalOperation;
|
||||||
|
// TODO: migrate all this logic to SWR
|
||||||
|
ethUSDPrice: BigNumber | undefined;
|
||||||
};
|
};
|
||||||
|
|
||||||
const InternalTransactionOperation: React.FC<InternalTransactionOperationProps> =
|
const InternalTransactionOperation: React.FC<
|
||||||
({ txData, internalOp }) => (
|
InternalTransactionOperationProps
|
||||||
<>
|
> = ({ txData, internalOp, ethUSDPrice }) => (
|
||||||
{internalOp.type === OperationType.TRANSFER && (
|
<>
|
||||||
<InternalTransfer txData={txData} internalOp={internalOp} />
|
{internalOp.type === OperationType.TRANSFER && (
|
||||||
)}
|
<InternalTransfer
|
||||||
{internalOp.type === OperationType.SELF_DESTRUCT && (
|
txData={txData}
|
||||||
<InternalSelfDestruct txData={txData} internalOp={internalOp} />
|
internalOp={internalOp}
|
||||||
)}
|
ethUSDPrice={ethUSDPrice}
|
||||||
{(internalOp.type === OperationType.CREATE ||
|
/>
|
||||||
internalOp.type === OperationType.CREATE2) && (
|
)}
|
||||||
<InternalCreate internalOp={internalOp} />
|
{internalOp.type === OperationType.SELF_DESTRUCT && (
|
||||||
)}
|
<InternalSelfDestruct txData={txData} internalOp={internalOp} />
|
||||||
</>
|
)}
|
||||||
);
|
{(internalOp.type === OperationType.CREATE ||
|
||||||
|
internalOp.type === OperationType.CREATE2) && (
|
||||||
|
<InternalCreate internalOp={internalOp} />
|
||||||
|
)}
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
|
||||||
export default React.memo(InternalTransactionOperation);
|
export default React.memo(InternalTransactionOperation);
|
||||||
|
|
|
@ -1,4 +1,5 @@
|
||||||
import React, { useContext } from "react";
|
import React, { useContext } from "react";
|
||||||
|
import { BigNumber } from "@ethersproject/bignumber";
|
||||||
import { formatEther } from "@ethersproject/units";
|
import { formatEther } from "@ethersproject/units";
|
||||||
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
|
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
|
||||||
import { faAngleRight } from "@fortawesome/free-solid-svg-icons/faAngleRight";
|
import { faAngleRight } from "@fortawesome/free-solid-svg-icons/faAngleRight";
|
||||||
|
@ -6,6 +7,7 @@ import { faCaretRight } from "@fortawesome/free-solid-svg-icons/faCaretRight";
|
||||||
import { faSackDollar } from "@fortawesome/free-solid-svg-icons/faSackDollar";
|
import { faSackDollar } from "@fortawesome/free-solid-svg-icons/faSackDollar";
|
||||||
import AddressHighlighter from "./AddressHighlighter";
|
import AddressHighlighter from "./AddressHighlighter";
|
||||||
import DecoratedAddressLink from "./DecoratedAddressLink";
|
import DecoratedAddressLink from "./DecoratedAddressLink";
|
||||||
|
import USDAmount from "./USDAmount";
|
||||||
import { RuntimeContext } from "../useRuntime";
|
import { RuntimeContext } from "../useRuntime";
|
||||||
import { useHasCode } from "../useErigonHooks";
|
import { useHasCode } from "../useErigonHooks";
|
||||||
import { useChainInfo } from "../useChainInfo";
|
import { useChainInfo } from "../useChainInfo";
|
||||||
|
@ -14,14 +16,17 @@ import { TransactionData, InternalOperation } from "../types";
|
||||||
type InternalTransferProps = {
|
type InternalTransferProps = {
|
||||||
txData: TransactionData;
|
txData: TransactionData;
|
||||||
internalOp: InternalOperation;
|
internalOp: InternalOperation;
|
||||||
|
// TODO: migrate all this logic to SWR
|
||||||
|
ethUSDPrice: BigNumber | undefined;
|
||||||
};
|
};
|
||||||
|
|
||||||
const InternalTransfer: React.FC<InternalTransferProps> = ({
|
const InternalTransfer: React.FC<InternalTransferProps> = ({
|
||||||
txData,
|
txData,
|
||||||
internalOp,
|
internalOp,
|
||||||
|
ethUSDPrice,
|
||||||
}) => {
|
}) => {
|
||||||
const {
|
const {
|
||||||
nativeCurrency: { symbol },
|
nativeCurrency: { symbol, decimals },
|
||||||
} = useChainInfo();
|
} = useChainInfo();
|
||||||
const fromMiner =
|
const fromMiner =
|
||||||
txData.confirmedData?.miner !== undefined &&
|
txData.confirmedData?.miner !== undefined &&
|
||||||
|
@ -94,6 +99,17 @@ const InternalTransfer: React.FC<InternalTransferProps> = ({
|
||||||
<span>
|
<span>
|
||||||
{formatEther(internalOp.value)} {symbol}
|
{formatEther(internalOp.value)} {symbol}
|
||||||
</span>
|
</span>
|
||||||
|
{ethUSDPrice && (
|
||||||
|
<span className="px-2 border-gray-200 border rounded-lg bg-gray-100 text-gray-600">
|
||||||
|
<USDAmount
|
||||||
|
amount={internalOp.value}
|
||||||
|
amountDecimals={decimals}
|
||||||
|
quote={ethUSDPrice}
|
||||||
|
// TODO: migrate to SWR and standardize this magic number
|
||||||
|
quoteDecimals={8}
|
||||||
|
/>
|
||||||
|
</span>
|
||||||
|
)}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -298,6 +298,7 @@ const Details: React.FC<DetailsProps> = ({
|
||||||
key={i}
|
key={i}
|
||||||
txData={txData}
|
txData={txData}
|
||||||
internalOp={op}
|
internalOp={op}
|
||||||
|
ethUSDPrice={blockETHUSDPrice}
|
||||||
/>
|
/>
|
||||||
))}
|
))}
|
||||||
</div>
|
</div>
|
||||||
|
|
Loading…
Reference in New Issue