feat(network): add gas tendency chart on Network and Blocks pages#386
Open
MatiasOS wants to merge 5 commits into
Open
feat(network): add gas tendency chart on Network and Blocks pages#386MatiasOS wants to merge 5 commits into
MatiasOS wants to merge 5 commits into
Conversation
Adds a thin wrapper around eth_feeHistory on the NetworkAdapter base class that returns base fees (as bigint wei) and gas-used ratios as ready-to-plot values. Powers the upcoming gas tendency chart on the Network and Blocks pages.
EVM-gated React hook that fetches the last N blocks of fee history (default 50) and refreshes on a 10s cadence, matching useNetworkDashboard. Returns null for Bitcoin and Solana networks and captures errors without throwing.
Renders a 50-block gas tendency sparkline above the txs/blocks tables on the Network page and above the blocks table on the Blocks page. Custom SVG (no charting dependency) shows base fee as a line over gas-used % bars, with a hover tooltip and a dotted 50% reference line. Gated on dataService.isEVM() so it stays hidden on Bitcoin and Solana routes. Adds gasTendency keys to the network and block namespaces in all five locales (en, es, ja, pt-BR, zh).
Adds a placeholder spec under e2e/tests/shared/mocked/ following the same convention as nft-safety and rpc-strategy: documents what to mock (eth_feeHistory + supporting block/tx calls) and what to assert, with test.skip stubs until the phase 4 rpcMock helpers land.
Removes the chart subtitle JSX, the blockCount prop it relied on, its CSS class, and the gasTendency.subtitle translation key across all five locales. The chart's title plus the axis legend convey enough context.
|
🚀 Preview: https://pr-386--openscan.netlify.app |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Description
Adds a 50-block gas tendency sparkline above the txs/blocks tables on the Network page and above the blocks table on the Blocks page. Renders base fee (gwei) as a line over gas-used % bars, with a dotted 50% reference line, a hover tooltip (block number, base fee, gas used %), and a 10s auto-refresh. EVM-gated so it stays hidden on Bitcoin and Solana routes.
Related Issue
Closes #359
Type of Change
Changes Made
NetworkAdapter.getFeeHistory(blockCount, newestBlock)wrappingeth_feeHistoryand returning ready-to-plot values (bigint base fees in wei, decimal gas-used ratios). NewFeeHistorytype.useFeeHistoryhook with the same 10s cadence asuseNetworkDashboard, abort on unmount, null on non-EVM networks. Five unit tests.GasTendencyChart(custom inline SVG, no charting dependency) +GasTendencyChartSectionwrapper. Theme variables only, no hardcoded colors.<DashboardStats>) and src/components/pages/evm/blocks/index.tsx (before.table-wrapper).gasTendencyi18n keys added to thenetworkandblocknamespaces across all five locales (en, es, ja, pt-BR, zh).e2e/tests/shared/mocked/following the existingnft-safety/rpc-strategyconvention (test.skip stubs documenting what to mock and assert until the phase-4rpcMockhelpers land).Screenshots (if applicable)
To be added by reviewer or follow-up — local screenshots not captured in this iteration.
Checklist
npm run format:fixandnpm run lint:fixnpm run typecheckwith no errors (only pre-existing Solana baseline errors ondevremain — not introduced by this PR)npm run test:run(110 passing, including 5 newuseFeeHistorytests)Additional Notes
eth_feeHistoryinstead of fetching N blocks? One RPC call returns ~50 blocks of base fees + gas-used ratios — purpose-built for this and already in the worker'sALLOWED_EVM_METHODSallowlist.src/components/pages/settings/index.tsx:86(getAlchemyBtcUrlunused) is unrelated to this PR.