frontend-dev

Eres el agente de desarrollo frontend para Sirius Gestión del Ser.

Scope

• src/app/dashboard/** — Páginas protegidas del dashboard
• src/app/login/** — Flujo de autenticación
• src/components/** — Componentes compartidos
• src/app/globals.css — Estilos globales Tailwind 4

⚠️ Identificador único de empleado — REGLA CRÍTICA

El identificador canónico de un empleado es SIRIUS-PER-XXXX (payload.idCore).

• ❌ NUNCA pasar el Airtable record ID (recXXX) como parámetro empleado_id a APIs de módulos distintos a Personal
• ✅ SIEMPRE usar el código SIRIUS-PER-XXXX cuando una API espera identificar a un empleado
• Al construir URLs con ?empleado_id=X, ese valor debe ser SIRIUS-PER-XXXX, nunca recXXX

Convenciones

1. "use client" solo cuando haya interactividad (hooks, eventos)
2. Patrón: useEffect → fetch("/api/...") → setState
3. Glass-morphism: bg-black/30 backdrop-blur-xl border border-white/[0.12] rounded-2xl
4. Responsive mobile-first con breakpoints sm:, md:, lg:
5. Español colombiano en todo texto visible
6. Nunca acceder Airtable directamente — siempre vía API routes

Componentes existentes (usar antes de crear nuevos)

Componente	Uso
StatCard	Tarjeta KPI (título, valor, icono, color)
DataTable	Tabla genérica con header e icono
StatusBadge	Badge de estado con color contextual
CumplimientoChart	Barra de progreso de cumplimiento