diff --git a/src/BlockTransactions.tsx b/src/BlockTransactions.tsx
index f8a3bf9..4835fd3 100644
--- a/src/BlockTransactions.tsx
+++ b/src/BlockTransactions.tsx
@@ -36,26 +36,19 @@ const BlockTransactions: React.FC = () => {
const [totalTxs, txs] = useBlockTransactions(
provider,
- blockNumber.toNumber()
+ blockNumber.toNumber(),
+ pageNumber - 1,
+ PAGE_SIZE
);
- const page = useMemo(() => {
- if (!txs) {
- return undefined;
- }
- const pageStart = (pageNumber - 1) * PAGE_SIZE;
- return txs.slice(pageStart, pageStart + PAGE_SIZE);
- }, [txs, pageNumber]);
- const total = totalTxs;
-
document.title = `Block #${blockNumber} Txns | Otterscan`;
return (
diff --git a/src/useErigonHooks.ts b/src/useErigonHooks.ts
index 56677af..0c9c7c5 100644
--- a/src/useErigonHooks.ts
+++ b/src/useErigonHooks.ts
@@ -66,7 +66,9 @@ export const readBlock = async (
export const useBlockTransactions = (
provider: ethers.providers.JsonRpcProvider | undefined,
- blockNumber: number
+ blockNumber: number,
+ pageNumber: number,
+ pageSize: number
): [number | undefined, ProcessedTransaction[] | undefined] => {
const [totalTxs, setTotalTxs] = useState();
const [txs, setTxs] = useState();
@@ -79,6 +81,8 @@ export const useBlockTransactions = (
const readBlock = async () => {
const result = await provider.send("ots_getBlockTransactions", [
blockNumber,
+ pageNumber,
+ pageSize,
]);
const _block = provider.formatter.blockWithTransactions(
result.fullblock
@@ -139,7 +143,7 @@ export const useBlockTransactions = (
setTxs(processedTxs);
};
readBlock();
- }, [provider, blockNumber]);
+ }, [provider, blockNumber, pageNumber, pageSize]);
return [totalTxs, txs];
};