Repository navigation
fix(frontend): back-button flash, network-switch leak, red incoming blocks, scroll drift - #38
Merged
Merged
Conversation
…locks, scroll drift Four user-reported bugs: 1. back button on any page shows a 400ms loading flash — caused by app/template.tsx re-keying per segment which replays the page-fade animation (opacity 0→1, staggered children) over content already in the React Query cache. Now a popstate listener flips a module- scoped flag; the template skips the fade class when the nav came from back/forward. Forward navigations still get the entrance. 2. switching networks on the home page leaves the previous network's blocks in the live panel for a beat. Caused by mergeTickIntoBootstrap in lib/api/explorer.ts: it ignored its closure-captured apiBase arg and asked firnQueryKey() for the key, which reads getApiBase() at call time. setApiBase() runs synchronously inside setNetwork() — before React commits the new state and tears down the old EventSource — so an in-flight tick from the OLD network builds a key against the NEW network and dumps testnet payload into local cache. Now we build the key directly from the captured apiBase. 3. red highlight on the latest block in /blocks LiveBlocksList — was var(--accent-soft) / var(--accent-ink) (red, hue 25°). Switched the nine occurrences to var(--good-soft) / var(--good) (green, hue 145°). 4. /blocks page felt like it was drifting downward as new blocks landed. useNowTick(100) re-rendered the whole page (huge animated headline, 50-row table, 3 charts, 4 KPIs, live list, fresh-row animations) ten times a second; scroll anchor disengaged under that re-render rate concurrent with running CSS animations. Lowered to the 1s default — formatRelativeTime rounds to whole seconds anyway.
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
1 participant
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.
Four user-reported bugs.
Fixes
app/template.tsxre-keys per segment so thepage-fadeanimation replays over cached content. Now skip the fade when nav came frompopstate.mergeTickIntoBootstrapignored its closure-capturedapiBaseand askedfirnQueryKey()(which readsgetApiBase()live), so an in-flight tick from the old network landed in the new network's cache. Use the captured arg.LiveBlocksListhead row → switched from--accent-soft/--accent-ink(red) to--good-soft/--good(green).useNowTick(100)was re-rendering the whole heavy page 10×/sec, disengaging scroll anchor mid-CSS-animation. Lowered to 1s default.Test plan
pnpm typecheck— cleanpnpm lint— cleanpnpm format:check— clean