diff --git a/src/transaction/Details.tsx b/src/transaction/Details.tsx index 8c0d779..261e651 100644 --- a/src/transaction/Details.tsx +++ b/src/transaction/Details.tsx @@ -254,11 +254,7 @@ const Details: React.FC = ({
- +
diff --git a/src/transaction/NavNonce.tsx b/src/transaction/NavNonce.tsx index f17c5cc..236b30f 100644 --- a/src/transaction/NavNonce.tsx +++ b/src/transaction/NavNonce.tsx @@ -5,19 +5,17 @@ import { faChevronRight } from "@fortawesome/free-solid-svg-icons/faChevronRight import NavButton from "./NavButton"; import { ChecksummedAddress } from "../types"; import { RuntimeContext } from "../useRuntime"; -import { useTransactionBySenderAndNonce } from "../useErigonHooks"; +import { + useTransactionBySenderAndNonce, + useTransactionCount, +} from "../useErigonHooks"; type NavNonceProps = { sender: ChecksummedAddress; nonce: number; - latestBlockNumber: number | undefined; }; -const NavNonce: React.FC = ({ - sender, - nonce, - latestBlockNumber, -}) => { +const NavNonce: React.FC = ({ sender, nonce }) => { const { provider } = useContext(RuntimeContext); const prevTxHash = useTransactionBySenderAndNonce( provider, @@ -29,7 +27,12 @@ const NavNonce: React.FC = ({ sender, nonce + 1 ); - const lastTxHash = nextTxHash; + const count = useTransactionCount(provider, sender); + const lastTxHash = useTransactionBySenderAndNonce( + provider, + sender, + count !== undefined ? count - 1 : undefined + ); return (
@@ -38,13 +41,13 @@ const NavNonce: React.FC = ({ = latestBlockNumber} + disabled={count === undefined || nonce >= count - 1} > = latestBlockNumber} + disabled={count === undefined || nonce >= count - 1} > diff --git a/src/useErigonHooks.ts b/src/useErigonHooks.ts index d26fcd0..71b95cc 100644 --- a/src/useErigonHooks.ts +++ b/src/useErigonHooks.ts @@ -503,6 +503,30 @@ export const useTransactionError = ( return [errorMsg, data, isCustomError]; }; +export const useTransactionCount = ( + provider: JsonRpcProvider | undefined, + sender: ChecksummedAddress | undefined +): number | undefined => { + const [count, setCount] = useState(); + + useEffect(() => { + // Reset + setCount(undefined); + + if (provider === undefined || sender === undefined) { + return; + } + + const readCount = async () => { + const _count = await provider.getTransactionCount(sender); + setCount(_count); + }; + readCount(); + }, [provider, sender]); + + return count; +}; + export const useTransactionBySenderAndNonce = ( provider: JsonRpcProvider | undefined, sender: ChecksummedAddress | undefined,