5.4 KiB
5.4 KiB
SwimBuddy
Swimming workout tracker with Apple Watch companion app. Expo 57 + React Native 0.86 + NativeWind v5 + Drizzle ORM + Swift Watch target.
Commands
npx expo start # Dev server
npx expo run:ios # Build & run on iOS
npx expo prebuild -p ios # Regenerate ios/ dir (safe — targets/ persists)
npx drizzle-kit generate # Regenerate SQL migrations after schema changes
No npm test or lint scripts exist yet. No babel.config.js — NativeWind v5 uses CSS-first config.
Project Structure
src/
features/<name>/screens/ # Screen components (registered in navigators)
features/<name>/components/# Feature-specific UI
features/<name>/hooks/ # Feature-specific hooks
components/ # Shared UI primitives (flat)
hooks/ # Shared hooks
navigation/ # React Navigation (RootNav, TabNav, feature stacks)
db/ # Drizzle schema, client, relations, operations
providers/ # DatabaseProvider, SettingsProvider (MMKV)
utils/ # formatTime, calculateSwolf, uuid, etc.
constants/ # strokes, poolLengths, colors
types/ # workout.ts, common.ts
modules/watch-connectivity/# Expo native module bridging WCSession
targets/watch/ # Apple Watch app (Swift/SwiftUI) — survives prebuild
Key Conventions
- Path aliases:
@/,@features/,@components/,@db/, etc. (tsconfig.json) - Feature-based folder structure with type-based shared layer
- NativeWind v5:
classNameprop, no babel config, CSS-first. UseclassNamenotStyleSheet classNametypes:nativewind-env.d.tsat root — don't delete- lightningcss pinned to 1.30.1 in package.json overrides — required by NativeWind v5
Watch Target
- Lives in
targets/watch/, NOT inios/— survivesexpo prebuild --clean - Config:
targets/watch/expo-target.config.js - Build: open
ios/SwimBuddy.xcworkspacein Xcode, select Watch scheme - Uses App Groups (
group.nl.guido-it.swimbuddy) for data sharing - WCSession for real-time messaging,
transferUserInfofor reliable offline sync - HealthKit for swim workout tracking (indoor swimming)
- Swift types
StoredWorkout,StoredSet,CompletedLapinWorkoutManager.swift
Database
- expo-sqlite + Drizzle ORM (SQLite dialect, expo driver)
- Schema:
src/db/schema.ts— tables: templates, workouts, sets, laps - Relations:
src/db/relations.ts - CRUD:
src/db/operations.ts - Client:
src/db/client.ts— exportsdbandDATABASE_NAME - Migrations in
drizzle/— generated bynpx drizzle-kit generate
WCSession Gotchas (Critical)
These are hard-won bugs that will waste hours if rediscovered:
NSNullcrashessendMessage: JSnullbecomesNSNullin ObjC, causingWCErrorCodePayloadUnsupportedTypes(Code 7010). Always stripnull/undefinedvalues before sending viacleanForWCSession().- Two delegate methods conflict: Having both
session(_:didReceiveMessage:)ANDsession(_:didReceiveMessage:replyHandler:)on the same delegate causes iOS to deliver neither. Watch usesdidReceiveMessage(no replyHandler); phone usesdidReceiveMessage:replyHandler:for bidirectional sync. isReachableis unreliable: Onlytruewhen both apps are foreground. Checksession.activationState == .activatedinstead for connection readiness.- Phone
sendMessagemust usereplyHandler: nil: Otherwise JS thread blocks waiting for a reply that watch never sends. Use fire-and-forget for workout plans; usetransferUserInfofor data sync. - Watch
suiteNamevsUserDefaults.standard: Watch only needs local storage, so useUserDefaults.standard— the App Groups suite name is only needed for phone↔watch shared data. - Phone
pendingEventspolling: Phone pollspollEvents()every 2s because Expo Modules'sendEventAPI doesn't work onAppContext. Watch data arrives viadidReceiveUserInfodelegate → stored inpendingEventsarray.
Watch ↔ Phone Data Flow
- Phone → Watch:
sendMessagewith workout plan (fire-and-forget, promise resolves immediately with["status":"sent"]) - Watch → Phone:
transferUserInfowith completed workout data (reliable, works in background) - Phone receives:
pollEvents()called from JS every 2s,saveWatchCompletedWorkout()writes to SQLite
UI Conventions
- Swipe-to-delete on lists uses
SwipeableRowcomponent (react-native-gesture-handler) - BuilderScreen pool length is a 25m/50m toggle (not read-only from settings)
- Templates and Stats features removed from navigation (DB schema preserved but UI deleted)
- Ionicons used for bottom tab icons (
@expo/vector-icons)
NativeWind v5 TextInput Crash
react-native-css has a bug where the textAlign mapping on TextInput causes a crash (path.split on boolean true). The fix is in src/utils/ — don't remove the workaround without testing TextInput rendering.
Gotchas
metro.config.jshas.sqlinsourceExts— required for Drizzle migration importsexpo prebuildclears and regeneratesios/by default. Use--no-cleanto preserve- Watch target compiles as separate Xcode target — not a RN module
react-native-cssis a NativeWind v5 peer dependency — don't remove@bacons/apple-targetsplugin must be in app.json plugins array
Expo Docs
Expo SDK 57: https://docs.expo.dev/versions/v57.0.0/