Applies a few Hook Model (trigger/action/reward/investment) patterns on top
of the existing swipe/match loop:
- Daily streak: a flame badge in the home header, backed by the new
checkin endpoint — an external trigger to return daily.
- Profile completeness meter + badge collection on the profile page
(client-computed from existing data) — the investment loop nudging
users to fill out bio/photos/answers.
- Bio editor on the profile page, shown on swipe cards and candidate
detail so profiles read richer.
- Catch the Hearts: a small tap mini-game (falling hearts, bonus items,
20s timer, persisted high score) shown instead of a dead end when the
discover feed runs out, so there's still a reason to stay in the app.
- Micro-animations: heart-burst on like, confetti on match, tap feedback
on all buttons (active:scale-95).
Fixed a React "purity" lint violation along the way (Math.random() can't
be called inside useMemo under this project's rules — moved to useState
lazy initializers, which run once on mount as intended).
- OnboardingScreen used min-h-dvh instead of h-dvh, so the scrollable content
area never actually clipped/scrolled internally; the page just grew and the
primary CTA button scrolled away with it instead of staying visible. Switch
to h-dvh and give each step's button a sticky footer (StepFooterButton).
- SwipeCard crashed with "Cannot read properties of null" when a candidate
had no photos, because the backend could return null instead of an empty
array; guard with optional chaining.
Phone+OTP auth, staged onboarding, admin-approval-gated home screen,
and the full discovery/match/chat UI (swipe deck with drag gestures,
match modal, profile detail, filters, messages/chat) wired to the
real backend, styled after a Figma dating-app UI kit.
Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
mobiniqow