Push down oracle info read
This commit is contained in:
parent
d198a5c5b2
commit
a1edc3d632
|
@ -10,7 +10,6 @@ import { useInternalOperations, useTxData } from "./useErigonHooks";
|
||||||
import { SelectionContext, useSelection } from "./useSelection";
|
import { SelectionContext, useSelection } from "./useSelection";
|
||||||
import { SelectedTransactionContext } from "./useSelectedTransaction";
|
import { SelectedTransactionContext } from "./useSelectedTransaction";
|
||||||
import { BlockNumberContext } from "./useBlockTagContext";
|
import { BlockNumberContext } from "./useBlockTagContext";
|
||||||
import { useETHUSDOracle } from "./usePriceOracle";
|
|
||||||
import { useAppConfigContext } from "./useAppConfig";
|
import { useAppConfigContext } from "./useAppConfig";
|
||||||
import { useSourcify, useTransactionDescription } from "./sourcify/useSourcify";
|
import { useSourcify, useTransactionDescription } from "./sourcify/useSourcify";
|
||||||
|
|
||||||
|
@ -60,11 +59,6 @@ const TransactionPageContent: React.FC<TransactionPageContentProps> = ({
|
||||||
|
|
||||||
const selectionCtx = useSelection();
|
const selectionCtx = useSelection();
|
||||||
|
|
||||||
const blockETHUSDPrice = useETHUSDOracle(
|
|
||||||
provider,
|
|
||||||
txData?.confirmedData?.blockNumber
|
|
||||||
);
|
|
||||||
|
|
||||||
const { sourcifySource } = useAppConfigContext();
|
const { sourcifySource } = useAppConfigContext();
|
||||||
const metadata = useSourcify(
|
const metadata = useSourcify(
|
||||||
txData?.to,
|
txData?.to,
|
||||||
|
@ -114,7 +108,6 @@ const TransactionPageContent: React.FC<TransactionPageContentProps> = ({
|
||||||
devDoc={metadata?.output.devdoc}
|
devDoc={metadata?.output.devdoc}
|
||||||
internalOps={internalOps}
|
internalOps={internalOps}
|
||||||
sendsEthToMiner={sendsEthToMiner}
|
sendsEthToMiner={sendsEthToMiner}
|
||||||
ethUSDPrice={blockETHUSDPrice}
|
|
||||||
/>
|
/>
|
||||||
}
|
}
|
||||||
/>
|
/>
|
||||||
|
|
|
@ -1,7 +1,6 @@
|
||||||
import React, { useContext, useMemo, useState } from "react";
|
import React, { useContext, useMemo, useState } from "react";
|
||||||
import { Tab } from "@headlessui/react";
|
import { Tab } from "@headlessui/react";
|
||||||
import { TransactionDescription } from "@ethersproject/abi";
|
import { TransactionDescription } from "@ethersproject/abi";
|
||||||
import { BigNumber } from "@ethersproject/bignumber";
|
|
||||||
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
|
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
|
||||||
import { faCheckCircle } from "@fortawesome/free-solid-svg-icons/faCheckCircle";
|
import { faCheckCircle } from "@fortawesome/free-solid-svg-icons/faCheckCircle";
|
||||||
import { faCube } from "@fortawesome/free-solid-svg-icons/faCube";
|
import { faCube } from "@fortawesome/free-solid-svg-icons/faCube";
|
||||||
|
@ -47,6 +46,7 @@ import { RuntimeContext } from "../useRuntime";
|
||||||
import { useContractsMetadata } from "../hooks";
|
import { useContractsMetadata } from "../hooks";
|
||||||
import { useTransactionError } from "../useErigonHooks";
|
import { useTransactionError } from "../useErigonHooks";
|
||||||
import { useChainInfo } from "../useChainInfo";
|
import { useChainInfo } from "../useChainInfo";
|
||||||
|
import { useETHUSDOracle } from "../usePriceOracle";
|
||||||
|
|
||||||
type DetailsProps = {
|
type DetailsProps = {
|
||||||
txData: TransactionData;
|
txData: TransactionData;
|
||||||
|
@ -56,7 +56,6 @@ type DetailsProps = {
|
||||||
devDoc?: DevDoc | undefined;
|
devDoc?: DevDoc | undefined;
|
||||||
internalOps?: InternalOperation[];
|
internalOps?: InternalOperation[];
|
||||||
sendsEthToMiner: boolean;
|
sendsEthToMiner: boolean;
|
||||||
ethUSDPrice: BigNumber | undefined;
|
|
||||||
};
|
};
|
||||||
|
|
||||||
const Details: React.FC<DetailsProps> = ({
|
const Details: React.FC<DetailsProps> = ({
|
||||||
|
@ -67,7 +66,6 @@ const Details: React.FC<DetailsProps> = ({
|
||||||
devDoc,
|
devDoc,
|
||||||
internalOps,
|
internalOps,
|
||||||
sendsEthToMiner,
|
sendsEthToMiner,
|
||||||
ethUSDPrice,
|
|
||||||
}) => {
|
}) => {
|
||||||
const hasEIP1559 =
|
const hasEIP1559 =
|
||||||
txData.confirmedData?.blockBaseFeePerGas !== undefined &&
|
txData.confirmedData?.blockBaseFeePerGas !== undefined &&
|
||||||
|
@ -90,6 +88,12 @@ const Details: React.FC<DetailsProps> = ({
|
||||||
const {
|
const {
|
||||||
nativeCurrency: { name, symbol },
|
nativeCurrency: { name, symbol },
|
||||||
} = useChainInfo();
|
} = useChainInfo();
|
||||||
|
|
||||||
|
const blockETHUSDPrice = useETHUSDOracle(
|
||||||
|
provider,
|
||||||
|
txData?.confirmedData?.blockNumber
|
||||||
|
);
|
||||||
|
|
||||||
const addresses = useMemo(() => {
|
const addresses = useMemo(() => {
|
||||||
const _addresses: ChecksummedAddress[] = [];
|
const _addresses: ChecksummedAddress[] = [];
|
||||||
if (txData.to) {
|
if (txData.to) {
|
||||||
|
@ -318,9 +322,12 @@ const Details: React.FC<DetailsProps> = ({
|
||||||
)}
|
)}
|
||||||
<InfoRow title="Value">
|
<InfoRow title="Value">
|
||||||
<FormattedBalance value={txData.value} /> {symbol}{" "}
|
<FormattedBalance value={txData.value} /> {symbol}{" "}
|
||||||
{!txData.value.isZero() && ethUSDPrice && (
|
{!txData.value.isZero() && blockETHUSDPrice && (
|
||||||
<span className="px-2 border-skin-from border rounded-lg bg-skin-from text-skin-from">
|
<span className="px-2 border-skin-from border rounded-lg bg-skin-from text-skin-from">
|
||||||
<ETH2USDValue ethAmount={txData.value} eth2USDValue={ethUSDPrice} />
|
<ETH2USDValue
|
||||||
|
ethAmount={txData.value}
|
||||||
|
eth2USDValue={blockETHUSDPrice}
|
||||||
|
/>
|
||||||
</span>
|
</span>
|
||||||
)}
|
)}
|
||||||
</InfoRow>
|
</InfoRow>
|
||||||
|
@ -409,11 +416,11 @@ const Details: React.FC<DetailsProps> = ({
|
||||||
<div className="space-y-3">
|
<div className="space-y-3">
|
||||||
<div>
|
<div>
|
||||||
<FormattedBalance value={txData.confirmedData.fee} /> {symbol}{" "}
|
<FormattedBalance value={txData.confirmedData.fee} /> {symbol}{" "}
|
||||||
{ethUSDPrice && (
|
{blockETHUSDPrice && (
|
||||||
<span className="px-2 border-skin-from border rounded-lg bg-skin-from text-skin-from">
|
<span className="px-2 border-skin-from border rounded-lg bg-skin-from text-skin-from">
|
||||||
<ETH2USDValue
|
<ETH2USDValue
|
||||||
ethAmount={txData.confirmedData.fee}
|
ethAmount={txData.confirmedData.fee}
|
||||||
eth2USDValue={ethUSDPrice}
|
eth2USDValue={blockETHUSDPrice}
|
||||||
/>
|
/>
|
||||||
</span>
|
</span>
|
||||||
)}
|
)}
|
||||||
|
@ -422,7 +429,7 @@ const Details: React.FC<DetailsProps> = ({
|
||||||
</div>
|
</div>
|
||||||
</InfoRow>
|
</InfoRow>
|
||||||
<InfoRow title={`${name} Price`}>
|
<InfoRow title={`${name} Price`}>
|
||||||
<USDValue value={ethUSDPrice} />
|
<USDValue value={blockETHUSDPrice} />
|
||||||
</InfoRow>
|
</InfoRow>
|
||||||
</>
|
</>
|
||||||
)}
|
)}
|
||||||
|
|
Loading…
Reference in New Issue