diff --git a/src/special/london/Blocks.tsx b/src/special/london/Blocks.tsx index e510d5d..e94f01e 100644 --- a/src/special/london/Blocks.tsx +++ b/src/special/london/Blocks.tsx @@ -22,6 +22,8 @@ import { RuntimeContext } from "../../useRuntime"; const MAX_BLOCK_HISTORY = 20; +const PREV_BLOCK_COUNT = 15; + const options: ChartOptions = { animation: false, plugins: { @@ -67,6 +69,11 @@ const Blocks: React.FC = ({ latestBlock, targetBlockNumber }) => { return; } + // Skip blocks before the hard fork during the transition + if (blockNumber < targetBlockNumber) { + return; + } + const extBlock = await readBlock(provider, blockNumber.toString()); setNow(Date.now()); setBlock((_blocks) => { @@ -85,7 +92,7 @@ const Blocks: React.FC = ({ latestBlock, targetBlockNumber }) => { return newBlocks; }); }, - [provider] + [provider, targetBlockNumber] ); useEffect(() => { @@ -110,6 +117,24 @@ const Blocks: React.FC = ({ latestBlock, targetBlockNumber }) => { }; }, [blocks]); + // On page reload, pre-populate the last N blocks + useEffect( + () => { + const addPreviousBlocks = async () => { + for ( + let i = latestBlock.number - PREV_BLOCK_COUNT; + i < latestBlock.number; + i++ + ) { + await addBlock(i); + } + }; + addPreviousBlocks(); + }, + // eslint-disable-next-line react-hooks/exhaustive-deps + [] + ); + return (