Files
documente/frontend/README.md
Luca Sacchi Ricciardi b7ef07dd34 refactor: rename project from AgenticRAG to DocuMente
## Changes
- Update all references from AgenticRAG to DocuMente
- Update README.md with new project description and structure
- Update LICENSE with new project name
- Update API title and descriptions in main.py
- Update frontend components (Layout, Login, Dashboard, Settings)
- Update static HTML page
- Update all documentation files (prd-v2.md, frontend-plan.md, etc.)
- Update test files with new project name
- Update docker-compose.yml, Dockerfile, requirements.txt

## SEO Benefits
- DocuMente combines 'Documento' and 'Mente' (Italian for Document and Mind)
- Memorable and brandable name
- Reflects the core functionality: AI-powered document intelligence

🎉 Project officially renamed to DocuMente!
2026-04-06 13:54:57 +02:00

158 lines
3.6 KiB
Markdown

# DocuMente Frontend
Modern React-based web interface for DocuMente - Sistema di Retrieval Agentico con AI.
## 🚀 Features
- **Authentication**: API Key-based login
- **Dashboard**: System overview with stats and recent documents
- **Documents**: Drag & drop upload, document management
- **Chat**: Conversational interface with RAG and source citations
- **Settings**: Theme toggle (light/dark), LLM provider selection
- **Responsive**: Mobile-friendly design
## 🛠️ Tech Stack
- **React 18** - UI library
- **TypeScript** - Type safety
- **Vite** - Build tool
- **Tailwind CSS** - Styling
- **shadcn/ui** - UI components
- **Zustand** - State management
- **Axios** - HTTP client
- **React Router** - Routing
## 📦 Installation
```bash
cd frontend
npm install
```
## 🔧 Development
```bash
# Start development server
npm run dev
# Server runs at http://localhost:3000
```
## 🔨 Build
```bash
# Build for production
npm run build
# Preview production build
npm run preview
```
## 🌐 Environment Variables
Create `.env` file in frontend directory:
```env
VITE_API_URL=http://localhost:8000
```
## 📁 Project Structure
```
frontend/
├── src/
│ ├── components/
│ │ ├── layout/ # Layout components
│ │ └── ui/ # shadcn/ui components
│ ├── pages/ # Route pages
│ │ ├── Login.tsx
│ │ ├── Dashboard.tsx
│ │ ├── Documents.tsx
│ │ ├── Chat.tsx
│ │ └── Settings.tsx
│ ├── api/
│ │ └── client.ts # API client
│ ├── stores/
│ │ ├── authStore.ts
│ │ ├── chatStore.ts
│ │ └── settingsStore.ts
│ ├── types/
│ │ └── index.ts # TypeScript types
│ ├── lib/
│ │ └── utils.ts # Utility functions
│ ├── App.tsx
│ └── main.tsx
├── public/
├── index.html
├── package.json
├── tailwind.config.js
├── tsconfig.json
└── vite.config.ts
```
## 🔐 Authentication
The frontend supports API Key authentication:
1. Enter your API key on the login page
2. The key is stored in localStorage
3. Sent with every request via `X-API-Key` header
## 🎨 Customization
### Themes
- Edit `src/index.css` for CSS variables
- Toggle between light/dark/system in Settings
### API Configuration
- Update `vite.config.ts` proxy settings
- Or set `VITE_API_URL` environment variable
### Adding Components
```bash
# Install shadcn/ui component
npx shadcn-ui@latest add button
```
## 📝 Available Scripts
| Script | Description |
|--------|-------------|
| `npm run dev` | Start dev server |
| `npm run build` | Build for production |
| `npm run preview` | Preview production build |
| `npm run lint` | Run ESLint |
## 🔗 API Endpoints
The frontend connects to these API endpoints:
- `GET /api/health` - Health check
- `GET /api/v1/documents` - List documents
- `POST /api/v1/documents` - Upload document
- `DELETE /api/v1/documents/:id` - Delete document
- `POST /api/v1/query` - Query with RAG
- `POST /api/v1/chat` - Chat endpoint
- `GET /api/v1/providers` - List providers
- `GET /api/v1/config` - Get config
## 🐛 Troubleshooting
### Build Errors
If you see TypeScript errors about unused variables:
```bash
# Check for unused imports
npm run lint
```
### API Connection Issues
Make sure the backend is running on port 8000, or update the proxy in `vite.config.ts`.
### CORS Errors
The Vite dev server proxies `/api` requests to the backend. For production, ensure CORS is configured on the backend.
## 📄 License
Same as the main project.