Skip to content

skeleton loading and error boundaries for the milestones board #1105

Description

@mikewheeleer

Summary

The milestones board shows a blank flash while loading and a whole-page crash when a subtree throws. Add skeleton placeholders and scoped error boundaries so failures are contained and loading is graceful.

Why this matters

Blank flashes and full-page crashes are jarring and lose user context. Skeletons + boundaries keep the app resilient and calm.

Requirements

  • Add skeleton placeholders matching the milestones board layout during load.
  • Wrap independent milestones board subtrees in error boundaries with a retry.
  • A crash in one subtree doesn't take down the rest of the page.
  • Announce loading to assistive tech; no layout shift.

Technical guidance

  • Match skeleton dimensions to real content to avoid shift.
  • Log the boundary error for observability.

Edge cases — each must have a test

  • loading -> skeleton, then content
  • subtree throws -> only that section shows the error
  • retry -> re-renders the section
  • no layout shift on swap
  • loading announced

Acceptance criteria

  • All requirements and every edge case above implemented and covered by tests
  • New unit and integration tests; existing tests still pass and no regressions
  • Structured, typed errors (no leaked internals; stable codes)
  • npm run lint, npm test, and npm run build all pass locally
  • Code follows the repo's existing conventions; no duplication or dead code
  • Short docs/comments explaining the design and any non-obvious decisions
  • PR description explains the approach and includes Closes #<issue>

Out of scope

  • Global crash reporting UI
  • Server components migration

Rewards

Part of the GrantFox OSS / Official Campaign (FWC26) — this task may be rewarded. PR quality is assessed by AI: depth, correctness under edge cases, meaningful tests, and clean design are what earn the reward. Shallow changes (typos, formatting, trivial docs) do not qualify.

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

Type

No type

Projects

No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions