# 💻 Divar Crawler Dashboard (React + Vite)

The frontend client for the **Intelligent Divar Ads Crawler**, built with React 18, Vite, Lucide React icons, and TailwindCSS.

---

## 🎨 Features & Capabilities

- **Crawler Management**: Dynamic form modal for creating and updating Divar crawl tasks (title, Divar search URL, AI prompt, interval, allowed hours window, Telegram channel, active status).
- **Manual Trigger**: Immediate execution button to test scraper and AI evaluation flows on-demand.
- **Ads Feed**: Filterable view of scraped ads displaying price, location, AI evaluation decision (`is_flagged`), confidence score, and extracted reasoning.
- **Execution History Logs**: Detailed execution run logs with status indicators (`RUNNING`, `SUCCESS`, `FAILED`) and error log modals.
- **System Health Indicator**: Real-time polling monitoring status of PostgreSQL database and Redis background broker.

---

## 🛠 Project Structure

```text
frontend/
├── src/
│   ├── App.jsx        # Main dashboard component handling tabs, modals, and API integration
│   ├── App.css        # Custom styles and glassmorphism styling
│   ├── index.css      # Tailwind & global font declarations
│   └── main.jsx       # React application entry point
├── Dockerfile         # Node 22 slim docker environment configuration
├── package.json       # Project dependencies & scripts
└── vite.config.js     # API proxy configuration (`/api` -> backend:8000 or 127.0.0.1:8000)
```

---

## 🚀 Running Locally

### Development Mode (Local Node)
```bash
npm install
npm run dev
```
The application will run at `http://localhost:5173/` and proxy API calls to `http://127.0.0.1:8000`.

### Production Build
```bash
npm run build
```

---

## 🐳 Docker Execution

The frontend is included as part of the multi-container stack in the root `docker-compose.yml`:
```bash
docker compose up frontend -d
```
Environment variable `VITE_BACKEND_URL=http://backend:8000` is automatically configured to route API traffic within the Docker network.