Extract custom hook; simplify code
This commit is contained in:
parent
9ff483e85b
commit
1ab77bb819
|
@ -1,10 +1,4 @@
|
||||||
import React, {
|
import React, { useState, useEffect, useMemo, useContext } from "react";
|
||||||
useState,
|
|
||||||
useEffect,
|
|
||||||
useCallback,
|
|
||||||
useMemo,
|
|
||||||
useContext,
|
|
||||||
} from "react";
|
|
||||||
import { Route, Switch, useParams } from "react-router-dom";
|
import { Route, Switch, useParams } from "react-router-dom";
|
||||||
import { BigNumber, ethers } from "ethers";
|
import { BigNumber, ethers } from "ethers";
|
||||||
import StandardFrame from "./StandardFrame";
|
import StandardFrame from "./StandardFrame";
|
||||||
|
@ -13,9 +7,10 @@ import Tab from "./components/Tab";
|
||||||
import Details from "./transaction/Details";
|
import Details from "./transaction/Details";
|
||||||
import Logs from "./transaction/Logs";
|
import Logs from "./transaction/Logs";
|
||||||
import erc20 from "./erc20.json";
|
import erc20 from "./erc20.json";
|
||||||
import { TokenMetas, TokenTransfer, TransactionData, Transfer } from "./types";
|
import { TokenMetas, TokenTransfer, TransactionData } from "./types";
|
||||||
import { RuntimeContext } from "./useRuntime";
|
import { RuntimeContext } from "./useRuntime";
|
||||||
import { SelectionContext, useSelection } from "./useSelection";
|
import { SelectionContext, useSelection } from "./useSelection";
|
||||||
|
import { useInternalTransfers } from "./useErigonHooks";
|
||||||
|
|
||||||
const TRANSFER_TOPIC =
|
const TRANSFER_TOPIC =
|
||||||
"0xddf252ad1be2c89b69c2b068fc378daa952ba7f163c4a11628f55a4df523b3ef";
|
"0xddf252ad1be2c89b69c2b068fc378daa952ba7f163c4a11628f55a4df523b3ef";
|
||||||
|
@ -110,7 +105,7 @@ const Transaction: React.FC = () => {
|
||||||
readBlock();
|
readBlock();
|
||||||
}, [provider, txhash]);
|
}, [provider, txhash]);
|
||||||
|
|
||||||
const [transfers, setTransfers] = useState<Transfer[]>();
|
const transfers = useInternalTransfers(provider, txData);
|
||||||
const sendsEthToMiner = useMemo(() => {
|
const sendsEthToMiner = useMemo(() => {
|
||||||
if (!txData || !transfers) {
|
if (!txData || !transfers) {
|
||||||
return false;
|
return false;
|
||||||
|
@ -124,29 +119,6 @@ const Transaction: React.FC = () => {
|
||||||
return false;
|
return false;
|
||||||
}, [txData, transfers]);
|
}, [txData, transfers]);
|
||||||
|
|
||||||
const traceTransfers = useCallback(async () => {
|
|
||||||
if (!provider || !txData) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
const r = await provider.send("ots_getTransactionTransfers", [
|
|
||||||
txData.transactionHash,
|
|
||||||
]);
|
|
||||||
const _transfers: Transfer[] = [];
|
|
||||||
for (const t of r) {
|
|
||||||
_transfers.push({
|
|
||||||
from: ethers.utils.getAddress(t.from),
|
|
||||||
to: ethers.utils.getAddress(t.to),
|
|
||||||
value: t.value,
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
setTransfers(_transfers);
|
|
||||||
}, [provider, txData]);
|
|
||||||
useEffect(() => {
|
|
||||||
traceTransfers();
|
|
||||||
}, [traceTransfers]);
|
|
||||||
|
|
||||||
const selectionCtx = useSelection();
|
const selectionCtx = useSelection();
|
||||||
|
|
||||||
return (
|
return (
|
||||||
|
|
|
@ -0,0 +1,21 @@
|
||||||
|
import { ethers } from "ethers";
|
||||||
|
import { TransactionData, Transfer } from "./types";
|
||||||
|
|
||||||
|
export const getTransactionTransfers = async (
|
||||||
|
provider: ethers.providers.JsonRpcProvider,
|
||||||
|
txData: TransactionData
|
||||||
|
) => {
|
||||||
|
const r = await provider.send("ots_getTransactionTransfers", [
|
||||||
|
txData.transactionHash,
|
||||||
|
]);
|
||||||
|
|
||||||
|
const _transfers: Transfer[] = [];
|
||||||
|
for (const t of r) {
|
||||||
|
_transfers.push({
|
||||||
|
from: ethers.utils.getAddress(t.from),
|
||||||
|
to: ethers.utils.getAddress(t.to),
|
||||||
|
value: t.value,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
return _transfers;
|
||||||
|
};
|
|
@ -0,0 +1,25 @@
|
||||||
|
import { ethers } from "ethers";
|
||||||
|
import { useState, useEffect } from "react";
|
||||||
|
import { getTransactionTransfers } from "./nodeFunctions";
|
||||||
|
import { TransactionData, Transfer } from "./types";
|
||||||
|
|
||||||
|
export const useInternalTransfers = (
|
||||||
|
provider: ethers.providers.JsonRpcProvider | undefined,
|
||||||
|
txData: TransactionData | undefined
|
||||||
|
) => {
|
||||||
|
const [transfers, setTransfers] = useState<Transfer[]>();
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
const traceTransfers = async () => {
|
||||||
|
if (!provider || !txData) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
const _transfers = await getTransactionTransfers(provider, txData);
|
||||||
|
setTransfers(_transfers);
|
||||||
|
};
|
||||||
|
traceTransfers();
|
||||||
|
}, [provider, txData]);
|
||||||
|
|
||||||
|
return transfers;
|
||||||
|
};
|
Loading…
Reference in New Issue