Skip to content

Mobile App Screens

The mobile app has 9 screens organized by feature area. Navigation uses a 3-tab bottom bar (Schedule, History, Profile) with push navigation for detail screens.

Authentication

Login Screen

File: lib/screens/auth/login_screen.dart

Email and password authentication form.

  • Email and password text fields with validation
  • Error message display for failed login attempts
  • Calls AuthService.login() on submission
  • On success, navigates to the main shell (Schedule tab)

Schedule

Schedule Screen

File: lib/screens/schedule/schedule_screen.dart
Tab: Schedule (first tab)

Displays upcoming cleaning jobs grouped by timeframe.

Features:

  • Grouped list — cleans organized into Today, This Week, and Later sections
  • Clean cards — show property name, session type, scheduled date, guest info, status badge
  • Claim — claim unassigned cleans (POST /sessions/claim)
  • Accept — accept assigned sessions (POST /sessions/:id/accept)
  • Request backup — ask for help on a session (POST /sessions/:id/request-backup)
  • Start session — tap an accepted clean to navigate to the active session screen
  • Pull to refresh — manually refresh the upcoming cleans list

Data source: GET /sessions/upcoming-cleans

Status badges:

Status Color
Pending Amber
Accepted Teal
In Progress Teal (dark)
Submitted Purple
Approved Green

Active Session

Active Session Screen

File: lib/screens/session/active_session_screen.dart
Route: /session (named route with sessionId argument)

The main cleaning workflow — the core of the mobile app.

Workflow per room:

  1. Before Photo — capture a photo of the room before cleaning
  2. Task Checklist — complete each cleaning task in the room
  3. After Photo — capture a photo after cleaning is complete
  4. Issue Photos (optional) — document any problems found

Features:

  • Room overview — shows all rooms with completion status
  • Free navigation — move between rooms in any order
  • Task completion — mark tasks done with optional quantity, supply flags, and notes
  • Photo upload — camera capture with 70% quality compression, uploaded as multipart form
  • Submit session — transition session to submitted status when all rooms are complete
  • Session timer — tracks elapsed time from start to finish

API calls:

  • GET /properties/:id/rooms/:roomId/tasks — fetch tasks per room
  • POST /photos/:roomCleanId — upload photo
  • POST /photos/:roomCleanId/tasks/:taskId/complete — mark task complete
  • PATCH /sessions/:id/status — update session status

Guest Rating Screen

File: lib/screens/session/guest_rating_screen.dart

Post-cleaning guest satisfaction rating, shown after session submission.

  • 5-star rating — tap to rate guest cleanliness (1–5 stars)
  • Optional notes — text field for additional comments
  • Submit — posts rating to POST /sessions/:id/rating
  • Automatically returns to the schedule screen after submission

History

Past Cleans Screen

File: lib/screens/history/past_cleans_screen.dart
Tab: History (second tab)

List of completed cleaning sessions.

Features:

  • Session list — submitted, approved, and rejected sessions
  • Status colors — green (approved), purple (submitted), red (rejected)
  • Guest rating — displays star rating if available
  • Tap to detail — navigates to the clean detail screen
  • Pull to refresh

Data source: GET /sessions?status=submitted,approved,rejected

Clean Detail Screen

File: lib/screens/history/clean_detail_screen.dart

Full breakdown of a completed cleaning session.

Sections:

  • Header — property name, session type, duration
  • Timeline — chronological events (created → started → finished → submitted → approved)
  • Room breakdown — per-room section with:
    • Before/after/issue photos (tap to open photo viewer)
    • Task completion status (completed/skipped per task)
  • Cleaner notes — notes added during the session
  • Guest rating — star rating and review text

Data source: GET /sessions/:id/detail

Standards

Standards Screen

File: lib/screens/standards/standards_screen.dart
Tab: Accessible from Profile

Read-only reference for cleaning checklists.

Features:

  • Standards list — available cleaning standards
  • Standard detail — tasks grouped by room type
  • Task info — label, category, frequency, high-touch flag

Data sources: GET /standards and GET /standards/:id

Profile

Profile Screen

File: lib/screens/profile/profile_screen.dart
Tab: Profile (third tab)

User information and app settings.

Features:

  • User info — name, email, role badge
  • About link — navigate to app info screen
  • Dev settings — WiFi override toggle (for testing without being on local network)
  • Logout button — signs out and returns to login screen

About Screen

File: lib/screens/profile/about_screen.dart

App information and open source details.

  • App version number
  • Open source attribution
  • GitHub repository link
  • GPL-3.0 license link

Common

Photo Viewer

File: lib/screens/common/photo_viewer.dart

Full-screen photo viewing used from the clean detail screen.

Features:

  • Carousel — swipe between photos in a room
  • Pinch-to-zoom — interactive zoom on photos
  • Page dots — indicator for current photo position
  • Metadata overlay — toggleable overlay showing photo type, taken date, upload date, and file size
AuthGate (root)
├── LoginScreen (unauthenticated)
└── MainShell (authenticated)
    ├── Tab 0: ScheduleScreen
    │   └── Push: ActiveSessionScreen → GuestRatingScreen
    ├── Tab 1: PastCleansScreen
    │   └── Push: CleanDetailScreen → PhotoViewer
    └── Tab 2: ProfileScreen
        ├── Push: StandardsScreen
        └── Push: AboutScreen
  • Tab navigation: IndexedStack preserves state across tabs
  • Named route: /session for active session (with sessionId argument)
  • Material routes: Push navigation for detail screens
  • Network check: Re-checks WiFi status when switching tabs