# API Integration Documentation

## Login and OTP Verification Flow

### 1. Login API
- **Endpoint**: `POST /api/login`
- **Request Body**:
  ```json
  {
    "id": "23001005",
    "password": "Pushpak@2025"
  }
  ```
- **Response**:
  ```json
  {
    "responseCode": "0",
    "responseDesc": "If the user exists, an OTP will be sent to the registered user's phone. 4 attempts remain."
  }
  ```

### 2. OTP Verification API
- **Endpoint**: `POST /api/verify-otp`
- **Request Body**:
  ```json
  {
    "id": "23001005",
    "otp": "123456"
  }
  ```
- **Expected Response**:
  ```json
  {
    "responseCode": "0",
    "responseDesc": "OTP verified successfully"
  }
  ```

## Component Flow

1. **LoginPage**: User enters Login ID (numbers only) and password
2. **Validation**: Login ID must contain only numbers (max 8 digits)
3. **API Call**: Login request sent to `/api/login`
4. **OTP Screen**: If successful, OTP verification screen is shown
5. **OTP Input**: User enters 6-digit OTP code
6. **Verification**: OTP verified via `/api/verify-otp`
7. **Success**: User redirected to dashboard

## Features

- **Number-only validation** for Login ID
- **Maximum length restriction** (8 digits)
- **Paste filtering** to remove non-numeric characters
- **Real-time validation** with error clearing
- **Resend OTP** functionality with cooldown timer
- **Responsive design** with consistent styling
- **Error handling** for all API responses

## Security Features

- **Input sanitization** for Login ID
- **Pattern validation** using HTML5 attributes
- **Client-side validation** before API calls
- **Proper error handling** without exposing sensitive information

## Usage

1. Navigate to `/login`
2. Enter Login ID (numbers only)
3. Enter password
4. Submit login form
5. Enter OTP code when prompted
6. Access dashboard upon successful verification
