[TASK-2026-02-03-AUDITORIA-FRONTEND-UX-UI] docs: Add frontend UX/UI audit task planning
CAPVED Analysis: - C: Documented current frontend state (56 pages, 28 components, 24 hooks) - A: Identified 12 gaps across 4 priority levels (P0-P3) - P: Created 4-sprint plan with 12 subtasks (49 SP total) Gaps identified: - P0: RBAC, Audit, Notifications frontend incomplete - P1: Portfolio, MLM, Goals UI missing (hooks exist) - P2: WCAG 2.1 at 67%, tests coverage low - P3: Documentation outdated, archive cleanup needed Files created: - METADATA.yml - FASE-CAPVED-CONTEXTO.md - FASE-CAPVED-ANALISIS.md - PLAN-SUBTAREAS-FRONTEND.md Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
parent
fd12ab6b6d
commit
ea1ad056de
@ -0,0 +1,394 @@
|
||||
# FASE A: ANÁLISIS - Auditoría Frontend/UX-UI
|
||||
|
||||
**ID:** TASK-2026-02-03-AUDITORIA-FRONTEND-UX-UI
|
||||
**Fecha:** 2026-02-03
|
||||
**Estado:** COMPLETADA
|
||||
**SP Ejecutados:** 13
|
||||
|
||||
---
|
||||
|
||||
## 1. ANÁLISIS DE COHERENCIA
|
||||
|
||||
### 1.1 Backend → Frontend (Por Módulo)
|
||||
|
||||
| Módulo | Endpoints Backend | API Frontend | UI Pages | Coherencia |
|
||||
|--------|-------------------|--------------|----------|------------|
|
||||
| Auth | 21 | 15 | 4 | 71% |
|
||||
| Users | 8 | 8 | 1 | 100% |
|
||||
| Tenants | 12 | 8 | 2 | 67% |
|
||||
| Billing | 25 | 12 | 1 | 48% |
|
||||
| Sales | 36 | 36 | 6 | **100%** |
|
||||
| Commissions | 37 | 37 | 5 | **100%** |
|
||||
| Portfolio | 21 | 0 | 0 | **0%** |
|
||||
| MLM | 29 | 29 | 0 | **0%** |
|
||||
| Goals | 22 | 22 | 0 | **0%** |
|
||||
| Audit | 8 | 2 | 1 | 25% |
|
||||
| RBAC | 14 | 0 | 0 | **0%** |
|
||||
| Notifications | 17 | 8 | 1 | 47% |
|
||||
| Webhooks | 10 | 10 | 1 | 100% |
|
||||
| Storage | 12 | 12 | 1 | 100% |
|
||||
| Feature Flags | 8 | 8 | 1 | 100% |
|
||||
| AI | 6 | 6 | 1 | 100% |
|
||||
| WhatsApp | 8 | 8 | 1 | 100% |
|
||||
|
||||
### 1.2 Análisis de Gaps Críticos
|
||||
|
||||
```
|
||||
┌────────────────────────────────────────────────────────────────┐
|
||||
│ COHERENCIA POR CAPA │
|
||||
├────────────────────────────────────────────────────────────────┤
|
||||
│ Backend (328 endpoints) │
|
||||
│ │ │
|
||||
│ ▼ │
|
||||
│ API Services Frontend (190 funciones) ← 58% cobertura │
|
||||
│ │ │
|
||||
│ ▼ │
|
||||
│ Hooks (53+ funciones) ← 100% de APIs cubiertas │
|
||||
│ │ │
|
||||
│ ▼ │
|
||||
│ Páginas UI (56) ← GAPS en MLM, Goals, Portfolio, RBAC │
|
||||
└────────────────────────────────────────────────────────────────┘
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 2. GAPS IDENTIFICADOS POR PRIORIDAD
|
||||
|
||||
### 2.1 P0 - Críticos (Bloquean Funcionalidad Core)
|
||||
|
||||
| ID | Gap | Impacto | Endpoints | SP Estimados |
|
||||
|----|-----|---------|-----------|--------------|
|
||||
| GAP-FE-01 | Audit sin UI completa | Admin no puede ver logs | 8 | 3 |
|
||||
| GAP-FE-02 | RBAC sin frontend | No hay gestión de roles | 14 | 5 |
|
||||
| GAP-FE-03 | Notifications incompleto | Configuración limitada | 17 | 3 |
|
||||
| **Total P0** | | | **39** | **11** |
|
||||
|
||||
**Detalle GAP-FE-01 (Audit):**
|
||||
- Falta: Filtros avanzados, exportación, gráficos de actividad
|
||||
- Tiene: Lista básica de logs
|
||||
- Componentes existentes: AuditLogRow, AuditFilters, AuditStatsCard
|
||||
- Acción: Completar AuditLogsPage con filtros y stats
|
||||
|
||||
**Detalle GAP-FE-02 (RBAC):**
|
||||
- Falta: 100% de UI
|
||||
- Tiene: 0% (Solo guards de protección)
|
||||
- Acción: Crear RolesPage, PermissionsPage, RoleAssignmentsPage
|
||||
|
||||
**Detalle GAP-FE-03 (Notifications):**
|
||||
- Falta: Gestión de templates, configuración por canal
|
||||
- Tiene: NotificationBell, NotificationDrawer básico
|
||||
- Acción: Completar NotificationsManagementPage
|
||||
|
||||
### 2.2 P1 - Altos (Módulos Comerciales Sin UI)
|
||||
|
||||
| ID | Gap | Hooks Disponibles | Páginas Faltantes | SP Estimados |
|
||||
|----|-----|-------------------|-------------------|--------------|
|
||||
| GAP-FE-04 | Portfolio sin UI | 21 funciones | 4-6 páginas | 5 |
|
||||
| GAP-FE-05 | MLM sin UI | 18 funciones | 7 páginas | 8 |
|
||||
| GAP-FE-06 | Goals sin UI | 14 funciones | 7 páginas | 8 |
|
||||
| **Total P1** | | **53 funciones** | **18-20 páginas** | **21** |
|
||||
|
||||
**Detalle GAP-FE-04 (Portfolio):**
|
||||
```
|
||||
Páginas a crear:
|
||||
├── CategoriesPage.tsx → useCategories(), useCategoryTree()
|
||||
├── CategoryDetailPage.tsx → useCategory(id), useCreateCategory(), etc.
|
||||
├── ProductsPage.tsx → useProducts(), filters
|
||||
├── ProductDetailPage.tsx → useProduct(id), variants, prices
|
||||
├── ProductFormPage.tsx → useCreateProduct(), useUpdateProduct()
|
||||
└── (Opcional) PricesPage.tsx → useProductPrices()
|
||||
```
|
||||
|
||||
**Detalle GAP-FE-05 (MLM):**
|
||||
```
|
||||
Páginas a crear:
|
||||
├── MLMDashboardPage.tsx → Métricas, resumen de red
|
||||
├── StructuresPage.tsx → useStructures(), crear/editar
|
||||
├── StructureDetailPage.tsx → useStructure(id), visualización árbol
|
||||
├── NodesPage.tsx → useNodes(), grid con filtros
|
||||
├── NodeDetailPage.tsx → useNode(id), downlines, comisiones
|
||||
├── RanksPage.tsx → useRanks(), requisitos por nivel
|
||||
└── MyNetworkPage.tsx → useMyNetwork(), árbol personal
|
||||
```
|
||||
|
||||
**Detalle GAP-FE-06 (Goals):**
|
||||
```
|
||||
Páginas a crear:
|
||||
├── GoalsDashboardPage.tsx → KPIs, progreso general
|
||||
├── DefinitionsPage.tsx → useGoalDefinitions(), CRUD
|
||||
├── DefinitionDetailPage.tsx → useGoalDefinition(id), assignments
|
||||
├── AssignmentsPage.tsx → useGoalAssignments(), filtros
|
||||
├── AssignmentDetailPage.tsx → useGoalAssignment(id), progress logs
|
||||
├── MyGoalsPage.tsx → useMyGoals(), metas personales
|
||||
└── ReportsPage.tsx → useGoalReports(), exportación
|
||||
```
|
||||
|
||||
### 2.3 P2 - Medios (Mejoras de Calidad)
|
||||
|
||||
| ID | Gap | Descripción | Archivos Afectados | SP |
|
||||
|----|-----|-------------|-------------------|-----|
|
||||
| GAP-FE-07 | Documentación páginas | 11 páginas sin spec | docs/05-frontend/ | 3 |
|
||||
| GAP-FE-08 | WCAG 2.1 AA | 67% → 90% | ~20 componentes | 5 |
|
||||
| GAP-FE-09 | Tests unitarios | Cobertura <50% | __tests__/ | 5 |
|
||||
| GAP-FE-10 | usePortfolio dead code | 21 funciones sin uso | hooks/usePortfolio.ts | 1 |
|
||||
| **Total P2** | | | | **14** |
|
||||
|
||||
**Detalle GAP-FE-08 (Accesibilidad):**
|
||||
|
||||
| Aspecto | Estado Actual | Objetivo | Acción |
|
||||
|---------|---------------|----------|--------|
|
||||
| Semantic HTML | 70% | 95% | Reemplazar div→button, etc. |
|
||||
| ARIA labels | 60% | 90% | Agregar aria-label en iconos |
|
||||
| Keyboard nav | 75% | 95% | Focus management en modales |
|
||||
| Color contrast | 80% | 100% | Ajustar colores Tailwind |
|
||||
| Focus visible | 65% | 100% | Agregar focus:ring en todos |
|
||||
|
||||
### 2.4 P3 - Bajos (Limpieza)
|
||||
|
||||
| ID | Gap | Descripción | Acción | SP |
|
||||
|----|-----|-------------|--------|-----|
|
||||
| GAP-FE-11 | Docs obsoletos | 57 archivos | Purgar _archive/ | 1 |
|
||||
| GAP-FE-12 | Specs desactualizadas | FRONTEND-*.md | Actualizar | 2 |
|
||||
| **Total P3** | | | | **3** |
|
||||
|
||||
---
|
||||
|
||||
## 3. ANÁLISIS DE COMPONENTES
|
||||
|
||||
### 3.1 Componentes Existentes vs Requeridos
|
||||
|
||||
| Categoría | Existentes | Requeridos | Gap |
|
||||
|-----------|------------|------------|-----|
|
||||
| Auth | 1 (OAuthButtons) | 1 | 0 |
|
||||
| AI | 3 | 3 | 0 |
|
||||
| Analytics | 2 | 4 | 2 |
|
||||
| Audit | 4 | 6 | 2 |
|
||||
| Common | 2 | 5 | 3 |
|
||||
| Feature Flags | 3 | 3 | 0 |
|
||||
| Notifications | 5 | 7 | 2 |
|
||||
| Storage | 4 | 4 | 0 |
|
||||
| Webhooks | 3 | 3 | 0 |
|
||||
| WhatsApp | 1 | 1 | 0 |
|
||||
| **MLM** | **0** | **8** | **8** |
|
||||
| **Goals** | **0** | **6** | **6** |
|
||||
| **Portfolio** | **0** | **7** | **7** |
|
||||
| **RBAC** | **0** | **5** | **5** |
|
||||
| **Total** | **28** | **62** | **34** |
|
||||
|
||||
### 3.2 Componentes Faltantes Detallados
|
||||
|
||||
**MLM (8 componentes):**
|
||||
- StructureCard
|
||||
- StructureForm
|
||||
- NetworkTree (visualización árbol)
|
||||
- NodeCard
|
||||
- RankBadge
|
||||
- CommissionsSummary
|
||||
- DownlineList
|
||||
- MLMDashboardStats
|
||||
|
||||
**Goals (6 componentes):**
|
||||
- GoalCard
|
||||
- GoalForm
|
||||
- ProgressBar (custom con milestones)
|
||||
- GoalAssignmentCard
|
||||
- ProgressLogList
|
||||
- GoalsKPIGrid
|
||||
|
||||
**Portfolio (7 componentes):**
|
||||
- CategoryTree
|
||||
- CategoryForm
|
||||
- ProductCard
|
||||
- ProductForm
|
||||
- VariantList
|
||||
- PriceTable
|
||||
- ProductFilters
|
||||
|
||||
**RBAC (5 componentes):**
|
||||
- RoleCard
|
||||
- RoleForm
|
||||
- PermissionsMatrix
|
||||
- UserRoleAssignment
|
||||
- RolePermissionsEditor
|
||||
|
||||
---
|
||||
|
||||
## 4. ANÁLISIS DE RUTAS
|
||||
|
||||
### 4.1 Rutas Actuales (45)
|
||||
|
||||
| Área | Rutas | Estado |
|
||||
|------|-------|--------|
|
||||
| /auth/* | 4 | OK |
|
||||
| /dashboard | 1 | OK |
|
||||
| /dashboard/sales/* | 6 | OK |
|
||||
| /dashboard/commissions/* | 5 | OK |
|
||||
| /dashboard/mlm/* | 7 | **DEFINIDAS, SIN PÁGINA** |
|
||||
| /dashboard/goals/* | 6 | **DEFINIDAS, SIN PÁGINA** |
|
||||
| /dashboard/rbac/* | 1 | **PARCIAL** |
|
||||
| /dashboard/notifications | 1 | OK |
|
||||
| /dashboard/* (otros) | 11 | OK |
|
||||
| /superadmin/* | 4 | OK |
|
||||
| /onboarding | 1 | OK |
|
||||
|
||||
### 4.2 Rutas a Agregar
|
||||
|
||||
| Ruta | Página | Prioridad |
|
||||
|------|--------|-----------|
|
||||
| /dashboard/rbac/roles | RolesPage | P0 |
|
||||
| /dashboard/rbac/permissions | PermissionsPage | P0 |
|
||||
| /dashboard/notifications/templates | TemplatesPage | P0 |
|
||||
| /dashboard/portfolio | PortfolioPage | P1 |
|
||||
| /dashboard/portfolio/categories | CategoriesPage | P1 |
|
||||
| /dashboard/portfolio/products | ProductsPage | P1 |
|
||||
| /dashboard/portfolio/products/:id | ProductDetailPage | P1 |
|
||||
|
||||
**Nota:** Las rutas MLM y Goals ya están definidas en router pero apuntan a páginas vacías o inexistentes.
|
||||
|
||||
---
|
||||
|
||||
## 5. ANÁLISIS DE FLUJOS UX
|
||||
|
||||
### 5.1 Flujos Completos
|
||||
|
||||
| Flujo | Páginas | Estado |
|
||||
|-------|---------|--------|
|
||||
| Login → Dashboard | 3 | OK |
|
||||
| Register → Onboarding → Dashboard | 6 | OK |
|
||||
| Sales: Lead → Opportunity → Close | 4 | OK |
|
||||
| Billing: Subscribe → Manage → Cancel | 3 | OK |
|
||||
| Users: Invite → Accept → Profile | 4 | OK |
|
||||
|
||||
### 5.2 Flujos Incompletos
|
||||
|
||||
| Flujo | Páginas Existentes | Faltantes | Impacto |
|
||||
|-------|-------------------|-----------|---------|
|
||||
| MLM: Structure → Nodes → Commissions | 0 | 5 | ALTO |
|
||||
| Goals: Define → Assign → Track → Report | 0 | 4 | ALTO |
|
||||
| Portfolio: Category → Product → Variant → Price | 0 | 4 | MEDIO |
|
||||
| RBAC: Role → Permissions → Assign to User | 0 | 3 | CRÍTICO |
|
||||
| Audit: Search → Filter → Export | 1 | 2 | MEDIO |
|
||||
|
||||
### 5.3 User Stories No Implementadas
|
||||
|
||||
| ID | Historia | Módulo | Prioridad |
|
||||
|----|----------|--------|-----------|
|
||||
| US-MLM-01 | Como admin, quiero ver la estructura de red para entender la organización | MLM | P1 |
|
||||
| US-MLM-02 | Como usuario, quiero ver mi árbol de referidos para tracking | MLM | P1 |
|
||||
| US-GOALS-01 | Como manager, quiero crear objetivos para mi equipo | Goals | P1 |
|
||||
| US-GOALS-02 | Como empleado, quiero ver mi progreso en mis metas | Goals | P1 |
|
||||
| US-PORT-01 | Como admin, quiero gestionar el catálogo de productos | Portfolio | P1 |
|
||||
| US-RBAC-01 | Como admin, quiero asignar roles a usuarios | RBAC | P0 |
|
||||
|
||||
---
|
||||
|
||||
## 6. ANÁLISIS DE DEPENDENCIAS
|
||||
|
||||
### 6.1 Dependencias Internas (Frontend)
|
||||
|
||||
```
|
||||
┌─────────────────────────────────────────────────────┐
|
||||
│ DEPENDENCIAS │
|
||||
├─────────────────────────────────────────────────────┤
|
||||
│ MLM Pages │
|
||||
│ ├── useMlm hook (✓ EXISTE) │
|
||||
│ ├── DashboardLayout (✓ EXISTE) │
|
||||
│ ├── NetworkTree component (✗ CREAR) │
|
||||
│ └── router/index.tsx (✓ RUTAS DEFINIDAS) │
|
||||
│ │
|
||||
│ Goals Pages │
|
||||
│ ├── useGoals hook (✓ EXISTE) │
|
||||
│ ├── DashboardLayout (✓ EXISTE) │
|
||||
│ ├── ProgressBar component (✗ CREAR) │
|
||||
│ └── router/index.tsx (✓ RUTAS DEFINIDAS) │
|
||||
│ │
|
||||
│ Portfolio Pages │
|
||||
│ ├── usePortfolio hook (✓ EXISTE) │
|
||||
│ ├── DashboardLayout (✓ EXISTE) │
|
||||
│ ├── CategoryTree component (✗ CREAR) │
|
||||
│ └── router/index.tsx (✗ AGREGAR RUTAS) │
|
||||
│ │
|
||||
│ RBAC Pages │
|
||||
│ ├── useRbac hook (✗ CREAR) │
|
||||
│ ├── DashboardLayout (✓ EXISTE) │
|
||||
│ ├── PermissionsMatrix component (✗ CREAR) │
|
||||
│ └── router/index.tsx (✗ AGREGAR RUTAS) │
|
||||
└─────────────────────────────────────────────────────┘
|
||||
```
|
||||
|
||||
### 6.2 Orden de Implementación Sugerido
|
||||
|
||||
```
|
||||
1. [P0] RBAC API + Hook + Pages → Desbloquea gestión de permisos
|
||||
↓
|
||||
2. [P0] Audit completar → Desbloquea auditoría avanzada
|
||||
↓
|
||||
3. [P0] Notifications completar → Desbloquea configuración notif.
|
||||
↓
|
||||
4. [P1] Portfolio Pages → Desbloquea catálogo (usa en Sales)
|
||||
↓
|
||||
5. [P1] Goals Pages → Desbloquea metas (independiente)
|
||||
↓
|
||||
6. [P1] MLM Pages → Desbloquea MLM (usa Portfolio, Commissions)
|
||||
↓
|
||||
7. [P2] Accesibilidad → Mejora UX general
|
||||
↓
|
||||
8. [P2] Tests → Aumenta confiabilidad
|
||||
↓
|
||||
9. [P3] Documentación + Purga → Limpieza final
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 7. MÉTRICAS DEL ANÁLISIS
|
||||
|
||||
| Métrica | Valor |
|
||||
|---------|-------|
|
||||
| Gaps totales identificados | 12 |
|
||||
| Gaps P0 (críticos) | 3 |
|
||||
| Gaps P1 (altos) | 3 |
|
||||
| Gaps P2 (medios) | 4 |
|
||||
| Gaps P3 (bajos) | 2 |
|
||||
| Páginas faltantes | 20-24 |
|
||||
| Componentes faltantes | 34 |
|
||||
| Rutas a agregar | 7 |
|
||||
| SP total estimado | 49 |
|
||||
| User stories sin implementar | 6 |
|
||||
|
||||
---
|
||||
|
||||
## 8. CONCLUSIONES DEL ANÁLISIS
|
||||
|
||||
### Fortalezas
|
||||
|
||||
- Stack tecnológico moderno y bien configurado
|
||||
- Hooks API completos para todos los módulos (53+ funciones)
|
||||
- Módulos core funcionando correctamente
|
||||
- Buena estructura de carpetas feature-based
|
||||
- Testing E2E con Playwright establecido
|
||||
|
||||
### Debilidades
|
||||
|
||||
- 4 módulos sin UI (MLM, Goals, Portfolio, RBAC)
|
||||
- Coherencia Backend→Frontend al 58%
|
||||
- Documentación frontend desactualizada
|
||||
- Accesibilidad parcial (67%)
|
||||
- Tests unitarios frontend escasos
|
||||
|
||||
### Oportunidades
|
||||
|
||||
- Hooks existentes permiten implementación rápida de UI
|
||||
- Componentes base reutilizables disponibles
|
||||
- Patrones establecidos en módulos existentes (Sales, Commissions)
|
||||
- Subagentes pueden paralelizar implementación
|
||||
|
||||
### Riesgos
|
||||
|
||||
- Módulos MLM y Goals tienen lógica de negocio compleja
|
||||
- Componente NetworkTree (árbol) requiere diseño específico
|
||||
- Falta de tests puede introducir regresiones
|
||||
- Documentación desactualizada puede causar confusión
|
||||
|
||||
---
|
||||
|
||||
*Generado: 2026-02-03 | Agente: Claude Opus 4.5 | Metodología: CAPVED*
|
||||
@ -0,0 +1,332 @@
|
||||
# FASE C: CONTEXTO - Auditoría Frontend/UX-UI
|
||||
|
||||
**ID:** TASK-2026-02-03-AUDITORIA-FRONTEND-UX-UI
|
||||
**Fecha:** 2026-02-03
|
||||
**Estado:** COMPLETADA
|
||||
**SP Ejecutados:** 8
|
||||
|
||||
---
|
||||
|
||||
## 1. ESTADO ACTUAL DEL FRONTEND
|
||||
|
||||
### 1.1 Estructura del Proyecto
|
||||
|
||||
```
|
||||
frontend/src/
|
||||
├── __tests__/ # Tests (unit, integration)
|
||||
├── components/ # 28 componentes React
|
||||
│ ├── ai/ # AIChat, AISettings, ChatMessage
|
||||
│ ├── analytics/ # MetricCard, TrendChart
|
||||
│ ├── audit/ # ActivityTimeline, AuditFilters, AuditLogRow, AuditStatsCard
|
||||
│ ├── auth/ # OAuthButtons
|
||||
│ ├── common/ # ExportButton, ExportModal
|
||||
│ ├── feature-flags/ # FeatureFlagCard, FeatureFlagForm, TenantOverridesPanel
|
||||
│ ├── notifications/ # NotificationBell, NotificationDrawer, NotificationItem, DevicesManager
|
||||
│ ├── storage/ # FileItem, FileList, FileUpload, StorageUsageCard
|
||||
│ ├── webhooks/ # WebhookCard, WebhookDeliveryList, WebhookForm
|
||||
│ └── whatsapp/ # WhatsAppTestMessage
|
||||
├── hooks/ # 24 hooks personalizados
|
||||
├── layouts/ # 2 layouts (AuthLayout, DashboardLayout)
|
||||
├── pages/ # 56 páginas
|
||||
├── router/ # Sistema de routing con guards
|
||||
├── services/ # 26 servicios de API
|
||||
├── stores/ # 3 stores Zustand (auth, ui)
|
||||
├── App.tsx # Componente raíz
|
||||
├── main.tsx # Entry point
|
||||
└── index.css # Estilos Tailwind
|
||||
```
|
||||
|
||||
### 1.2 Métricas Actuales
|
||||
|
||||
| Categoría | Cantidad | Estado |
|
||||
|-----------|----------|--------|
|
||||
| Páginas | 56 | Implementadas |
|
||||
| Componentes | 28 | Implementados |
|
||||
| Hooks | 24 | Implementados |
|
||||
| Servicios API | 26 | Implementados |
|
||||
| Stores Zustand | 3 | Implementados |
|
||||
| Layouts | 2 | Implementados |
|
||||
| Rutas | 45 | Configuradas |
|
||||
| Tests Unit | ~50 | Parciales |
|
||||
| Tests E2E | 47 | Playwright |
|
||||
|
||||
### 1.3 Stack Tecnológico
|
||||
|
||||
| Tecnología | Versión | Propósito |
|
||||
|------------|---------|-----------|
|
||||
| React | 19.0.0 | UI Framework |
|
||||
| Vite | 6.0.6 | Build Tool |
|
||||
| TypeScript | 5.7.2 | Type Safety |
|
||||
| Zustand | 5.0.2 | State Management |
|
||||
| TanStack Query | 5.62.16 | Server State |
|
||||
| React Router | 7.1.1 | Routing |
|
||||
| Tailwind CSS | 3.4.17 | Styling |
|
||||
| React Hook Form | 7.54.2 | Forms |
|
||||
| Recharts | 2.15.0 | Charts |
|
||||
| Vitest | 4.0.17 | Unit Testing |
|
||||
| Playwright | 1.40.0 | E2E Testing |
|
||||
|
||||
---
|
||||
|
||||
## 2. PÁGINAS POR MÓDULO
|
||||
|
||||
### 2.1 Módulos Core (Implementados)
|
||||
|
||||
| Módulo | Páginas | Rutas | Estado |
|
||||
|--------|---------|-------|--------|
|
||||
| Auth | 4 | /auth/* | 100% |
|
||||
| Dashboard | 10 | /dashboard/* | 100% |
|
||||
| Billing | 1 | /dashboard/billing | 100% |
|
||||
| Users | 1 | /dashboard/users | 100% |
|
||||
| Settings | 4 | /dashboard/settings/* | 100% |
|
||||
| Superadmin | 3 | /superadmin/* | 100% |
|
||||
| Onboarding | 1 (4 steps) | /onboarding | 100% |
|
||||
|
||||
### 2.2 Módulos Comerciales (Implementados)
|
||||
|
||||
| Módulo | Páginas | Rutas | Estado |
|
||||
|--------|---------|-------|--------|
|
||||
| Sales | 6 | /dashboard/sales/* | 100% |
|
||||
| Commissions | 5 | /dashboard/commissions/* | 100% |
|
||||
| AI | 1 | /dashboard/ai | 100% |
|
||||
| Storage | 1 | /dashboard/storage | 100% |
|
||||
| Webhooks | 1 | /dashboard/webhooks | 100% |
|
||||
| Feature Flags | 1 | /dashboard/feature-flags | 100% |
|
||||
| Audit | 1 | /dashboard/audit | 100% (básico) |
|
||||
| WhatsApp | 1 | /dashboard/whatsapp | 100% |
|
||||
|
||||
### 2.3 Módulos con Gaps (UI Pendiente)
|
||||
|
||||
| Módulo | Backend | Hooks | Páginas UI | Estado |
|
||||
|--------|---------|-------|------------|--------|
|
||||
| MLM | 100% | 100% | 0% | **PENDIENTE** |
|
||||
| Goals | 100% | 100% | 0% | **PENDIENTE** |
|
||||
| Portfolio | 100% | 100% | 0% | **PENDIENTE** |
|
||||
|
||||
### 2.4 Módulos con Frontend Incompleto
|
||||
|
||||
| Módulo | Endpoints Backend | API Frontend | Estado |
|
||||
|--------|-------------------|--------------|--------|
|
||||
| Audit | 8 | Parcial | 40% |
|
||||
| RBAC | 14 | 0 | **CRÍTICO** |
|
||||
| Notifications | 17 | Parcial | 60% |
|
||||
|
||||
---
|
||||
|
||||
## 3. DOCUMENTACIÓN EXISTENTE
|
||||
|
||||
### 3.1 Estándares Aplicables
|
||||
|
||||
| Documento | Ubicación | Aplicabilidad |
|
||||
|-----------|-----------|---------------|
|
||||
| ESTANDAR-FRONTEND-PROFESIONAL.md | docs/40-estandares/ | 100% |
|
||||
| SIMCO-FRONTEND.md | orchestration/directivas/simco/ | 100% |
|
||||
| ESTANDAR-PERFORMANCE.md | docs/40-estandares/ | 90% |
|
||||
| ESTANDAR-TESTING.md | docs/40-estandares/ | 80% |
|
||||
| ESTANDAR-SEGURIDAD.md | docs/40-estandares/ | 70% |
|
||||
| ESTANDAR-DOCUMENTACION.md | docs/40-estandares/ | 85% |
|
||||
|
||||
### 3.2 Especificaciones Frontend
|
||||
|
||||
| Documento | Ubicación | Estado |
|
||||
|-----------|-----------|--------|
|
||||
| FRONTEND-PAGES-SPEC.md | docs/05-frontend/ | Desactualizado |
|
||||
| FRONTEND-ROUTING.md | docs/05-frontend/ | Desactualizado |
|
||||
| FRONTEND_INVENTORY.yml | orchestration/inventarios/ | Desactualizado |
|
||||
|
||||
### 3.3 Especificaciones de Módulos
|
||||
|
||||
| Módulo | Spec Backend | Spec Frontend | Gap |
|
||||
|--------|--------------|---------------|-----|
|
||||
| SAAS-018 Sales | 100% | 100% | - |
|
||||
| SAAS-019 Portfolio | 100% | 0% | **CREAR** |
|
||||
| SAAS-020 Commissions | 100% | 100% | - |
|
||||
| SAAS-021 MLM | 100% | 0% | **CREAR** |
|
||||
| SAAS-022 Goals | 100% | 0% | **CREAR** |
|
||||
|
||||
---
|
||||
|
||||
## 4. REQUERIMIENTOS APLICABLES
|
||||
|
||||
### 4.1 Requerimientos No Funcionales UX
|
||||
|
||||
| ID | Descripción | Estado | Cobertura |
|
||||
|----|-------------|--------|-----------|
|
||||
| RNF-UX-001 | Responsividad mobile-first | OK | 90% |
|
||||
| RNF-UX-002 | Accesibilidad WCAG 2.1 AA | PARCIAL | 67% |
|
||||
| RNF-UX-003 | Feedback visual en acciones | OK | 85% |
|
||||
| RNF-PERF-001 | Tiempos respuesta <500ms | OK | 95% |
|
||||
| RNF-PERF-003 | Bundle <500KB gzipped | OK | 100% |
|
||||
|
||||
### 4.2 Criterios de Aceptación Frontend
|
||||
|
||||
De los documentos SAAS-XXX, los criterios frontend pendientes:
|
||||
|
||||
| Módulo | Criterios | Implementados | Pendientes |
|
||||
|--------|-----------|---------------|------------|
|
||||
| MLM (SAAS-021) | 12 | 0 | 12 |
|
||||
| Goals (SAAS-022) | 10 | 0 | 10 |
|
||||
| Portfolio (SAAS-019) | 8 | 0 | 8 |
|
||||
| Audit | 6 | 2 | 4 |
|
||||
| RBAC | 8 | 0 | 8 |
|
||||
| Notifications | 10 | 6 | 4 |
|
||||
|
||||
---
|
||||
|
||||
## 5. HOOKS EXISTENTES (Por Usar)
|
||||
|
||||
### 5.1 Hooks MLM (useMlm.ts)
|
||||
|
||||
```typescript
|
||||
// Queries
|
||||
useStructures()
|
||||
useStructure(id)
|
||||
useNodes()
|
||||
useNode(id)
|
||||
useRanks()
|
||||
useRank(id)
|
||||
useNetworkCommissions()
|
||||
useMyNetwork()
|
||||
useDownline(nodeId)
|
||||
|
||||
// Mutations
|
||||
useCreateStructure()
|
||||
useUpdateStructure()
|
||||
useDeleteStructure()
|
||||
useCreateNode()
|
||||
useUpdateNode()
|
||||
usePromoteNode()
|
||||
useDemoteNode()
|
||||
useCalculateCommissions()
|
||||
```
|
||||
|
||||
**Total:** 18 funciones disponibles
|
||||
|
||||
### 5.2 Hooks Goals (useGoals.ts)
|
||||
|
||||
```typescript
|
||||
// Queries
|
||||
useGoalDefinitions()
|
||||
useGoalDefinition(id)
|
||||
useGoalAssignments()
|
||||
useGoalAssignment(id)
|
||||
useGoalProgress(assignmentId)
|
||||
useMyGoals()
|
||||
useGoalReports()
|
||||
|
||||
// Mutations
|
||||
useCreateGoalDefinition()
|
||||
useUpdateGoalDefinition()
|
||||
useDeleteGoalDefinition()
|
||||
useAssignGoal()
|
||||
useUpdateAssignment()
|
||||
useLogProgress()
|
||||
useCompleteGoal()
|
||||
```
|
||||
|
||||
**Total:** 14 funciones disponibles
|
||||
|
||||
### 5.3 Hooks Portfolio (usePortfolio.ts)
|
||||
|
||||
```typescript
|
||||
// Categories
|
||||
useCategories()
|
||||
useCategory(id)
|
||||
useCategoryTree()
|
||||
useCreateCategory()
|
||||
useUpdateCategory()
|
||||
useDeleteCategory()
|
||||
|
||||
// Products
|
||||
useProducts()
|
||||
useProduct(id)
|
||||
useCreateProduct()
|
||||
useUpdateProduct()
|
||||
useUpdateProductStatus()
|
||||
useDuplicateProduct()
|
||||
useDeleteProduct()
|
||||
|
||||
// Variants & Prices
|
||||
useProductVariants(productId)
|
||||
useCreateVariant()
|
||||
useUpdateVariant()
|
||||
useDeleteVariant()
|
||||
useProductPrices(productId)
|
||||
useCreatePrice()
|
||||
useUpdatePrice()
|
||||
useDeletePrice()
|
||||
```
|
||||
|
||||
**Total:** 21 funciones disponibles
|
||||
|
||||
---
|
||||
|
||||
## 6. TAREAS PREVIAS RELACIONADAS
|
||||
|
||||
### 6.1 TASK-2026-02-03-ANALISIS-INTEGRAL-TEMPLATE-SAAS
|
||||
|
||||
**Estado:** Completada
|
||||
**SP:** 81
|
||||
**Relevancia:** Alta
|
||||
|
||||
**Outputs reutilizables:**
|
||||
- Gaps identificados (16 total, 8 frontend)
|
||||
- Plan de remediación con SP estimados
|
||||
- Análisis de coherencia Backend→Frontend (58%)
|
||||
|
||||
### 6.2 TASK-2026-01-25-SAAS-021-MLM
|
||||
|
||||
**Estado:** Completada
|
||||
**Nota:** "Backend 100%, Hooks 100%, UI pendiente"
|
||||
|
||||
### 6.3 TASK-2026-01-25-SAAS-022-GOALS
|
||||
|
||||
**Estado:** Completada
|
||||
**Nota:** "Backend 100%, Hooks 100%, UI pendiente"
|
||||
|
||||
---
|
||||
|
||||
## 7. DOCUMENTACIÓN A PURGAR
|
||||
|
||||
### 7.1 Archivos Obsoletos Identificados
|
||||
|
||||
| Carpeta | Archivos | Estado |
|
||||
|---------|----------|--------|
|
||||
| 2026-01-07-trazas/ | 5 | 100% OBSOLETO |
|
||||
| 2026-01-10-simco-v37/ | 51 | 71% OBSOLETO |
|
||||
| 2026-01-10-sprint5/ | 19 | 84% OBSOLETO |
|
||||
| **Total** | **75** | **57 a PURGAR** |
|
||||
|
||||
### 7.2 Espacio a Liberar
|
||||
|
||||
- Purga inmediata: 620 KB
|
||||
- Post-revisión: 80 KB
|
||||
- **Total:** ~700 KB (87%)
|
||||
|
||||
---
|
||||
|
||||
## 8. RESUMEN DE CONTEXTO
|
||||
|
||||
### Estado General
|
||||
|
||||
| Aspecto | Estado | Notas |
|
||||
|---------|--------|-------|
|
||||
| Infraestructura Frontend | COMPLETA | Stack moderno, bien configurado |
|
||||
| Módulos Core | COMPLETOS | Auth, Users, Billing, Settings |
|
||||
| Módulos Comerciales Base | COMPLETOS | Sales, Commissions |
|
||||
| Módulos Comerciales Avanzados | **PENDIENTES** | MLM, Goals, Portfolio |
|
||||
| Hooks API | COMPLETOS | 53+ funciones listas para usar |
|
||||
| Testing | PARCIAL | E2E ok, Unit parciales |
|
||||
| Documentación Frontend | DESACTUALIZADA | Specs no reflejan estado actual |
|
||||
| Accesibilidad | PARCIAL | 67% WCAG 2.1 |
|
||||
|
||||
### Prioridades Identificadas
|
||||
|
||||
1. **P0:** Crear UI para módulos críticos (Audit, RBAC, Notifications)
|
||||
2. **P1:** Crear UI para módulos comerciales (MLM, Goals, Portfolio)
|
||||
3. **P2:** Actualizar documentación y mejorar accesibilidad
|
||||
4. **P3:** Purgar documentación obsoleta
|
||||
|
||||
---
|
||||
|
||||
*Generado: 2026-02-03 | Agente: Claude Opus 4.5 | Metodología: CAPVED*
|
||||
@ -0,0 +1,147 @@
|
||||
# METADATA - TASK-2026-02-03-AUDITORIA-FRONTEND-UX-UI
|
||||
# Auditoría Frontend/UX-UI - Template SaaS
|
||||
|
||||
metadata:
|
||||
version: "1.0.0"
|
||||
created: "2026-02-03"
|
||||
updated: "2026-02-03"
|
||||
|
||||
task:
|
||||
id: "TASK-2026-02-03-AUDITORIA-FRONTEND-UX-UI"
|
||||
titulo: "Auditoría y Planificación Frontend/UX-UI - Template SaaS"
|
||||
tipo: "analysis"
|
||||
modo: "@ANALYSIS"
|
||||
estado: "en_progreso"
|
||||
fase_actual: "PLANIFICACION"
|
||||
sp_estimados: 89
|
||||
sp_ejecutados: 0
|
||||
|
||||
proyecto:
|
||||
nombre: "template-saas"
|
||||
tipo: "PROVIDER"
|
||||
nivel: "L1A"
|
||||
|
||||
perfil:
|
||||
rol: "Frontend Developer / UX-UI Specialist"
|
||||
enfoque:
|
||||
- "Comparación componentes vs requerimientos"
|
||||
- "Análisis de páginas y routing"
|
||||
- "Validación de funcionalidades y flujos"
|
||||
- "Coherencia con documentación"
|
||||
|
||||
alcance:
|
||||
incluye:
|
||||
- "56 páginas frontend existentes"
|
||||
- "28 componentes React"
|
||||
- "24 hooks personalizados"
|
||||
- "45 rutas definidas"
|
||||
- "22 módulos SAAS documentados"
|
||||
- "Estándares ESTANDAR-FRONTEND-PROFESIONAL"
|
||||
excluye:
|
||||
- "Backend/API (ya auditado en TASK anterior)"
|
||||
- "DDL/Database (ya auditado)"
|
||||
- "Infraestructura CI/CD"
|
||||
|
||||
metodologia:
|
||||
framework: "CAPVED"
|
||||
fases:
|
||||
- nombre: "CONTEXTO"
|
||||
sp: 8
|
||||
estado: "completada"
|
||||
descripcion: "Recopilación de información del estado actual"
|
||||
- nombre: "ANALISIS"
|
||||
sp: 13
|
||||
estado: "completada"
|
||||
descripcion: "Análisis de coherencia y gaps"
|
||||
- nombre: "PLANIFICACION"
|
||||
sp: 21
|
||||
estado: "en_progreso"
|
||||
descripcion: "Plan de remediación con subtareas CAPVED"
|
||||
- nombre: "EJECUCION"
|
||||
sp: 34
|
||||
estado: "pendiente"
|
||||
descripcion: "Implementación de UI faltante"
|
||||
- nombre: "VALIDACION"
|
||||
sp: 8
|
||||
estado: "pendiente"
|
||||
descripcion: "Testing y validación de coherencia"
|
||||
- nombre: "DOCUMENTACION"
|
||||
sp: 5
|
||||
estado: "pendiente"
|
||||
descripcion: "Actualización de inventarios y docs"
|
||||
|
||||
integracion_tareas_existentes:
|
||||
task_base: "TASK-2026-02-03-ANALISIS-INTEGRAL-TEMPLATE-SAAS"
|
||||
gaps_heredados:
|
||||
- id: "GAP-FE-01"
|
||||
descripcion: "AUDIT sin frontend"
|
||||
endpoints: 8
|
||||
prioridad: "P0"
|
||||
- id: "GAP-FE-02"
|
||||
descripcion: "RBAC sin frontend"
|
||||
endpoints: 14
|
||||
prioridad: "P0"
|
||||
- id: "GAP-FE-03"
|
||||
descripcion: "NOTIFICATIONS sin frontend completo"
|
||||
endpoints: 17
|
||||
prioridad: "P0"
|
||||
- id: "GAP-FE-04"
|
||||
descripcion: "Portfolio sin UI (hooks existen)"
|
||||
funciones: 21
|
||||
prioridad: "P1"
|
||||
- id: "GAP-FE-05"
|
||||
descripcion: "MLM sin UI (hooks existen)"
|
||||
paginas: 7
|
||||
prioridad: "P1"
|
||||
- id: "GAP-FE-06"
|
||||
descripcion: "Goals sin UI (hooks existen)"
|
||||
paginas: 7
|
||||
prioridad: "P1"
|
||||
- id: "GAP-FE-07"
|
||||
descripcion: "11 páginas sin documentación"
|
||||
paginas: 11
|
||||
prioridad: "P2"
|
||||
- id: "GAP-FE-08"
|
||||
descripcion: "WCAG 2.1 AA parcial"
|
||||
cobertura: "67%"
|
||||
prioridad: "P2"
|
||||
|
||||
purga_documentacion:
|
||||
archivos_a_purgar: 57
|
||||
espacio_a_liberar: "620 KB"
|
||||
carpetas:
|
||||
- "orchestration/_archive/2026-01-07-trazas/"
|
||||
- "orchestration/_archive/2026-01-10-simco-v37/"
|
||||
- "orchestration/_archive/2026-01-10-sprint5/"
|
||||
|
||||
dependencias:
|
||||
internas:
|
||||
- "Hooks MLM, Goals, Portfolio ya existen"
|
||||
- "Router configurado"
|
||||
- "DashboardLayout disponible"
|
||||
externas:
|
||||
- "Backend endpoints disponibles (100%)"
|
||||
- "Estándares frontend definidos"
|
||||
|
||||
subagentes:
|
||||
permitidos: true
|
||||
modo: "paralelo_ordenado"
|
||||
tipos:
|
||||
- "Explore: investigación y búsqueda"
|
||||
- "general-purpose: tareas complejas"
|
||||
- "Plan: diseño de implementación"
|
||||
|
||||
outputs:
|
||||
documentos:
|
||||
- "FASE-CAPVED-CONTEXTO.md"
|
||||
- "FASE-CAPVED-ANALISIS.md"
|
||||
- "FASE-CAPVED-PLANIFICACION.md"
|
||||
- "PLAN-SUBTAREAS-FRONTEND.md"
|
||||
inventarios:
|
||||
- "Actualización FRONTEND_INVENTORY.yml"
|
||||
- "Actualización MASTER_INVENTORY.yml"
|
||||
|
||||
agente:
|
||||
nombre: "Claude Opus 4.5"
|
||||
modo: "Claude Code"
|
||||
fecha_inicio: "2026-02-03"
|
||||
@ -0,0 +1,766 @@
|
||||
# PLAN DE SUBTAREAS - Auditoría Frontend/UX-UI
|
||||
|
||||
**ID:** TASK-2026-02-03-AUDITORIA-FRONTEND-UX-UI
|
||||
**Fecha:** 2026-02-03
|
||||
**Estado:** PLANIFICACIÓN COMPLETA
|
||||
**SP Total:** 49
|
||||
|
||||
---
|
||||
|
||||
## RESUMEN EJECUTIVO
|
||||
|
||||
Este plan descompone la implementación frontend en **4 Sprints** con **21 subtareas** organizadas por prioridad y dependencias. Cada subtarea cumple con el principio CAPVED y puede ser ejecutada por subagentes en paralelo según el mapa de dependencias.
|
||||
|
||||
```
|
||||
┌───────────────────────────────────────────────────────────────┐
|
||||
│ DISTRIBUCIÓN POR SPRINT │
|
||||
├───────────────────────────────────────────────────────────────┤
|
||||
│ Sprint 1 (P0): 11 SP - Módulos Críticos │
|
||||
│ Sprint 2 (P1): 21 SP - Módulos Comerciales │
|
||||
│ Sprint 3 (P2): 14 SP - Calidad y Tests │
|
||||
│ Sprint 4 (P3): 3 SP - Limpieza y Documentación │
|
||||
├───────────────────────────────────────────────────────────────┤
|
||||
│ TOTAL: 49 SP | 21 Subtareas | 4 Sprints │
|
||||
└───────────────────────────────────────────────────────────────┘
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## SPRINT 1: MÓDULOS CRÍTICOS (P0)
|
||||
|
||||
**Objetivo:** Completar funcionalidad core para administración
|
||||
**SP Total:** 11
|
||||
**Paralelismo:** ST-1.1, ST-1.2, ST-1.3 pueden ejecutarse en paralelo
|
||||
|
||||
### ST-1.1: RBAC Frontend Completo
|
||||
|
||||
| Aspecto | Detalle |
|
||||
|---------|---------|
|
||||
| **ID** | ST-1.1-RBAC-FRONTEND |
|
||||
| **SP** | 5 |
|
||||
| **Prioridad** | P0 |
|
||||
| **Dependencias** | Ninguna |
|
||||
| **Paralelizable** | Sí |
|
||||
|
||||
**CAPVED:**
|
||||
|
||||
| Fase | Actividad | Output |
|
||||
|------|-----------|--------|
|
||||
| **C** | Leer SAAS-003-rbac.md, revisar backend/src/modules/rbac | Entender 14 endpoints |
|
||||
| **A** | Analizar patrones de Sales para replicar | Definir estructura páginas |
|
||||
| **P** | Diseñar RolesPage, PermissionsPage, PermissionsMatrix | Mockups/wireframes |
|
||||
| **E** | Implementar 5 archivos: API, hook, 3 páginas | Código funcional |
|
||||
| **V** | npm run build, npm run lint, pruebas manuales | Build exitoso |
|
||||
| **D** | Actualizar router, FRONTEND_INVENTORY.yml | Docs actualizados |
|
||||
|
||||
**Archivos a crear:**
|
||||
```
|
||||
frontend/src/
|
||||
├── services/api/rbac.api.ts # 14 endpoints
|
||||
├── hooks/useRbac.ts # Queries + mutations
|
||||
├── pages/dashboard/rbac/
|
||||
│ ├── RolesPage.tsx # CRUD roles
|
||||
│ ├── PermissionsPage.tsx # CRUD permissions
|
||||
│ └── RoleDetailPage.tsx # Asignación permisos
|
||||
└── components/rbac/
|
||||
├── RoleCard.tsx
|
||||
├── RoleForm.tsx
|
||||
└── PermissionsMatrix.tsx
|
||||
```
|
||||
|
||||
**Criterios de Aceptación:**
|
||||
- [ ] Lista de roles con CRUD
|
||||
- [ ] Lista de permisos disponibles
|
||||
- [ ] Matriz de asignación role→permissions
|
||||
- [ ] Asignación de roles a usuarios
|
||||
- [ ] Validación de permisos en UI
|
||||
|
||||
---
|
||||
|
||||
### ST-1.2: Audit Frontend Completo
|
||||
|
||||
| Aspecto | Detalle |
|
||||
|---------|---------|
|
||||
| **ID** | ST-1.2-AUDIT-COMPLETE |
|
||||
| **SP** | 3 |
|
||||
| **Prioridad** | P0 |
|
||||
| **Dependencias** | Ninguna |
|
||||
| **Paralelizable** | Sí |
|
||||
|
||||
**CAPVED:**
|
||||
|
||||
| Fase | Actividad | Output |
|
||||
|------|-----------|--------|
|
||||
| **C** | Revisar audit.controller.ts (8 endpoints), componentes existentes | Lista de gaps |
|
||||
| **A** | Comparar con AuditLogsPage actual | Funcionalidades faltantes |
|
||||
| **P** | Diseñar filtros avanzados, exportación, stats | Plan de mejoras |
|
||||
| **E** | Completar API (6 endpoints), mejorar página | Código funcional |
|
||||
| **V** | Validar filtros, exportación CSV/Excel | Tests manuales |
|
||||
| **D** | Actualizar SAAS-009-audit.md con UI | Docs actualizados |
|
||||
|
||||
**Archivos a modificar/crear:**
|
||||
```
|
||||
frontend/src/
|
||||
├── services/api/audit.api.ts # Completar 6 endpoints faltantes
|
||||
├── hooks/useAudit.ts # Agregar queries faltantes
|
||||
├── pages/dashboard/AuditLogsPage.tsx # Mejorar con filtros
|
||||
└── components/audit/
|
||||
├── AuditFilters.tsx # Ya existe, mejorar
|
||||
├── AuditExport.tsx # CREAR
|
||||
└── AuditStatsCard.tsx # Ya existe, mejorar
|
||||
```
|
||||
|
||||
**Criterios de Aceptación:**
|
||||
- [ ] Filtros por fecha, usuario, acción, entidad
|
||||
- [ ] Exportación a CSV y Excel
|
||||
- [ ] Estadísticas de actividad (gráfico)
|
||||
- [ ] Paginación con 50+ registros
|
||||
- [ ] Búsqueda full-text
|
||||
|
||||
---
|
||||
|
||||
### ST-1.3: Notifications Frontend Completo
|
||||
|
||||
| Aspecto | Detalle |
|
||||
|---------|---------|
|
||||
| **ID** | ST-1.3-NOTIFICATIONS-COMPLETE |
|
||||
| **SP** | 3 |
|
||||
| **Prioridad** | P0 |
|
||||
| **Dependencias** | Ninguna |
|
||||
| **Paralelizable** | Sí |
|
||||
|
||||
**CAPVED:**
|
||||
|
||||
| Fase | Actividad | Output |
|
||||
|------|-----------|--------|
|
||||
| **C** | Revisar notifications.controller.ts (17 endpoints) | Lista completa |
|
||||
| **A** | Comparar con componentes existentes | Gaps en templates, config |
|
||||
| **P** | Diseñar página de gestión de templates | Plan de UI |
|
||||
| **E** | Completar API, crear TemplatesPage | Código funcional |
|
||||
| **V** | Validar CRUD templates, config por canal | Tests manuales |
|
||||
| **D** | Actualizar SAAS-007-notifications.md | Docs actualizados |
|
||||
|
||||
**Archivos a modificar/crear:**
|
||||
```
|
||||
frontend/src/
|
||||
├── services/api/notifications.api.ts # Completar 9 endpoints
|
||||
├── hooks/useNotifications.ts # Agregar templates queries
|
||||
├── pages/dashboard/notifications/
|
||||
│ ├── NotificationsPage.tsx # Ya existe
|
||||
│ └── TemplatesPage.tsx # CREAR
|
||||
└── components/notifications/
|
||||
├── TemplateCard.tsx # CREAR
|
||||
├── TemplateForm.tsx # CREAR
|
||||
└── ChannelConfig.tsx # CREAR
|
||||
```
|
||||
|
||||
**Criterios de Aceptación:**
|
||||
- [ ] CRUD de templates de notificación
|
||||
- [ ] Configuración por canal (email, push, in-app, whatsapp)
|
||||
- [ ] Preview de template
|
||||
- [ ] Activar/desactivar templates
|
||||
- [ ] Historial de notificaciones enviadas
|
||||
|
||||
---
|
||||
|
||||
## SPRINT 2: MÓDULOS COMERCIALES (P1)
|
||||
|
||||
**Objetivo:** Implementar UI para módulos comerciales avanzados
|
||||
**SP Total:** 21
|
||||
**Paralelismo:** ST-2.1, ST-2.2, ST-2.3 pueden ejecutarse en paralelo
|
||||
|
||||
### ST-2.1: Portfolio UI Completo
|
||||
|
||||
| Aspecto | Detalle |
|
||||
|---------|---------|
|
||||
| **ID** | ST-2.1-PORTFOLIO-UI |
|
||||
| **SP** | 5 |
|
||||
| **Prioridad** | P1 |
|
||||
| **Dependencias** | Ninguna |
|
||||
| **Paralelizable** | Sí |
|
||||
|
||||
**CAPVED:**
|
||||
|
||||
| Fase | Actividad | Output |
|
||||
|------|-----------|--------|
|
||||
| **C** | Revisar usePortfolio (21 funciones), SAAS-019-portfolio.md | Entender modelo |
|
||||
| **A** | Diseñar flujo Category→Product→Variant→Price | Wireframes |
|
||||
| **P** | Definir 6 páginas y 7 componentes | Arquitectura UI |
|
||||
| **E** | Implementar páginas usando hooks existentes | Código funcional |
|
||||
| **V** | Validar CRUD completo, árbol de categorías | Tests E2E |
|
||||
| **D** | Crear ET-SAAS-019-frontend.md | Docs técnicas |
|
||||
|
||||
**Archivos a crear:**
|
||||
```
|
||||
frontend/src/
|
||||
├── pages/dashboard/portfolio/
|
||||
│ ├── PortfolioDashboardPage.tsx # Resumen, stats
|
||||
│ ├── CategoriesPage.tsx # Árbol + CRUD
|
||||
│ ├── CategoryDetailPage.tsx # Subcategorías, productos
|
||||
│ ├── ProductsPage.tsx # Grid filtrable
|
||||
│ ├── ProductDetailPage.tsx # Variantes, precios
|
||||
│ └── ProductFormPage.tsx # Crear/editar
|
||||
└── components/portfolio/
|
||||
├── CategoryTree.tsx # Árbol jerárquico
|
||||
├── CategoryForm.tsx
|
||||
├── ProductCard.tsx
|
||||
├── ProductForm.tsx
|
||||
├── VariantList.tsx
|
||||
├── PriceTable.tsx
|
||||
└── ProductFilters.tsx
|
||||
```
|
||||
|
||||
**Rutas a agregar en router/index.tsx:**
|
||||
```typescript
|
||||
{ path: 'portfolio', element: <PortfolioDashboardPage /> },
|
||||
{ path: 'portfolio/categories', element: <CategoriesPage /> },
|
||||
{ path: 'portfolio/categories/:id', element: <CategoryDetailPage /> },
|
||||
{ path: 'portfolio/products', element: <ProductsPage /> },
|
||||
{ path: 'portfolio/products/new', element: <ProductFormPage /> },
|
||||
{ path: 'portfolio/products/:id', element: <ProductDetailPage /> },
|
||||
{ path: 'portfolio/products/:id/edit', element: <ProductFormPage /> },
|
||||
```
|
||||
|
||||
**Criterios de Aceptación:**
|
||||
- [ ] Árbol de categorías navegable
|
||||
- [ ] CRUD completo de categorías
|
||||
- [ ] Grid de productos con filtros
|
||||
- [ ] Gestión de variantes por producto
|
||||
- [ ] Gestión de precios (multi-moneda si aplica)
|
||||
- [ ] Duplicación de productos
|
||||
- [ ] Cambio de estado (activo/inactivo)
|
||||
|
||||
---
|
||||
|
||||
### ST-2.2: MLM UI Completo
|
||||
|
||||
| Aspecto | Detalle |
|
||||
|---------|---------|
|
||||
| **ID** | ST-2.2-MLM-UI |
|
||||
| **SP** | 8 |
|
||||
| **Prioridad** | P1 |
|
||||
| **Dependencias** | ST-2.1 (Portfolio) para contexto de productos |
|
||||
| **Paralelizable** | Sí (con precaución) |
|
||||
|
||||
**CAPVED:**
|
||||
|
||||
| Fase | Actividad | Output |
|
||||
|------|-----------|--------|
|
||||
| **C** | Revisar useMlm (18 funciones), SAAS-021-mlm.md, entities | Entender estructuras |
|
||||
| **A** | Diseñar visualización de árbol de red | Componente NetworkTree |
|
||||
| **P** | Definir 7 páginas y 8 componentes | Arquitectura UI |
|
||||
| **E** | Implementar con visualización de árbol D3/react-tree | Código funcional |
|
||||
| **V** | Validar navegación de red, cálculo comisiones | Tests E2E |
|
||||
| **D** | Crear ET-SAAS-021-frontend.md | Docs técnicas |
|
||||
|
||||
**Archivos a crear:**
|
||||
```
|
||||
frontend/src/
|
||||
├── pages/dashboard/mlm/
|
||||
│ ├── MLMDashboardPage.tsx # Stats, resumen red
|
||||
│ ├── StructuresPage.tsx # Lista estructuras
|
||||
│ ├── StructureDetailPage.tsx # Visualización árbol
|
||||
│ ├── NodesPage.tsx # Grid de nodos
|
||||
│ ├── NodeDetailPage.tsx # Perfil nodo, downlines
|
||||
│ ├── RanksPage.tsx # Niveles y requisitos
|
||||
│ └── MyNetworkPage.tsx # Mi árbol personal
|
||||
└── components/mlm/
|
||||
├── NetworkTree.tsx # Visualización árbol (D3 o similar)
|
||||
├── StructureCard.tsx
|
||||
├── StructureForm.tsx
|
||||
├── NodeCard.tsx
|
||||
├── RankBadge.tsx
|
||||
├── CommissionsSummary.tsx
|
||||
├── DownlineList.tsx
|
||||
└── MLMStatsCard.tsx
|
||||
```
|
||||
|
||||
**Consideraciones especiales:**
|
||||
- NetworkTree puede usar `react-d3-tree` o `react-organizational-chart`
|
||||
- Considerar lazy loading para redes grandes (>100 nodos)
|
||||
- Implementar zoom y pan para navegación
|
||||
|
||||
**Criterios de Aceptación:**
|
||||
- [ ] Visualización de árbol de red interactivo
|
||||
- [ ] Navegación entre nodos (click para ver detalle)
|
||||
- [ ] Vista de mi red personal
|
||||
- [ ] Lista de rangos con requisitos
|
||||
- [ ] Resumen de comisiones por período
|
||||
- [ ] Histórico de promociones/demociones
|
||||
- [ ] Exportación de estructura
|
||||
|
||||
---
|
||||
|
||||
### ST-2.3: Goals UI Completo
|
||||
|
||||
| Aspecto | Detalle |
|
||||
|---------|---------|
|
||||
| **ID** | ST-2.3-GOALS-UI |
|
||||
| **SP** | 8 |
|
||||
| **Prioridad** | P1 |
|
||||
| **Dependencias** | Ninguna |
|
||||
| **Paralelizable** | Sí |
|
||||
|
||||
**CAPVED:**
|
||||
|
||||
| Fase | Actividad | Output |
|
||||
|------|-----------|--------|
|
||||
| **C** | Revisar useGoals (14 funciones), SAAS-022-goals.md | Entender modelo OKR |
|
||||
| **A** | Diseñar flujo Definition→Assignment→Progress→Report | UX flow |
|
||||
| **P** | Definir 7 páginas y 6 componentes | Arquitectura UI |
|
||||
| **E** | Implementar con progress bars y gráficos | Código funcional |
|
||||
| **V** | Validar tracking de progreso, milestones | Tests E2E |
|
||||
| **D** | Crear ET-SAAS-022-frontend.md | Docs técnicas |
|
||||
|
||||
**Archivos a crear:**
|
||||
```
|
||||
frontend/src/
|
||||
├── pages/dashboard/goals/
|
||||
│ ├── GoalsDashboardPage.tsx # KPIs, tendencias
|
||||
│ ├── DefinitionsPage.tsx # CRUD definiciones
|
||||
│ ├── DefinitionDetailPage.tsx # Detalle + assignments
|
||||
│ ├── AssignmentsPage.tsx # Lista asignaciones
|
||||
│ ├── AssignmentDetailPage.tsx # Progreso individual
|
||||
│ ├── MyGoalsPage.tsx # Mis metas
|
||||
│ └── ReportsPage.tsx # Reportes, exportación
|
||||
└── components/goals/
|
||||
├── GoalCard.tsx
|
||||
├── GoalForm.tsx
|
||||
├── GoalProgressBar.tsx # Con milestones
|
||||
├── GoalAssignmentCard.tsx
|
||||
├── ProgressLogList.tsx
|
||||
└── GoalsKPIGrid.tsx
|
||||
```
|
||||
|
||||
**Criterios de Aceptación:**
|
||||
- [ ] CRUD de definiciones de metas
|
||||
- [ ] Asignación a usuarios/equipos
|
||||
- [ ] Tracking de progreso con logs
|
||||
- [ ] Visualización de milestones
|
||||
- [ ] Dashboard con KPIs
|
||||
- [ ] Reportes por período
|
||||
- [ ] Notificaciones de milestones alcanzados
|
||||
|
||||
---
|
||||
|
||||
## SPRINT 3: CALIDAD Y TESTS (P2)
|
||||
|
||||
**Objetivo:** Mejorar calidad, accesibilidad y cobertura de tests
|
||||
**SP Total:** 14
|
||||
**Paralelismo:** Todas las subtareas pueden ejecutarse en paralelo
|
||||
|
||||
### ST-3.1: Mejora Accesibilidad WCAG 2.1
|
||||
|
||||
| Aspecto | Detalle |
|
||||
|---------|---------|
|
||||
| **ID** | ST-3.1-WCAG-IMPROVE |
|
||||
| **SP** | 5 |
|
||||
| **Prioridad** | P2 |
|
||||
| **Dependencias** | Sprint 1 y 2 completados |
|
||||
| **Paralelizable** | Sí |
|
||||
|
||||
**CAPVED:**
|
||||
|
||||
| Fase | Actividad | Output |
|
||||
|------|-----------|--------|
|
||||
| **C** | Auditar con axe DevTools, WAVE | Lista de issues |
|
||||
| **A** | Categorizar por severidad y esfuerzo | Plan priorizado |
|
||||
| **P** | Definir fixes para 90% cobertura | Checklist |
|
||||
| **E** | Aplicar fixes en ~20 componentes | Código mejorado |
|
||||
| **V** | Re-auditar, keyboard nav test | Score WCAG |
|
||||
| **D** | Crear ACCESSIBILITY-REPORT.md | Docs |
|
||||
|
||||
**Áreas a mejorar:**
|
||||
```
|
||||
1. Semantic HTML
|
||||
- Reemplazar <div onClick> → <button>
|
||||
- Agregar <main>, <nav>, <article> donde falten
|
||||
|
||||
2. ARIA Labels
|
||||
- aria-label en iconos sin texto
|
||||
- aria-describedby en campos con validación
|
||||
- role="dialog" en modales
|
||||
|
||||
3. Keyboard Navigation
|
||||
- Focus trap en modales
|
||||
- Skip links al contenido principal
|
||||
- Arrow key navigation en menús
|
||||
|
||||
4. Color Contrast
|
||||
- Verificar ratios en dark mode
|
||||
- Ajustar grays de Tailwind si necesario
|
||||
|
||||
5. Focus Indicators
|
||||
- focus:ring-2 focus:ring-primary en todos los interactivos
|
||||
- focus-visible para mejor UX
|
||||
```
|
||||
|
||||
**Criterios de Aceptación:**
|
||||
- [ ] 0 errores críticos en axe DevTools
|
||||
- [ ] <5 warnings en WAVE
|
||||
- [ ] Navegación completa por teclado
|
||||
- [ ] Ratio contraste ≥4.5:1 en textos
|
||||
- [ ] Focus visible en todos los elementos
|
||||
|
||||
---
|
||||
|
||||
### ST-3.2: Tests Unitarios Frontend
|
||||
|
||||
| Aspecto | Detalle |
|
||||
|---------|---------|
|
||||
| **ID** | ST-3.2-UNIT-TESTS |
|
||||
| **SP** | 5 |
|
||||
| **Prioridad** | P2 |
|
||||
| **Dependencias** | Ninguna |
|
||||
| **Paralelizable** | Sí |
|
||||
|
||||
**CAPVED:**
|
||||
|
||||
| Fase | Actividad | Output |
|
||||
|------|-----------|--------|
|
||||
| **C** | Revisar cobertura actual, identificar gaps | Lista de módulos |
|
||||
| **A** | Priorizar por criticidad (auth, billing) | Plan de tests |
|
||||
| **P** | Definir 50+ tests para hooks y componentes | Test specs |
|
||||
| **E** | Implementar tests con Vitest + Testing Library | Código tests |
|
||||
| **V** | npm run test:coverage → 70%+ | Reporte cobertura |
|
||||
| **D** | Actualizar README con instrucciones | Docs |
|
||||
|
||||
**Tests a crear:**
|
||||
```
|
||||
frontend/src/__tests__/
|
||||
├── hooks/
|
||||
│ ├── useAuth.test.ts # 10 tests
|
||||
│ ├── useRbac.test.ts # 8 tests
|
||||
│ ├── useGoals.test.ts # 8 tests
|
||||
│ ├── useMlm.test.ts # 8 tests
|
||||
│ └── usePortfolio.test.ts # 8 tests
|
||||
├── components/
|
||||
│ ├── rbac/RoleForm.test.tsx # 5 tests
|
||||
│ ├── goals/GoalProgressBar.test.tsx # 5 tests
|
||||
│ └── mlm/NetworkTree.test.tsx # 5 tests
|
||||
└── pages/
|
||||
├── RolesPage.test.tsx # 5 tests
|
||||
└── GoalsDashboardPage.test.tsx # 5 tests
|
||||
```
|
||||
|
||||
**Criterios de Aceptación:**
|
||||
- [ ] 50+ tests nuevos
|
||||
- [ ] Cobertura hooks ≥80%
|
||||
- [ ] Cobertura componentes críticos ≥70%
|
||||
- [ ] Todos los tests pasan
|
||||
- [ ] CI/CD ejecuta tests automáticamente
|
||||
|
||||
---
|
||||
|
||||
### ST-3.3: Documentación Páginas Faltantes
|
||||
|
||||
| Aspecto | Detalle |
|
||||
|---------|---------|
|
||||
| **ID** | ST-3.3-DOCS-PAGES |
|
||||
| **SP** | 3 |
|
||||
| **Prioridad** | P2 |
|
||||
| **Dependencias** | Sprint 2 completado |
|
||||
| **Paralelizable** | Sí |
|
||||
|
||||
**CAPVED:**
|
||||
|
||||
| Fase | Actividad | Output |
|
||||
|------|-----------|--------|
|
||||
| **C** | Listar 11 páginas sin doc (del análisis) | Lista completa |
|
||||
| **A** | Revisar cada página, extraer specs | Información recopilada |
|
||||
| **P** | Definir formato estándar de spec | Template |
|
||||
| **E** | Crear 11 specs en docs/05-frontend/ | Archivos .md |
|
||||
| **V** | Verificar links, coherencia con código | Review |
|
||||
| **D** | Actualizar FRONTEND-PAGES-SPEC.md | Índice actualizado |
|
||||
|
||||
**Páginas a documentar:**
|
||||
1. DashboardSettingsPage
|
||||
2. DashboardStoragePage
|
||||
3. DashboardAnalyticsPage
|
||||
4. SettingsProfilePage
|
||||
5. SettingsSecurityPage
|
||||
6. OnboardingSteps 4-6
|
||||
7. AdminWebhooksPage
|
||||
8. AdminNotificationsPage
|
||||
9. AdminAuditPage
|
||||
10. AdminRbacPage
|
||||
11. PortfolioPages (nuevas)
|
||||
|
||||
**Criterios de Aceptación:**
|
||||
- [ ] 11 specs creadas
|
||||
- [ ] Formato consistente
|
||||
- [ ] Incluye: props, rutas, componentes usados
|
||||
- [ ] Links a código fuente
|
||||
- [ ] Índice actualizado
|
||||
|
||||
---
|
||||
|
||||
### ST-3.4: Eliminar Dead Code
|
||||
|
||||
| Aspecto | Detalle |
|
||||
|---------|---------|
|
||||
| **ID** | ST-3.4-DEAD-CODE |
|
||||
| **SP** | 1 |
|
||||
| **Prioridad** | P2 |
|
||||
| **Dependencias** | ST-2.1 Portfolio completado |
|
||||
| **Paralelizable** | Sí |
|
||||
|
||||
**CAPVED:**
|
||||
|
||||
| Fase | Actividad | Output |
|
||||
|------|-----------|--------|
|
||||
| **C** | Verificar uso de usePortfolio tras implementar UI | Estado actual |
|
||||
| **A** | Si UI usa hook → mantener; si no → eliminar | Decisión |
|
||||
| **P** | Plan de eliminación segura | Checklist |
|
||||
| **E** | Eliminar código no usado, actualizar imports | Código limpio |
|
||||
| **V** | npm run build, npm run lint | Build exitoso |
|
||||
| **D** | Documentar decisión en ADR o README | Registro |
|
||||
|
||||
**Nota:** Esta subtarea depende de si Portfolio UI usa el hook existente o crea uno nuevo.
|
||||
|
||||
---
|
||||
|
||||
## SPRINT 4: LIMPIEZA Y DOCUMENTACIÓN (P3)
|
||||
|
||||
**Objetivo:** Limpiar archivos obsoletos y actualizar documentación
|
||||
**SP Total:** 3
|
||||
**Paralelismo:** Ambas subtareas pueden ejecutarse en paralelo
|
||||
|
||||
### ST-4.1: Purga Documentación Obsoleta
|
||||
|
||||
| Aspecto | Detalle |
|
||||
|---------|---------|
|
||||
| **ID** | ST-4.1-PURGE-DOCS |
|
||||
| **SP** | 1 |
|
||||
| **Prioridad** | P3 |
|
||||
| **Dependencias** | Ninguna |
|
||||
| **Paralelizable** | Sí |
|
||||
|
||||
**CAPVED:**
|
||||
|
||||
| Fase | Actividad | Output |
|
||||
|------|-----------|--------|
|
||||
| **C** | Listar 57 archivos a purgar (del análisis previo) | Lista verificada |
|
||||
| **A** | Verificar que no hay referencias activas | grep results |
|
||||
| **P** | Plan de backup y eliminación | Script bash |
|
||||
| **E** | Ejecutar purga de _archive/ | 620 KB liberados |
|
||||
| **V** | Verificar que nada se rompe | Build exitoso |
|
||||
| **D** | Documentar en CHANGELOG | Registro |
|
||||
|
||||
**Carpetas a purgar:**
|
||||
```bash
|
||||
# Verificar referencias primero
|
||||
grep -r "2026-01-07-trazas" orchestration/ docs/
|
||||
grep -r "simco-v37" orchestration/ docs/
|
||||
grep -r "sprint5" orchestration/ docs/
|
||||
|
||||
# Backup
|
||||
cp -r orchestration/_archive/ orchestration/_archive_backup_$(date +%Y%m%d)/
|
||||
|
||||
# Purgar
|
||||
rm -rf orchestration/_archive/2026-01-07-trazas/
|
||||
rm -rf orchestration/_archive/2026-01-10-simco-v37/
|
||||
rm -rf orchestration/_archive/2026-01-10-sprint5/
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
### ST-4.2: Actualizar Inventarios y Specs
|
||||
|
||||
| Aspecto | Detalle |
|
||||
|---------|---------|
|
||||
| **ID** | ST-4.2-UPDATE-INVENTORY |
|
||||
| **SP** | 2 |
|
||||
| **Prioridad** | P3 |
|
||||
| **Dependencias** | Sprints 1-3 completados |
|
||||
| **Paralelizable** | Sí |
|
||||
|
||||
**CAPVED:**
|
||||
|
||||
| Fase | Actividad | Output |
|
||||
|------|-----------|--------|
|
||||
| **C** | Revisar estado actual de inventarios | Gaps identificados |
|
||||
| **A** | Comparar con código implementado | Diferencias |
|
||||
| **P** | Plan de actualización | Checklist |
|
||||
| **E** | Actualizar YAML y MD files | Archivos actualizados |
|
||||
| **V** | Validar coherencia con código | Review |
|
||||
| **D** | Commit con mensaje descriptivo | Git history |
|
||||
|
||||
**Archivos a actualizar:**
|
||||
```
|
||||
orchestration/inventarios/
|
||||
├── FRONTEND_INVENTORY.yml # Agregar nuevas páginas, componentes
|
||||
├── MASTER_INVENTORY.yml # Actualizar estadísticas
|
||||
└── DATABASE_INVENTORY.yml # Si hay cambios
|
||||
|
||||
docs/05-frontend/
|
||||
├── FRONTEND-PAGES-SPEC.md # Agregar páginas nuevas
|
||||
├── FRONTEND-ROUTING.md # Agregar nuevas rutas
|
||||
└── FRONTEND-COMPONENTS.md # Agregar nuevos componentes (si existe)
|
||||
|
||||
docs/_MAP.md # Actualizar índice general
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## MAPA DE DEPENDENCIAS
|
||||
|
||||
```
|
||||
┌─────────────────────────────────────────────────────────────────┐
|
||||
│ SPRINT 1 (P0) - 11 SP │
|
||||
│ │
|
||||
│ ┌──────────┐ ┌──────────┐ ┌──────────────┐ │
|
||||
│ │ ST-1.1 │ │ ST-1.2 │ │ ST-1.3 │ │
|
||||
│ │ RBAC │ │ Audit │ │ Notifications│ PARALELO │
|
||||
│ │ 5 SP │ │ 3 SP │ │ 3 SP │ │
|
||||
│ └────┬─────┘ └────┬─────┘ └──────┬───────┘ │
|
||||
│ │ │ │ │
|
||||
│ └──────────────┼────────────────┘ │
|
||||
│ │ │
|
||||
│ ▼ │
|
||||
├─────────────────────────────────────────────────────────────────┤
|
||||
│ SPRINT 2 (P1) - 21 SP │
|
||||
│ │
|
||||
│ ┌──────────┐ ┌──────────┐ ┌──────────┐ │
|
||||
│ │ ST-2.1 │ │ ST-2.2 │ │ ST-2.3 │ │
|
||||
│ │Portfolio │◄──│ MLM │ │ Goals │ PARALELO │
|
||||
│ │ 5 SP │ │ 8 SP │ │ 8 SP │ (MLM usa │
|
||||
│ └────┬─────┘ └────┬─────┘ └────┬─────┘ Portfolio │
|
||||
│ │ │ │ opcional) │
|
||||
│ └──────────────┼──────────────┘ │
|
||||
│ │ │
|
||||
│ ▼ │
|
||||
├─────────────────────────────────────────────────────────────────┤
|
||||
│ SPRINT 3 (P2) - 14 SP │
|
||||
│ │
|
||||
│ ┌──────────┐ ┌──────────┐ ┌──────────┐ ┌──────────┐ │
|
||||
│ │ ST-3.1 │ │ ST-3.2 │ │ ST-3.3 │ │ ST-3.4 │ │
|
||||
│ │ WCAG │ │ Tests │ │ Docs │ │ Dead │ │
|
||||
│ │ 5 SP │ │ 5 SP │ │ 3 SP │ │ Code │ │
|
||||
│ └────┬─────┘ └────┬─────┘ └────┬─────┘ │ 1 SP │ │
|
||||
│ │ │ │ └────┬─────┘ │
|
||||
│ └──────────────┼──────────────┼──────────────┘ │
|
||||
│ │ │ │
|
||||
│ ▼ │ │
|
||||
├─────────────────────────────────────────────────────────────────┤
|
||||
│ SPRINT 4 (P3) - 3 SP │
|
||||
│ │
|
||||
│ ┌──────────┐ ┌──────────┐ │
|
||||
│ │ ST-4.1 │ │ ST-4.2 │ │
|
||||
│ │ Purge │ │ Inventory│ PARALELO │
|
||||
│ │ 1 SP │ │ 2 SP │ │
|
||||
│ └──────────┘ └──────────┘ │
|
||||
│ │
|
||||
│ ▼ │
|
||||
│ COMPLETADO │
|
||||
└─────────────────────────────────────────────────────────────────┘
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## ORQUESTACIÓN DE SUBAGENTES
|
||||
|
||||
### Configuración Recomendada
|
||||
|
||||
```yaml
|
||||
# Para Sprint 1 (3 subagentes en paralelo)
|
||||
subagentes_sprint_1:
|
||||
- id: SA-1.1
|
||||
tipo: general-purpose
|
||||
tarea: ST-1.1-RBAC-FRONTEND
|
||||
archivos_foco:
|
||||
- backend/src/modules/rbac/
|
||||
- frontend/src/pages/dashboard/rbac/
|
||||
- frontend/src/hooks/useRbac.ts
|
||||
|
||||
- id: SA-1.2
|
||||
tipo: general-purpose
|
||||
tarea: ST-1.2-AUDIT-COMPLETE
|
||||
archivos_foco:
|
||||
- backend/src/modules/audit/
|
||||
- frontend/src/pages/dashboard/AuditLogsPage.tsx
|
||||
- frontend/src/hooks/useAudit.ts
|
||||
|
||||
- id: SA-1.3
|
||||
tipo: general-purpose
|
||||
tarea: ST-1.3-NOTIFICATIONS-COMPLETE
|
||||
archivos_foco:
|
||||
- backend/src/modules/notifications/
|
||||
- frontend/src/pages/dashboard/notifications/
|
||||
- frontend/src/hooks/useNotifications.ts
|
||||
|
||||
# Para Sprint 2 (3 subagentes con dependencia parcial)
|
||||
subagentes_sprint_2:
|
||||
- id: SA-2.1
|
||||
tipo: general-purpose
|
||||
tarea: ST-2.1-PORTFOLIO-UI
|
||||
prioridad: 1 # Ejecutar primero
|
||||
|
||||
- id: SA-2.2
|
||||
tipo: general-purpose
|
||||
tarea: ST-2.2-MLM-UI
|
||||
prioridad: 2
|
||||
esperar: SA-2.1 # Opcional, por contexto de productos
|
||||
|
||||
- id: SA-2.3
|
||||
tipo: general-purpose
|
||||
tarea: ST-2.3-GOALS-UI
|
||||
prioridad: 1 # Independiente, ejecutar en paralelo
|
||||
```
|
||||
|
||||
### Prompt Template para Subagentes
|
||||
|
||||
```markdown
|
||||
# Subtarea: [ST-X.X]
|
||||
|
||||
## Contexto
|
||||
- Proyecto: template-saas
|
||||
- Módulo: [nombre]
|
||||
- Hooks disponibles: [lista]
|
||||
- Backend endpoints: [X endpoints]
|
||||
|
||||
## Objetivo
|
||||
[Descripción CAPVED]
|
||||
|
||||
## Archivos a crear/modificar
|
||||
[Lista específica]
|
||||
|
||||
## Criterios de aceptación
|
||||
[Lista verificable]
|
||||
|
||||
## Validaciones requeridas
|
||||
- npm run build
|
||||
- npm run lint
|
||||
- Pruebas manuales de flujo
|
||||
- Actualizar inventarios
|
||||
|
||||
## Output esperado
|
||||
- Código funcional
|
||||
- Documentación actualizada
|
||||
- Tests si aplica
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## RESUMEN FINAL
|
||||
|
||||
| Sprint | Subtareas | SP | Paralelismo | Duración Estimada |
|
||||
|--------|-----------|-----|-------------|-------------------|
|
||||
| Sprint 1 | 3 | 11 | 100% | 1-2 días |
|
||||
| Sprint 2 | 3 | 21 | 66% | 2-3 días |
|
||||
| Sprint 3 | 4 | 14 | 100% | 1-2 días |
|
||||
| Sprint 4 | 2 | 3 | 100% | 0.5 días |
|
||||
| **Total** | **12** | **49** | - | **5-8 días** |
|
||||
|
||||
### Próximos Pasos
|
||||
|
||||
1. **Aprobación del plan** por parte del usuario
|
||||
2. **Selección de Sprint** a ejecutar
|
||||
3. **Orquestación de subagentes** según mapa de dependencias
|
||||
4. **Ejecución CAPVED** de cada subtarea
|
||||
5. **Validación cruzada** al completar cada sprint
|
||||
6. **Actualización de inventarios** al finalizar
|
||||
|
||||
---
|
||||
|
||||
*Generado: 2026-02-03 | Agente: Claude Opus 4.5 | Metodología: SIMCO v4.0.0 + CAPVED*
|
||||
@ -1,16 +1,16 @@
|
||||
# Indice de Tareas - template-saas
|
||||
# orchestration/tareas/_INDEX.yml
|
||||
|
||||
version: "1.4.0"
|
||||
version: "1.5.0"
|
||||
proyecto: template-saas
|
||||
tipo: PROVIDER
|
||||
created: "2026-01-24"
|
||||
updated: "2026-02-03"
|
||||
|
||||
resumen:
|
||||
total_tareas: 10
|
||||
total_tareas: 11
|
||||
completadas: 10
|
||||
en_progreso: 0
|
||||
en_progreso: 1
|
||||
pendientes: 0
|
||||
|
||||
# Formato de ID: TASK-YYYY-MM-DD-NNN
|
||||
@ -77,6 +77,17 @@ por_fecha:
|
||||
sp: 3
|
||||
modulo: "auth, rbac, tenants"
|
||||
nota: "password_hash nullable, slug NOT NULL, tests corregidos"
|
||||
- id: "TASK-2026-02-03-AUDITORIA-FRONTEND-UX-UI"
|
||||
titulo: "Auditoría y Planificación Frontend/UX-UI"
|
||||
tipo: "analysis"
|
||||
estado: "en_progreso"
|
||||
sp: 49
|
||||
modulo: "frontend"
|
||||
fase_actual: "PLANIFICACION"
|
||||
nota: |
|
||||
Análisis de coherencia frontend vs requerimientos.
|
||||
12 gaps identificados, 4 sprints planificados.
|
||||
Módulos pendientes: RBAC, Portfolio, MLM, Goals UI.
|
||||
"2026-01-30":
|
||||
- id: "TASK-2026-01-30-TEMPLATE-SAAS-SUBMODULES-SYNC"
|
||||
titulo: "Integración Submodules y Sincronización Orchestration"
|
||||
@ -100,7 +111,29 @@ por_fecha:
|
||||
- "Corregir test expectations"
|
||||
|
||||
# Tareas activas
|
||||
tareas_activas: []
|
||||
tareas_activas:
|
||||
- id: "TASK-2026-02-03-AUDITORIA-FRONTEND-UX-UI"
|
||||
titulo: "Auditoría y Planificación Frontend/UX-UI"
|
||||
fase_actual: "PLANIFICACION"
|
||||
sp_total: 49
|
||||
sp_ejecutados: 21
|
||||
subtareas:
|
||||
sprint_1_p0:
|
||||
- "ST-1.1-RBAC-FRONTEND (5 SP)"
|
||||
- "ST-1.2-AUDIT-COMPLETE (3 SP)"
|
||||
- "ST-1.3-NOTIFICATIONS-COMPLETE (3 SP)"
|
||||
sprint_2_p1:
|
||||
- "ST-2.1-PORTFOLIO-UI (5 SP)"
|
||||
- "ST-2.2-MLM-UI (8 SP)"
|
||||
- "ST-2.3-GOALS-UI (8 SP)"
|
||||
sprint_3_p2:
|
||||
- "ST-3.1-WCAG-IMPROVE (5 SP)"
|
||||
- "ST-3.2-UNIT-TESTS (5 SP)"
|
||||
- "ST-3.3-DOCS-PAGES (3 SP)"
|
||||
- "ST-3.4-DEAD-CODE (1 SP)"
|
||||
sprint_4_p3:
|
||||
- "ST-4.1-PURGE-DOCS (1 SP)"
|
||||
- "ST-4.2-UPDATE-INVENTORY (2 SP)"
|
||||
|
||||
# Tareas completadas
|
||||
tareas_completadas:
|
||||
|
||||
Loading…
Reference in New Issue
Block a user