This is a [Next.js](https://nextjs.org) project bootstrapped with [`create-next-app`](https://nextjs.org/docs/app/api-reference/cli/create-next-app).

![Preview](image.png)

## Dashboard de Proyectos Dolibarr

Aplicación web moderna para visualizar y gestionar proyectos de Dolibarr con una interfaz intuitiva y profesional.

### ✨ Características

- 📊 Vista de proyectos en Grid y Lista
- 🎨 Modo oscuro completo
- 📱 Diseño responsive
- 🔍 Búsqueda en tiempo real
- 📈 Estadísticas y KPIs
- 🔐 API segura (API key protegida en el backend)
- ⚡ Skeletons loading para mejor UX
- 📄 Página de detalle completa para cada proyecto

---

## 🚀 Getting Started

### Requisitos previos

- Node.js 18+
- Dolibarr con API habilitada
- Docker (opcional, para Dolibarr)

### Instalación

1. **Clonar el repositorio**
```bash
git clone <tu-repo>
cd trello_fake
```

2. **Instalar dependencias**
```bash
npm install
```

3. **Configurar variables de entorno**

Crea un archivo `.env.local` en la raíz:

```bash
# API de Dolibarr (segura - solo servidor)
DOLIBARR_API_URL=http://localhost:8200/api/index.php
DOLIBARR_API_KEY=tu-api-key-aqui

# Variables públicas
NEXT_PUBLIC_DOLIBARR_USER_ID=2
```

4. **Iniciar el servidor de desarrollo**
```bash
npm run dev
```

Abre [http://localhost:3000](http://localhost:3000) en tu navegador.

---

## 📊 Datos de Prueba

Si no tienes proyectos en tu Dolibarr, puedes generar datos de prueba:

```bash
# Con el servidor corriendo (npm run dev)
npm run seed
```

Este comando creará 12 proyectos de ejemplo con:
- Diferentes estados de progreso (0% - 100%)
- Presupuestos variados (€28k - €120k)
- Descripciones detalladas
- Fechas realistas

Ver más detalles en [scripts/README.md](scripts/README.md)

---

## 🏗️ Estructura del Proyecto

```
/
├── app/                          # Next.js App Router
│   ├── api/dolibarr/[...path]/  # API Route proxy (protege la API key)
│   ├── proyectos/[id]/          # Página de detalle de proyecto
│   ├── layout.tsx               # Layout principal
│   └── page.tsx                 # Página de inicio
├── components/
│   ├── dashboard/               # Componentes del dashboard
│   ├── ui/                      # Componentes shadcn/ui
│   ├── theme-provider.tsx       # Provider de tema
│   └── theme-toggle.tsx         # Toggle de modo oscuro
├── lib/                         # Utilidades y servicios
│   ├── dolibarrClient.ts       # Cliente de API
│   ├── projectsService.ts      # Servicio de proyectos
│   └── usersService.ts         # Servicio de usuarios
├── types/                       # Definiciones TypeScript
└── scripts/                     # Scripts de utilidad
```

---

## 🛠️ Scripts Disponibles

```bash
npm run dev          # Servidor de desarrollo
npm run build        # Build de producción
npm run start        # Servidor de producción
npm run lint         # Ejecutar ESLint
npm run seed         # Crear proyectos de prueba
```

---

## 🎨 Tecnologías

- **Framework:** Next.js 16 (App Router)
- **Lenguaje:** TypeScript 5
- **UI:** shadcn/ui + Radix UI
- **Estilos:** Tailwind CSS
- **Iconos:** Lucide React
- **Tema:** next-themes
- **API:** Dolibarr REST API

---

## 🔐 Seguridad

La aplicación implementa las siguientes medidas de seguridad:

- ✅ API key protegida en el servidor (NO expuesta al cliente)
- ✅ API Route proxy para todas las llamadas a Dolibarr
- ✅ Variables de entorno seguras
- ✅ Validación de datos de entrada

---

## 📖 Documentación Adicional

- [AGENTS.md](AGENTS.md) - Guías para agentes de IA y arquitectura del proyecto
- [scripts/README.md](scripts/README.md) - Documentación de scripts de utilidad

---

## 🐛 Troubleshooting

### Error: "Cannot connect to Dolibarr"
- Verifica que Dolibarr esté corriendo
- Revisa la URL en `.env.local`
- Comprueba que la API esté habilitada en Dolibarr

### No se muestran proyectos
- Ejecuta `npm run seed` para crear datos de prueba
- Verifica las credenciales de la API
- Revisa la consola del navegador para errores

### Modo oscuro no funciona
- Limpia la caché del navegador
- Verifica que ThemeProvider esté envolviendo la app

---

## 📝 Credenciales de Dolibarr (Demo)

username: admin
password: p4ssw0rd

---

## 🤝 Contribuir

Las contribuciones son bienvenidas. Por favor:

1. Fork el proyecto
2. Crea una rama para tu feature (`git checkout -b feature/AmazingFeature`)
3. Commit tus cambios (`git commit -m 'Add: AmazingFeature'`)
4. Push a la rama (`git push origin feature/AmazingFeature`)
5. Abre un Pull Request

---

## 📄 Licencia

Este proyecto es privado y de uso interno.

---

## Learn More

To learn more about Next.js, take a look at the following resources:

- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
- [Dolibarr API Documentation](https://wiki.dolibarr.org/index.php/Module_Web_Services_API_REST_(v1)) - Dolibarr REST API reference.