Search

Search components, tokens, patterns, architecture

Patterns

Error States

Errors never block reading, and logging degrades to local storage. The system's local-first architecture means the worst case is 'saved locally, will sync later' — and the UI says exactly that.

Drive unreachableSync error

Saved locally ✓

The worst case: data safe, status honest, no ceremony

Rules

  1. 01Field validation: red border + helper label, focus moves to the field.
  2. 02Save/sync failure: toast “Saved locally ✓” + red sync dot; auto-retry next sync. Data is never lost.
  3. 03Auth failure: remain on splash / show auth banner; retry available.
  4. 04Wearable import failure: SyncProgressModal error state; re-run from Profile drawer.

Examples

Offline save

User logs sleep on a plane → “Saved locally ✓” → amber dot → lands, opens app, dot turns green. Zero ceremony.

Anti-patterns

What breaks this pattern

  • Modal error dialogs for recoverable failures
  • Losing input on validation errors
  • Red full-screen states

Do

  • ·Keep errors at the scope of what failed
  • ·Pair every error with its recovery path

Don't

  • ·Block the dashboard on any failure
  • ·Use alarmist language