This is a Next.js project bootstrapped with create-next-app.

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

git clone <tu-repo>
cd trello_fake

2. Instalar dependencias

npm install

3. Configurar variables de entorno

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

# 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

npm run dev

Abre http://localhost:3000 en tu navegador.

---

📊 Datos de Prueba

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

# 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

---

🏗️ 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

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 - Guías para agentes de IA y arquitectura del proyecto
• 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 - learn about Next.js features and API.
• Learn Next.js - an interactive Next.js tutorial.
• Dolibarr API Documentation - Dolibarr REST API reference.