rckrdmrd/workspace
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
main
workspace/projects/gamilit/docs/frontend/COMPONENTES-INVENTARIO.md
rckrdmrd 05cd7aa966 docs: Correcciones P2 completas - Social API, componentes, views, inventarios 
Fase 5 completada (21/21 correcciones ejecutadas):

P2-001: Documentar Social API (10 controllers, 106 endpoints)
P2-002: Documentar componentes Frontend (497 componentes, 103 hooks)
P2-003: Actualizar FRONTEND_INVENTORY.yml a v4.0
P2-004: Documentar views Database (17 views en 7 schemas)
P2-005: Documentar rutas duplicadas Auth (requiere refactor)
P2-006: Documentar código muerto Teacher (requiere refactor)

Archivos creados:
- docs/90-transversal/api/API-SOCIAL-MODULE.md
- docs/frontend/COMPONENTES-INVENTARIO.md
- docs/database/VIEWS-INVENTARIO.md

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
2025-12-26 15:57:07 -06:00

7.5 KiB
Raw Permalink Blame History

COMPONENTES FRONTEND - INVENTARIO

Proyecto: GAMILIT - Plataforma Educativa Gamificada Version: 1.0 Fecha: 2025-12-26 Auditoria: Inventario real de componentes implementados

RESUMEN EJECUTIVO

Categoria Componentes Descripcion
Shared 40 Componentes base reutilizables
Features (main) 31 Componentes de funcionalidad core
Gamification 71 Sistema de gamificacion completo
Mechanics 156 Mecanicas educativas (30 ejercicios)
Apps 180 Componentes por portal (Admin, Teacher, Student)
TOTAL 478 -

1. COMPONENTES COMPARTIDOS (40)

Ubicacion: src/shared/components/

Por Subcategoria

Subcategoria Cantidad Ejemplos
Base 11 Toast, StatusBadge, ColorfulCard, RankBadge, LoadingOverlay
Common 9 Componentes de uso general
Layout 3 Componentes de estructura de pagina
Mechanics 11 MediaUploader, RubricEvaluator, ExerciseContentRenderer
Timeline 2 Componentes de linea de tiempo
Loading 2 Componentes de estado de carga
Celebrations 1 Feedback positivo
Media 1 Manejo de multimedia

Componentes Clave

Componente Proposito
ProtectedRoute Rutas protegidas por autenticacion
MediaUploader Carga de archivos multimedia M4-M5
RubricEvaluator Evaluacion con rubricas para docentes
ExerciseContentRenderer Renderiza contenido de ejercicios
LoadingOverlay Overlay de carga global

2. COMPONENTES DE FEATURES (31)

Ubicacion: src/features/*/components/

Por Feature

Feature Componentes Estado
Auth 13 Completo
Exercises 11 Completo
Admin 2 Basico
Gamification (main) 3 Completo
Notifications 2 Completo

3. GAMIFICACION (71)

Ubicacion: src/features/gamification/*/components/

Por Subfeature

Subfeature Componentes Descripcion
Social 43 Amigos, mensajes, activity feed
Economy 13 ML Coins, shop, precios
Ranks 8 Sistema de rangos Maya
Missions 7 Misiones y desafios

Componentes Destacados

Componente Subfeature Proposito
FriendsList Social Lista de amigos con estados
LeaderboardTable Social Tabla de clasificacion
ShopItemCard Economy Tarjeta de item en tienda
CoinDisplay Economy Muestra ML Coins
MayaRankBadge Ranks Badge de rango Maya
MissionCard Missions Tarjeta de mision

4. MECANICAS EDUCATIVAS (156)

Ubicacion: src/features/mechanics/*/

Por Modulo

Modulo Componentes Mecanicas
Auxiliar 16 4 (CallToAction, CollagePrensa, ComprencionAuditiva, TextoEnMovimiento)
Module 1 38 7 (Crucigrama, Emparejamiento, VerdaderoFalso, MapaConceptual, SopaLetras, Timeline, CompletarEspacios)
Module 2 27 6 (DetectiveTextual, LecturaInferencial, PrediccionNarrativa, ConstruccionHipotesis, RuedaInferencias, PuzzleContexto)
Module 3 25 5 (DebateDigital, AnalisisFuentes, TribunalOpiniones, MatrizPerspectivas, PodcastArgumentativo)
Module 4 32 5 (VerificadorFakeNews, AnalisisMemes, NavegacionHipertextual, InfografiaInteractiva, QuizTikTok)
Module 5 12 3 (ComicDigital, DiarioMultimedia, VideoCarta)
Shared 6 APIs, hooks, utils compartidos

Estructura por Mecanica

Cada mecanica tiene:

  • *Exercise.tsx - Componente principal
  • *Types.ts - Tipos TypeScript
  • *Schemas.ts - Schemas Zod
  • *MockData.ts - Datos de prueba
  • Componentes auxiliares especificos

5. COMPONENTES POR APP (180)

Admin App (85)

Ubicacion: src/apps/admin/components/

Subcategoria Cantidad Ejemplos
Advanced 9 TenantManagement, BulkOperations
Alerts 9 SystemAlertsTable, AlertDetailsModal
Analytics 4 AnalyticsCharts, MetricsCards
Assignments 4 AssignmentsTable, AssignmentFilters
Classroom-Teacher 2 Asignacion profesor-aula
Content 5 ContentTable, ContentEditor
Dashboard 10 StatsCards, RecentActivity
Gamification 7 RankDistribution, XPGraph
Institutions 5 SchoolsTable, ClassroomsPanel
Monitoring 10 LogsViewer, SystemMetrics
Progress 5 ProgressOverview, ModuleStats
Reports 4 ReportGenerator, ExportOptions
Roles 4 RolesTable, PermissionsMatrix
Settings 3 GeneralSettings, SecuritySettings
Users 4 UsersTable, UserDetailsModal

Teacher App (47)

Ubicacion: src/apps/teacher/components/

Subcategoria Cantidad Ejemplos
Dashboard 11 TeacherStats, ClassOverview
Assignments 6 AssignmentEditor, DueDate
Analytics 3 StudentProgress, ModuleAnalytics
Grading 2 GradingPanel, RubricEditor
Monitoring 5 AlertsPanel, ActivityFeed
Responses 3 ResponsesTable, ResponseDetailModal
Progress 4 StudentProgressCard, ModuleProgress
Reports 2 ClassReport, StudentReport
Communication 6 MessageComposer, AnnouncementForm
Collaboration 2 TeamBuilder, GroupAssigner
Alerts 2 InterventionAlertsPanel, AlertFilters

Student App (48)

Ubicacion: src/apps/student/components/

Subcategoria Cantidad Ejemplos
Dashboard 22 ProgressWidget, MissionsPreview, RankDisplay
Exercise 6 ExerciseCard, ExerciseTimer
Achievements 7 AchievementsPreview, BadgeDisplay
Gamification 7 CoinBalance, XPProgress
Interactions 2 FeedbackModal, HelpRequest
Notifications 3 NotificationBell, NotificationList

6. HOOKS (103)

Resumen

Ubicacion Cantidad
Shared hooks 12
Admin hooks 23
Teacher hooks 21
Student hooks 13
Auth hooks 6
Exercises hooks 4
Gamification Economy 5
Gamification Ranks 6
Gamification Social 7
Gamification Missions 1
Notifications 2
Progress 1
Root hooks 2

Hooks Compartidos Clave

Hook Proposito
useAuth Autenticacion y usuario actual
useInvalidateDashboard Refrescar datos dashboard
useSanitizedHTML Sanitizar HTML para XSS
useVideoRecorder Grabacion de video M5
useAudioRecorder Grabacion de audio M5

7. STORES (Zustand)

Store Proposito
authStore Estado de autenticacion
userStore Datos del usuario
leaderboardsStore Datos de clasificacion
missionsStore Misiones activas
shopStore Estado de tienda
notificationsStore Notificaciones
exerciseStore Estado de ejercicio actual

8. PATRONES ARQUITECTONICOS

Component/Page Pattern

Usado en Teacher Portal:

  • TeacherXXX.tsx = Componente core con logica
  • TeacherXXXPage.tsx = Wrapper con TeacherLayout

Feature-First Organization

features/
  gamification/
    social/
      components/
      hooks/
      store/
      types/
      api/

Barrel Exports

Cada carpeta tiene index.ts para exports centralizados.

9. ESTADISTICAS TECNICAS

Metrica Valor
Componentes totales 478
Hooks totales 103
Stores (Zustand) 11
Mecanicas educativas 30
LOC estimadas ~100,000

Generado por: Requirements-Analyst Fecha: 2025-12-26 Version: 1.0