Screen Flows — Mobile App (React Native Dashboard)

Screen IDs reference the web dashboard screens defined in docs/apps/dashboard/screens.md.

The mobile app uses React Navigation with a bottom tab bar as the primary navigation structure. It targets the same API as the web dashboard and shares business logic via the monorepo.

MVP tabs: Home · Approvals · Activities · Chat · More
Persistent header: Bell icon (🔔) → Notifications screen, accessible from all tabs

1. Top-Level Navigation Structure

2. Bottom Tab — Home

3. Bottom Tab — Approvals

Action bar is pinned to the bottom of the screen. Approve, Reject, and Request Revision are always visible without scrolling past the content.

4. Bottom Tab — Activities

Activities list is read-only on mobile (list view only — no calendar, kanban, or grouped view). Tapping an activity opens its full output text.

5. Bottom Tab — Chat

Chat streams responses via SSE using a React Native EventSource polyfill. Same thread IDs as the web app — conversations are shared across platforms.

6. Bottom Tab — More

Note — Social Posts vs Approvals Queue are intentionally separate:

• Approvals tab — generic approval queue (blog posts, content, other agent outputs)
• Social Posts (More tab) — dedicated social media content screen with platform-specific previews (Instagram, LinkedIn, Facebook, X, TikTok)

7. Notifications Screen

The bell icon (🔔) is present in the header on every tab. It shows an unread badge count and opens the Notifications screen as a modal or pushed stack screen.

Behaviour:

• Badge count shown on bell icon; clears when screen is opened
• All notification types shown in a single chronological list
• Each row shows: icon, title, body, timestamp, read/unread state
• Tapping a row marks it as read and navigates to the relevant screen
• “Mark all as read” action available at the top
• Notifications are the same events that trigger push notifications (approval pending, agent completed, social post ready, agent error)

9. Client Context & Strategy (Read-Only Content)

Both Client Context (D12a) and Strategy (D2) follow the same read-only pattern on mobile.

No editing on mobile. Rejection/revision requests are not available for Context and Strategy on mobile — those flows remain on the web dashboard.

8. Deliverable Plan Screen (Goals + Deliverables)

Combines Goals (D3) and Deliverables (D5) into a single tabbed screen on mobile.

10. Push Notification Deep Links

Push notifications bypass tab navigation and deep-link directly to the relevant screen.

11. OAuth Channel Connect (Mobile)

The mobile app opens the system browser (not an in-app WebView) for OAuth to comply with provider restrictions (Google, LinkedIn).

12. Offline Behaviour

TanStack Query caches last-fetched data for offline reading. Approval submissions are queued locally and retried automatically on reconnect.