# RAG Data Uploader

This is a minimal React front‑end for your Retrieval‑Augmented Generation (RAG) school project. It allows you to:

- Fetch and list available subjects from the back‑end.
- Select a subject to view its details and list of lessons.
- Select a lesson and upload custom text (with an optional title) associated with that subject/lesson.

The client uses the API endpoints documented in your OpenAPI file:

- `GET /api/subjects/` — list available subjects
- `GET /api/lessons/?subject=<subject_id>` — list lessons for a subject
- `POST /api/upload-text` — upload a text payload for a subject/lesson

## Prerequisites

1. **Node.js** (≥14) installed on your machine.
2. The back‑end API running locally or remotely and accepting requests at a known base URL.

## Configuration

The front‑end expects an environment variable called `VITE_API_BASE_URL` to prefix API calls. If your API is served from `http://localhost:8000`, you would set:

```bash
export VITE_API_BASE_URL=http://localhost:8000
```

If you do not provide this environment variable the client assumes the API is served from the same origin as the front‑end (i.e. relative paths such as `/api/subjects/`).

To set local environment variables for Vite, you can create a `.env` file in the project root with the following content:

```
VITE_API_BASE_URL=http://localhost:8000
```

## Running the application

1. Install dependencies:

```bash
cd rag-data-frontend
npm install
```

2. Start the development server:

```bash
npm run dev
```

Vite will start a server (default port `3000`) and automatically open the app in your browser. Any changes you make to the source files will hot reload during development.

3. Build for production:

```bash
npm run build
```

The optimized, minified output will be placed in the `dist/` directory. You can serve these static files from any HTTP server.

## Customizing

This project was kept deliberately simple so you can adapt it to your needs:

* **Styling**: The default CSS is minimal. You can swap it out for Tailwind, Bootstrap or your own styles.
* **Fields**: The upload payload currently uses the lesson’s `chapter` property as the `lesson_number`. Adjust this logic in `src/App.jsx` if your API expects a different value.
* **Error handling**: Basic errors are surfaced under the form. You can extend this to surface more detailed error messages or integrate a notification library.

Happy coding!