User/README.md

# City Issue Reporter - Mobile App

A React Native + Expo mobile application for citizens to report city infrastructure issues with AI-powered classification and real-time tracking.

## Features

### Authentication
- **Google OAuth only** via Supabase Auth
- Secure session management with auto-refresh
- No anonymous reporting (prevents spam)

### Anti-Fraud Protection
- **Mandatory GPS**: Camera access blocked until GPS is enabled on device
- **GPS Precision Lock**: Captures blocked until GPS accuracy < 10 meters
- **Live Camera Only**: No gallery access - photos must be captured in real-time
- **Location Verification**: Continuous GPS monitoring during capture session

### Issue Reporting
- Live camera capture with frame guides
- Real-time GPS accuracy indicator
- AI-powered classification visualization
- Status: VisionAgent → GeoAgent → PriorityAgent → RoutingAgent → NotificationAgent

### Issue Tracking
- View all your reported issues
- Filter by status (Reported, In Progress, Resolved)
- Detailed issue view with:
  - Original vs AI-annotated image toggle
  - Priority and status badges
  - Confidence score visualization
  - Location details
  - Status timeline

### Profile & Gamification
- Civic badges and contribution stats
- Report history stats
- Settings management

## Tech Stack

- **Framework**: React Native + Expo (SDK 54)
- **Language**: TypeScript
- **Auth**: Supabase + Google OAuth
- **Camera**: expo-camera
- **Location**: expo-location
- **Navigation**: @react-navigation/native
- **Styling**: Custom dark theme with glassmorphism

## Prerequisites

- Node.js 18+
- npm or yarn
- Expo CLI
- Expo Go app on your device (for testing)
- Google OAuth configured in Supabase

## Installation

```bash
cd User
npm install
```

## Configuration

1. Update Supabase credentials in `src/config/supabase.ts`:
   - `SUPABASE_URL`: Your Supabase project URL
   - `SUPABASE_ANON_KEY`: Your Supabase anon key

2. Configure Google OAuth in Supabase Dashboard:
   - Enable Google provider
   - Add your OAuth client credentials

3. Update `app.json` with your bundle identifiers if needed

## Running the App

### Development
```bash
npx expo start
```

### iOS Simulator
```bash
npx expo start --ios
```

### Android Emulator
```bash
npx expo start --android
```

### Physical Device
Scan the QR code with Expo Go app

## Project Structure

```
src/
├── components/
│   ├── ui/
│   │   ├── Button.tsx       # Gradient button with variants
│   │   └── Card.tsx         # Glass/gradient card component
│   └── issues/
│       └── IssueCard.tsx    # Issue list item component
├── config/
│   └── supabase.ts          # Supabase client configuration
├── context/
│   └── AuthContext.tsx      # Auth state management
├── navigation/
│   └── AppNavigator.tsx     # Navigation structure
├── screens/
│   ├── auth/
│   │   └── LoginScreen.tsx  # Google OAuth login
│   ├── capture/
│   │   ├── CaptureScreen.tsx    # Camera with GPS enforcement
│   │   └── ProcessingScreen.tsx # AI agent progress
│   ├── home/
│   │   └── HomeScreen.tsx   # Dashboard
│   ├── issues/
│   │   ├── MyIssuesScreen.tsx   # Issue list
│   │   └── IssueDetailScreen.tsx # Issue details
│   └── profile/
│       └── ProfileScreen.tsx # User profile
├── services/
│   ├── issueService.ts      # API communication
│   └── locationService.ts   # GPS utilities
├── theme/
│   └── index.ts             # Colors, typography, spacing
└── types/
    └── index.ts             # TypeScript interfaces
```

## API Integration

The app connects to the Backend API at:
- Development: `http://10.0.2.2:8000` (Android emulator)
- Update `API_BASE_URL` in `src/config/supabase.ts` for other environments

## Backend Endpoints Used

- `POST /issues/stream` - Create issue with background processing
- `GET /issues` - List issues with pagination
- `GET /issues/{id}` - Get issue details
- `GET /flow/flow/{id}` - SSE stream for agent progress

## Building for Production

### EAS Build (Recommended)
```bash
npx eas build --platform all
```

### Local Build
```bash
npx expo run:android
npx expo run:ios
```

## License

Part of the Autonomous City Issue Resolution Agent project.