Skip to content

fix(docs): stop exporting non-component values from Fast Refresh boundaries - #94

Merged
randomdevpete merged 1 commit into
masterfrom
task-686-fast-refresh-constantly-breaking-on-live-edits
Aug 18, 2026
Merged

fix(docs): stop exporting non-component values from Fast Refresh boundaries#94
randomdevpete merged 1 commit into
masterfrom
task-686-fast-refresh-constantly-breaking-on-live-edits

Conversation

@randomdevpete

Copy link
Copy Markdown
Owner

Root cause

React Fast Refresh can only fast-refresh modules where every export is a React component. When a module exports both components and plain values (functions, constants, etc.), the module becomes ineligible for fast refresh, forcing full page reloads on every edit. This also wipes module-scope Jotai state.

Two docs modules were violating this pattern:

  1. DataGridApp.tsx: exported five helper functions (sortColumns, parseSort, stringifySort, filterWares, sortWares) alongside the component.
  2. Layout.tsx: exported githubRepoUrl constant alongside the component.

Fix

  • DataGridApp.tsx: Made all five exported helpers file-private. Verified no external consumers exist.
  • Layout.tsx: Extracted githubRepoUrl to a new packages/docs/src/layout/siteLinks.ts. Updated both internal consumers (DemoPage.tsx and Layout.tsx itself) to import from there. Removed the export from Layout.tsx.

Verification

  • Grep confirmed no external callers of the five DataGridApp helpers.
  • Grep confirmed all githubRepoUrl usage now points to siteLinks.

Style exceptions

None.

…daries

DataGridApp.tsx and Layout.tsx each mixed a React component export with
plain value/function exports in the same module. @vitejs/plugin-react's
Fast Refresh only preserves component state across HMR when a module
exports exclusively components; any other export in the same file makes
it ineligible, forcing a full reload (and, since several of these demos
hold state in module-scope jotai atoms, losing that state) on every edit.

DataGridApp.tsx's five helper exports (sortColumns, parseSort,
stringifySort, filterWares, sortWares) had no consumers outside the file,
so they're now file-private, matching the convention already used by the
other demo apps (e.g. BlogRoutingApp.tsx).

Layout.tsx's githubRepoUrl constant is genuinely shared (DemoPage.tsx also
needs it), so it moves to a new layout/siteLinks.ts module instead.

Ticket: 686
@randomdevpete
randomdevpete merged commit abfccd6 into master Aug 18, 2026
5 checks passed
@randomdevpete
randomdevpete deleted the task-686-fast-refresh-constantly-breaking-on-live-edits branch August 18, 2026 23:45
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant