Exercises

# ===== Exercise 1: Tabbed shell with deep links =====
# - Build a Tab1, Tab2, Tab3 layout with ion-tabs
# - Deep link Tab2 to /tabs/orders/:id
# - Render the :id on Tab2 inside an ion-card
# Pass condition: visiting /tabs/orders/42 shows id=42 on Tab2

# ===== Exercise 2: Form with reactive validation =====
# - Reactive form: email, password (min 8, 1 digit), confirm
# - Inline errors via ion-note color="danger" only on touched/dirty
# - Disable Submit until valid
# Pass condition: form rejects 'a@b' + '12345678' but accepts 'a@b.co' + 'abcd1234'

# ===== Exercise 3: Capacitor camera =====
# - Capacitor.getPhoto({ source: CameraSource.Camera, resultType: Uri })
# - Show the preview in <ion-img>
# - Save the last 5 photos in a list (in-memory is fine)
# Pass condition: taking a 6th photo evicts the oldest

# ===== Exercise 4: Dark mode toggle with persistence =====
# - ion-toggle in Settings flips document.body.classList.toggle('dark')
# - Persist with Capacitor Preferences
# - Read preference on app boot before first paint
# Pass condition: kill + relaunch keeps the chosen mode

# ===== Exercise 5: Offline list cache =====
# - Fetch /api/products on mount
# - Cache to Preferences on success; render from cache when fetch fails
# - Show a 'Offline (cached <ago>)' ion-chip when cache is used
# Pass condition: airplane mode -> list still loads

# ===== Exercise 6: Infinite scroll =====
# - ion-infinite-scroll loads next page when within 10% of bottom
# - Stop loading when API returns empty page
# - Pull-to-refresh resets to page 1
# Pass condition: scroll halts cleanly at end of data

# ===== Self-test =====
# - On device: capacitor build + run on a real phone (emulator hides plenty)
# - Toggle dark / light, kill, relaunch
# - Throttle to 'Slow 3G' and exercise offline cache
# - Run ionic build --prod and check bundle < 1.5MB

// Fill in: <ion-____ color="primary">Tap</ion-____>