Skip to content

As a developer I want to resolve React Compiler violations so the codebase is safe for concurrent rendering and future compiler adoption #160

@ChristopherRotnes

Description

@ChristopherRotnes

Summary

The CI lint step reports ~10 React Compiler rule violations across History, MuscleMap, and Report. These fall into three categories: calling setState synchronously inside a useEffect (can cause cascading renders in concurrent mode), accessing refs during render (refs are not stable during the render phase), and accessing variables before declaration. None cause visible bugs today under React 19 without the compiler enabled, but they are anti-patterns that can fail under concurrent rendering features and will become hard errors if the React Compiler is ever turned on.

Priority

Low — no current user impact; becomes blocking if React Compiler is adopted.

Acceptance criteria

  • History.jsx:65 — setState called synchronously in effect: refactor
  • History.jsx:235 — setState called synchronously in effect: refactor
  • MuscleMap.jsx:344 — setState called synchronously in effect: refactor
  • MuscleMap.jsx:179 (×3) — ref accessed during render: refactor
  • Report.jsx:101 — setState called synchronously in effect: refactor
  • Report.jsx:113 — setState called synchronously in effect: refactor
  • Report.jsx:114, 117 (×2) — variable accessed before declaration: refactor
  • npm run lint reports 0 React Compiler warnings after the change

Out of scope

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions