Skip to content

[6/5] Post‑E2E refactoring: hooks, memoization, context split, and accessibility tidy‑ups #16

@mfittko

Description

@mfittko

Parent: #7

Scope
Apply refactors after E2E coverage is green to simplify components, reduce re‑renders, and align with coding best practices.

Deliverables

  • GeometryCanvas
    • Extract hooks: useGridSync (external↔internal sync + drag guards), useFormulaSelection (point selection/navigation), useMeasurementsPanel (read/update)
    • Split render into ShapeLayers and FormulaLayer
    • Memoize heavy computations; wrap FormulaGraph/ShapeRenderer in React.memo
    • Replace magic numbers/timeouts with named constants (e.g., GRID_POSITION_DEBOUNCE_MS)
    • Centralize calibration/localStorage via helper
  • CanvasGrid
    • Debounce origin updates via small util; extract z‑index constants
  • ShareViewOptions context
    • Split isSharePanelOpen into separate context; memoize provider values; updateShareViewOption via useCallback
  • URL helpers
    • Consolidate boolean parsing utilities; ensure deterministic param ordering; unit tests for env‑overridden defaults (admin)
  • UnifiedSettingsModal / SharePanel
    • ARIA labels for icon buttons; lazy render tab content; extract ToggleRow/OptionRow
  • GlobalControls / Toolbar
    • Ensure accessible names; unify IconButton pattern; memoize handlers
  • Logging/ESLint
    • Gate verbose logs behind loggingEnabled/NODE_ENV; narrow react‑refresh overrides

Acceptance Criteria

  • No functional regressions; E2E remains green
  • Drag remains smooth (no remounts on drag); no snap‑back
  • Component tree size reduced; fewer renders on drag and toggle changes
  • Lint clean; unit tests added for new helpers

Metadata

Metadata

Assignees

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions