# 38. Android App — Dashboard and Service Screens

meta:
  id: shieldai-unified-restructure-38
  feature: shieldai-unified-restructure
  priority: P1
  depends_on: [shieldai-unified-restructure-34, shieldai-unified-restructure-35, shieldai-unified-restructure-36, shieldai-unified-restructure-37]
  tags: [android, jetpack-compose, dashboard, services, mobile]

objective:
- Build the main dashboard and all service-specific screens for the Android app. These should mirror the web app's functionality while using native Android UI patterns (lists, cards, bottom sheets, charts).

deliverables:
- `android/app/src/main/java/com/shieldai/android/ui/screens/dashboard/` — Dashboard:
  - `DashboardScreen.kt` — Main dashboard with scrollable content:
    - Threat score circular gauge (custom Canvas composable)
    - Recent alerts list (top 5)
    - Service summary cards in horizontal scroll or grid
    - Quick action FABs or chips
    - Pull-to-refresh with `PullRefreshIndicator`
  - `AlertDetailScreen.kt` — Alert detail with correlated alerts
- `android/app/src/main/java/com/shieldai/android/ui/screens/services/` — Service screens:
  - `DarkWatchScreen.kt` — Watchlist and exposures
  - `VoicePrintScreen.kt` — Enrollments and analysis history
  - `SpamShieldScreen.kt` — Stats, rules, number check
  - `HomeTitleScreen.kt` — Properties, map, changes
  - `RemoveBrokersScreen.kt` — Broker registry, requests
- `android/app/src/main/java/com/shieldai/android/ui/screens/settings/` — Settings:
  - `SettingsScreen.kt` — Account, preferences, family, logout
- `android/app/src/main/java/com/shieldai/android/viewmodel/` — ViewModels:
  - `DashboardViewModel.kt`, `DarkWatchViewModel.kt`, `VoicePrintViewModel.kt`, etc.
  - Each exposes `StateFlow<UiState>` with Loading, Success, Error states

steps:
1. Create screen directories: `dashboard/`, `services/`, `settings/`.
2. **DashboardScreen**:
   - `LazyColumn` for scrollable content
   - Threat score: custom `Canvas` composable drawing circular arc with gradient
   - Alerts section: `LazyRow` or vertical list of `ShieldCard` items
   - Service cards: `LazyHorizontalGrid` or `Row` of compact cards
   - Quick actions: `FloatingActionButton` or `Row` of icon buttons
   - `PullRefreshIndicator` with `rememberPullRefreshState`
3. **AlertDetailScreen**:
   - `Column` with sections
   - Severity `ShieldBadge` at top
   - Description and metadata
   - Correlated alerts in nested list
   - Action buttons: "Mark Resolved", "False Positive"
4. **DarkWatchScreen**:
   - `LazyColumn` with sticky headers for sections
   - Watchlist items: swipe-to-delete with `SwipeToDismissBox`
   - Add button → bottom sheet with form
   - Exposures: tap to navigate to detail
5. **VoicePrintScreen**:
   - Enrollments section with audio playback (ExoPlayer or MediaPlayer)
   - "Enroll" FAB → bottom sheet with recording UI
   - Analysis list with verdict color coding
   - Recording UI: real-time waveform using `Canvas` + `AudioRecord`
6. **SpamShieldScreen**:
   - Stats cards at top in `Row`
   - Rules list with toggle switches
   - Number check: `ShieldTextField` + check button → result card
   - "Report spam" FAB
7. **HomeTitleScreen**:
   - Properties list with addresses
   - Add property: address search with geocoding
   - Property detail: Google Maps Compose or static map image
   - Snapshot history and changes list
8. **RemoveBrokersScreen**:
   - Broker registry with search and category chips
   - Request list with status badges and progress bars
   - Start removal: bottom sheet with broker selection and form
9. **SettingsScreen**:
   - `LazyColumn` with sections using `ListItem` or custom rows
   - Account info with avatar
   - Subscription card with upgrade button
   - Notification toggles
   - Theme selection dropdown
   - Biometric auth toggle
   - Family group management
   - Logout button with confirmation dialog
10. **ViewModels**:
    - Each screen has a `ViewModel` with `StateFlow<UiState>`
    - `UiState` sealed class: `Loading`, `Success(data)`, `Error(message)`
    - Call repository methods, handle errors, expose state
    - Use `viewModelScope.launch` for coroutines
11. Wire navigation in `AppNavigation.kt`:
    - Bottom nav routes to dashboard and services
    - Settings accessible from bottom nav or profile menu
    - Service screens accessible from dashboard or bottom nav submenu

steps:
- Unit: Each ViewModel emits correct states for loading/success/error
- Unit: DashboardViewModel aggregates data from multiple repositories
- Visual: All screens use theme tokens and adapt to dark mode
- E2E: Navigate through all service screens and verify data loads
- E2E: Perform CRUD operations (add watchlist item, delete enrollment, create rule)

acceptance_criteria:
- [ ] Dashboard displays threat score, alerts, service summaries, and quick actions
- [ ] All 5 service screens (DarkWatch, VoicePrint, SpamShield, HomeTitle, RemoveBrokers) load and display data
- [ ] Each service screen supports core CRUD operations
- [ ] Alert detail shows full information and correlation group
- [ ] Settings screen allows managing account, preferences, and family
- [ ] Pull-to-refresh updates dashboard data
- [ ] All screens show loading skeletons and empty states appropriately
- [ ] Navigation between screens works with native Android transitions

validation:
- Launch app, login, and verify dashboard renders with real data
- Tap each service tab and verify screen loads
- Add a watchlist item in DarkWatch and verify it appears in list
- Delete a voice enrollment and verify it disappears
- Create a spam rule and verify it applies
- Toggle settings and verify preferences persist
- Run `./gradlew test` for unit tests

notes:
- Use native Android patterns: `LazyColumn`/`LazyRow` for lists, `BottomSheet` for modals, `FloatingActionButton` for primary actions, `Chip` for filters.
- For the threat score gauge, draw an arc on `Canvas` using `drawArc` with a `SweepGradient` brush.
- The map in HomeTitle can use Google Maps Compose (`com.google.maps.android:maps-compose`) or OpenStreetMap.
- Voice recording requires microphone permission. Add `RECORD_AUDIO` permission to manifest and request at runtime.
- Keep ViewModels separate from UI for testability. ViewModels should own the state and business logic.
- Consider using `Paging 3` (`androidx.paging:paging-compose`) for large lists (e.g., alert history, exposure list).
- For image loading in lists, use Coil (`io.coil-kt:coil-compose`).
