🧠 MindCare API Documentation

Plataforma de Bienestar Emocional con Inteligencia Artificial

Build Status License Node.js React MongoDB Docker

RGPD Grok AI CI/CD Security


🌐 Demo en Vivo · 📖 Documentación API · 🐛 Reportar Bug · 💡 Solicitar Feature


🎯 Nuestra Misión

Democratizar el acceso al seguimiento emocional con rigor clínico.

MindCare nace de una realidad preocupante: millones de personas enfrentan síntomas depresivos sin acceso a recursos profesionales debido a barreras económicas, geográficas o estigma social.

Nuestra plataforma combina fundamentos clínicos basados en el DSM-5 y técnicas de Behavioral Activation con tecnología moderna y accesible, ofreciendo herramientas de autogestión emocional respaldadas por evidencia científica.

No reemplazamos la terapia profesional — somos el puente que acompaña a quienes necesitan apoyo mientras buscan ayuda especializada.


📑 Índice


✨ Características Principales

🤖 Análisis con Grok AI

Integración con Grok AI (OpenRoute) para análisis inteligente de patrones emocionales, detección de tendencias y recomendaciones personalizadas basadas en el historial del usuario.

📔 Diario Seguro con Protección Criptográfica

Diario personal con sistema de contraseñas por entrada que permite compartir reflexiones de forma segura. Contraseñas hasheadas con bcrypt (10 salt rounds).

📊 Tracking Emocional Basado en Evidencia

Sistema de registros diarios diseñado según guías clínicas (DSM-5, NICE, APA): estado de ánimo, calidad de sueño, niveles de ansiedad, actividades y cogniciones.

🆘 Sistema de Emergencia Integrado

Botón de pánico con envío automático de emails a contactos de emergencia. Acceso directo a líneas de ayuda profesional cuando más se necesita.

🔐 Seguridad Enterprise-Grade

Autenticación JWT, headers seguros con Helmet, CORS configurado, encriptación bcrypt y validación exhaustiva de inputs en todos los endpoints.

📈 Observabilidad Avanzada

Health checks automatizados, logging estructurado con Morgan/Winston y endpoints de monitoreo para garantizar disponibilidad 24/7.

Aplicación desplegada

MindCare está completamente dockerizada y lista para despliegue en producción con CI/CD automatizado.

Despliegue Local con Docker

# Clonar repositorio
git clone https://github.com/AdrianDiaz24/DAW2-Proyecto-Grupo-7.git
cd DAW2-Proyecto-Grupo-7

# Configurar variables de entorno
cp .env.docker.example .env

# Levantar todos los servicios (Frontend, Backend, MongoDB)
docker-compose up -d

# Acceder a la aplicación
# Frontend: http://localhost:3000
# Backend API: http://localhost:5000/api

Imágenes Docker Disponibles

Las imágenes de Docker están publicadas en Docker Hub y actualizadas automáticamente con CI/CD:

  • Backend: dockerhub-username/mindcare-backend:latest
  • Frontend: dockerhub-username/mindcare-frontend:latest

URL de Producción

URL de producción: https://mindcare.com

Nota: La aplicación está desplegada tanto en Render como Vercel usando las imágenes Docker generadas automáticamente por GitHub Actions.

Desplegar tu Propia Instancia

Documentación completa de despliegue: docs/despliegue.md

El documento de despliegue incluye:

  • Arquitectura de despliegue con diagramas
  • Configuración de Docker y Docker Compose
  • Pipeline CI/CD con GitHub Actions
  • Guía paso a paso para Render
  • Variables de entorno y configuraciones
  • Troubleshooting y resolución de problemas
  • Buenas prácticas implementadas

Despliegue en Render (Recomendado):

  • ✅ Tier gratuito con 750h/mes
  • ✅ HTTPS automático
  • ✅ Deploy automático desde Docker Hub
  • ✅ MongoDB Atlas incluido
  • ✅ URL pública accesible

Ver guía paso a paso detallada: docs/despliegue.md

CI/CD Automatizado

El proyecto incluye GitHub Actions workflows que automatizan:

Build y Push a Docker Hub - Cada push a main o dev construye y publica nuevas imágenes versionadas automáticamente
Generación de Documentación JSDoc - Documentación del código generada automáticamente y desplegada en GitHub Pages
Generación de PDFs - Documentación en formato PDF disponible en artifacts de GitHub Actions
Deploy a GitHub Pages - Documentación técnica accesible públicamente en https://adriandiaz24.github.io/DAW2-Proyecto-Grupo-7/

Workflows disponibles:

  • docker-build.yml - Construcción y publicación de imágenes Docker
  • docs-build.yml - Generación y despliegue de documentación JSDoc

Ver workflows en: .github/workflows/


🛠️ Stack Tecnológico

Frontend

Tecnología Versión Propósito
React 18.2.0 UI Library con Hooks y Functional Components
React Router DOM 6.20.0 Client-side Routing y navegación SPA
Zustand 5.0.8 State Management minimalista
Axios 1.6.2 HTTP Client con interceptors
React Hot Toast 2.6.0 Sistema de notificaciones UX

Backend

Tecnología Versión Propósito
Node.js 18.x JavaScript Runtime
Express 4.16.1 Web Framework minimalista
MongoDB 7.x+ Base de datos NoSQL
Mongoose 8.0.3 ODM con validación de esquemas
JWT 9.0.2 Autenticación stateless
bcryptjs 2.4.3 Hashing de contraseñas (10 rounds)
Helmet 7.1.0 Security headers HTTP
Nodemailer 7.0.11 Envío de emails SMTP

AI & Analytics

Tecnología Propósito
Grok AI (OpenRoute) Análisis de patrones emocionales
Morgan HTTP Request logging

DevOps & Infrastructure

Tecnología Propósito
Docker + Docker Compose Containerización multi-servicio
GitHub Actions CI/CD automatizado
Nginx Reverse proxy y static serving
Render.com Cloud hosting de producción
Docker Hub Registry de imágenes
JSDoc + Docdash Documentación automática

📊 Observabilidad y Monitoreo

MindCare implementa un sistema de observabilidad para garantizar la fiabilidad del servicio en producción.

Health Check Endpoint

GET /api/health
{
  "status": "ok",
  "message": "API is up and running",
  "timestamp": "2026-02-13T10:00:00.000Z"
}

Logging Estructurado

El sistema utiliza Morgan para logging de requests HTTP:

GET /api/auth/profile 200 15.234 ms - 256
POST /api/registro 201 45.123 ms - 512
GET /api/diario 200 23.456 ms - 1024

Docker Health Checks

Los contenedores incluyen verificación automática de estado:

healthcheck:
  test: ["CMD", "wget", "--quiet", "--tries=1", "--spider", "http://localhost:4000/api/health"]
  interval: 30s
  timeout: 10s
  retries: 3
  start_period: 40s

Métricas Recomendadas para Producción

Herramienta Propósito
Prometheus Recolección de métricas
Grafana Dashboards de visualización
Winston Logs estructurados a archivo/servicio
Sentry Error tracking y alertas

🏗️ Arquitectura

┌─────────────────────────────────────────────────────────────────┐
│                         CLIENTE                                  │
│                    (React + Zustand)                            │
└─────────────────────────────┬───────────────────────────────────┘
                              │ HTTPS
                              ▼
┌─────────────────────────────────────────────────────────────────┐
│                    NGINX (Reverse Proxy)                         │
│               SSL Termination + Static Files                     │
└─────────────────────────────┬───────────────────────────────────┘
                              │
                              ▼
┌─────────────────────────────────────────────────────────────────┐
│                      EXPRESS SERVER                              │
│  ┌─────────────────────────────────────────────────────────┐   │
│  │                   MIDDLEWARE STACK                       │   │
│  │  Helmet → CORS → Morgan → JSON Parser → Cookie Parser   │   │
│  └─────────────────────────────────────────────────────────┘   │
│                              │                                   │
│  ┌───────────────────────────┼───────────────────────────────┐ │
│  │                      ROUTES                               │ │
│  │  /auth  /diario  /registro  /formulario  /contactos  /ai │ │
│  └───────────────────────────┼───────────────────────────────┘ │
│                              │                                   │
│  ┌───────────────────────────┼───────────────────────────────┐ │
│  │              AUTH MIDDLEWARE (JWT)                        │ │
│  └───────────────────────────┼───────────────────────────────┘ │
│                              │                                   │
│  ┌───────────────────────────┼───────────────────────────────┐ │
│  │                   CONTROLLERS                             │ │
│  └───────────────────────────┼───────────────────────────────┘ │
└──────────────────────────────┼──────────────────────────────────┘
                               │
              ┌────────────────┼────────────────┐
              ▼                ▼                ▼
┌─────────────────┐  ┌─────────────────┐  ┌─────────────────┐
│    MONGODB      │  │    GROK AI      │  │     SMTP        │
│   (Mongoose)    │  │  (OpenRoute)    │  │  (Nodemailer)   │
└─────────────────┘  └─────────────────┘  └─────────────────┘

Modelos de Datos

Modelo Descripción
User Usuarios con autenticación y preferencias
Diario Entradas del diario con protección opcional
Registro Registros emocionales diarios estructurados
FormularioInicial Configuración personalizada del usuario
ContactoEmergencia Contactos para el sistema de emergencia

🚀 Instalación

🐳 The Fast Way (Docker Compose)

Ideal para: Demos, testing de integración, evaluación rápida

# 1. Clonar el repositorio
git clone https://github.com/AdrianDiaz24/DAW2-Proyecto-Grupo-7.git
cd DAW2-Proyecto-Grupo-7

# 2. Configurar variables de entorno
cp .env.docker.example .env
# Editar .env con tus credenciales de MongoDB Atlas

# 3. Levantar toda la infraestructura
docker-compose up -d

# 4. Verificar servicios
docker-compose ps

# 5. ¡Listo!
# Frontend: http://localhost:3000
# Backend:  http://localhost:4000/api
# Health:   http://localhost:4000/api/health
# Detener servicios
docker-compose down

🛠️ The Developer Way (Setup Manual)

Ideal para: Desarrollo activo, debugging, contribuciones al código

Prerrequisitos

Backend Setup

cd backend
npm install

Crear archivo .env:

# Server
PORT=4000
NODE_ENV=development

# Database
MONGODB_URI=mongodb://localhost:27017/mindcare

# Auth
JWT_SECRET=tu_clave_secreta_muy_segura_de_32_caracteres
JWT_EXPIRES_IN=1h

# CORS
FRONTEND_URL=http://localhost:3000

# Email (Sistema de Emergencia)
EMAIL_USER=tu_email@gmail.com
EMAIL_PASS=tu_app_password

# AI (Opcional)
OPENROUTE_API_KEY=tu_api_key
npm run dev
# ✅ Backend corriendo en http://localhost:4000

Frontend Setup

cd frontend
npm install

Crear archivo .env:

REACT_APP_API_URL=http://localhost:4000

⚠️ Importante: REACT_APP_API_URL debe apuntar a la URL base sin /api

npm start
# ✅ Frontend corriendo en http://localhost:3000

Verificar Instalación

# Health check del backend
curl http://localhost:4000/api/health
# Respuesta: {"status":"ok","message":"API is up and running",...}

📚 Documentación

📊 Documentation Roadmap

📋 Business & Planning

Fase Documento Descripción
1 Definición del Problema User personas, evidencia de investigación, propuesta de valor
1 Análisis de Competencias Estudio de 5 competidores, USP diferenciador
2 Viabilidad Técnica Stack justificado, riesgos técnicos, arquitectura
3 Objetivos y Alcance MVP, objetivos SMART, criterios de éxito
4 Recursos Necesarios Roles, herramientas, servicios externos
4 Estructura Organizativa Organigrama MindTracker Solutions S.L.
5 Financiación Plan financiero, proyección de ingresos
5 Presupuesto Costes detallados, Planning Poker, 432h desarrollo
6 Legislación RGPD, LOPD, cookies, accesibilidad

🔧 Technical Deep-Dive

Categoría Documento Descripción
Arquitectura Backend README Single Source of Truth del backend
API API Reference Especificación completa de endpoints
Seguridad Arquitectura Auth Flujos JWT, mejores prácticas
Desarrollo Middleware Guide Guía técnica authMiddleware
Networking Configuración CORS Setup, testing, troubleshooting
Testing Guía de Postman Colección y flujos de prueba
DevOps Despliegue Docker, CI/CD, Render

📅 Sprint Documentation

Documento Contenido
Planificación de Sprints 6 sprints con fechas y objetivos
Entregables por Sprint Funcionalidades por iteración
Investigación Tracker Sistema de seguimiento emocional (DSM-5)
Formulario Inicial Diseño basado en Behavioral Activation

🔗 Recursos Externos

Recurso Descripción
📖 GitHub Pages Documentación JSDoc autogenerada
📋 Wiki del Proyecto SCRUM, actas, guías
🌍 DeepWiki Versión multiidioma
📦 Módulo Optativa Cumplimiento de requisitos

📥 PDFs: Disponibles en Actions → Artifacts del repositorio.


🚢 Despliegue en Producción

URL de Producción

🌐 https://mindcare-frontend.onrender.com

Imágenes Docker

Las imágenes se publican automáticamente con cada push a main:

# Backend
docker pull [dockerhub-username]/mindcare-backend:latest

# Frontend  
docker pull [dockerhub-username]/mindcare-frontend:latest

Desplegar tu Propia Instancia

Opción recomendada: Render.com

  • ✅ Tier gratuito (750h/mes)
  • ✅ HTTPS automático
  • ✅ Deploy desde Docker Hub
  • ✅ Variables de entorno seguras

📖 Guía completa: docs/despliegue.md


🔄 CI/CD Pipeline

┌─────────────┐     ┌─────────────┐     ┌─────────────┐     ┌─────────────┐
│   Commit    │────▶│   GitHub    │────▶│   Docker    │────▶│   Render    │
│   to main   │     │   Actions   │     │    Hub      │     │   Deploy    │
└─────────────┘     └─────────────┘     └─────────────┘     └─────────────┘
                           │
                           ├──▶ Build & Test
                           ├──▶ Docker Build & Push
                           ├──▶ JSDoc Generation
                           └──▶ GitHub Pages Deploy

Workflows Activos

Workflow Trigger Acción
docker-build.yml Push a main/dev Build + Push a Docker Hub
docs-build.yml Push a main JSDoc + Deploy a GitHub Pages

📁 Ver configuración: .github/workflows/


⚖️ Cumplimiento Normativo

MindCare está diseñado para cumplir con las normativas de protección de datos aplicables en España y la Unión Europea.

Normativa Estado Descripción
RGPD ✅ Implementado Consentimiento explícito, derechos ARCO+PO
LOPD-GDD ✅ Implementado Ley Orgánica 3/2018 de protección de datos
Cookies ✅ Implementado Banner de consentimiento informado
WCAG 2.1 🔄 En progreso Accesibilidad web

Medidas Técnicas Implementadas

  • Consentimiento explícito en registro (checkbox obligatorio)
  • Derecho al olvido - Eliminación completa de datos de usuario
  • Portabilidad - Exportación de datos en formato legible
  • Encriptación - Contraseñas con bcrypt, conexiones HTTPS
  • Minimización de datos - Solo se recopilan datos necesarios

📖 Documentación completa: docs/legislacion.md


👥 Equipo de Desarrollo

MindCare ha sido desarrollado por un equipo de estudiantes de DAW2 comprometidos con crear tecnología de impacto social positivo.

Adrián Díaz Angulo
🔧 Backend Lead
API REST · Auth · DevOps
Rocío Luque Montes
🎨 Frontend Lead
UI/UX · React · Accesibilidad
José Antonio Díaz Busati
🗄️ Database Manager
MongoDB · Persistencia

📄 Licencia

Este proyecto está licenciado bajo la MIT License - ver el archivo LICENSE para más detalles.


💙 MindCare

Tecnología al servicio del bienestar emocional

Porque cuidar la mente también es cuidar la vida.


GitHub Stars GitHub Forks

backend/src/app.js

Description:
  • Configura y arranca el servidor Express, define middlewares y rutas.

Source:

Configura y arranca el servidor Express, define middlewares y rutas.

Requires

  • module:http-errors
  • module:express
  • module:path
  • module:cookie-parser
  • module:morgan
  • module:cors
  • module:helmet
  • module:observability.service

backend/src/controllers/auth.controller.js

Description:
  • Gestiona el registro, inicio de sesión y perfil de los usuarios.

Source:

Gestiona el registro, inicio de sesión y perfil de los usuarios.

Requires

  • module:jsonwebtoken
  • module:../models/usuarios_mongoose

backend/src/controllers/contactoEmergencia.controller.js

Description:
  • Gestiona las operaciones CRUD para los contactos de emergencia de los usuarios.

Source:

Gestiona las operaciones CRUD para los contactos de emergencia de los usuarios.

Requires

  • module:../models/contactoEmergencia_mongoose
  • module:../models/usuarios_mongoose
  • module:nodemailer

backend/src/controllers/diario.controller.js

Description:
  • Gestiona las operaciones CRUD para las entradas del diario de los usuarios.

Source:

Gestiona las operaciones CRUD para las entradas del diario de los usuarios.

Requires

  • module:../models/diario_mongoose

backend/src/middleware/authMiddleware.js

backend/src/models/diario_mongoose.js

Description:
  • Define el esquema y los métodos para las entradas del diario.

Source:

Define el esquema y los métodos para las entradas del diario.

Requires

  • module:mongoose
  • module:bcryptjs

backend/src/routes/auth.routes.js

Description:
  • Define los endpoints para el registro, login y perfil de usuario.

Source:

Define los endpoints para el registro, login y perfil de usuario.

Requires

  • module:express
  • module:../controllers/auth.controller
  • module:../middleware/authMiddleware

backend/src/routes/contactoEmergencia.routes.js

Description:
  • Define los endpoints para las operaciones CRUD de los contactos de emergencia.

Source:

Define los endpoints para las operaciones CRUD de los contactos de emergencia.

Requires

  • module:express
  • module:../controllers/contactoEmergencia.controller
  • module:../middleware/authMiddleware

backend/src/routes/diario.routes.js

Description:
  • Define los endpoints para las operaciones CRUD de las entradas del diario.

Source:

Define los endpoints para las operaciones CRUD de las entradas del diario.

Requires

  • module:express
  • module:../controllers/diario.controller
  • module:../middleware/authMiddleware

backend/src/server.js

Description:
  • Conecta a la base de datos MongoDB y levanta el servidor Express.

Source:

Conecta a la base de datos MongoDB y levanta el servidor Express.

Requires

  • module:mongoose
  • module:dotenv
  • module:./app

backend/src/services/observability.service.js

Description:
  • Proporciona funcionalidades de logging, métricas Prometheus y instrumentación MongoDB

Source:

Proporciona funcionalidades de logging, métricas Prometheus y instrumentación MongoDB

Requires

  • module:prom-client
  • module:winston
  • module:winston-daily-rotate-file

frontend/src/App.js

Description:
  • Configura el enrutador, las rutas, los layouts y el sistema de notificaciones.

Source:

Configura el enrutador, las rutas, los layouts y el sistema de notificaciones.

Requires

  • module:react
  • module:react-router-dom
  • module:react-hot-toast
  • module:./styles/App.css
  • module:./components/molecules/Navbar
  • module:./components/layout/MainLayout
  • module:./components/layout/AuthLayout
  • module:./components/organisms/ErrorBoundary
  • module:./pages/Landing
  • module:./pages/Login
  • module:./pages/Register
  • module:./pages/Home
  • module:./pages/Seguimiento
  • module:./pages/Diario
  • module:./store/authStore

frontend/src/components/atoms/Button.jsx

Description:
  • Un componente de botón versátil con diferentes variantes, tamaños y estados.

Source:

Un componente de botón versátil con diferentes variantes, tamaños y estados.

Requires

  • module:react
  • module:prop-types
  • module:../../styles/atoms/Button.css

frontend/src/components/atoms/Card.jsx

Description:
  • Muestra un título y una descripción en un contenedor con estilo de tarjeta.

Source:

Muestra un título y una descripción en un contenedor con estilo de tarjeta.

Requires

  • module:react
  • module:prop-types
  • module:../../styles/atoms/Card.css

frontend/src/components/atoms/Checkbox.jsx

Description:
  • Un componente de checkbox con etiqueta y estado personalizable.

Source:

Un componente de checkbox con etiqueta y estado personalizable.

Requires

  • module:react
  • module:prop-types
  • module:../../styles/atoms/Checkbox.css

frontend/src/components/atoms/CircularProgress.jsx

Description:
  • Muestra un indicador de progreso en forma de círculo con un porcentaje.

Source:

Muestra un indicador de progreso en forma de círculo con un porcentaje.

Requires

  • module:react
  • module:prop-types
  • module:../../styles/atoms/CircularProgress.css

frontend/src/components/atoms/EmergencyButton.jsx

Description:
  • Este componente renderiza un botón de emergencia fijo en la esquina superior derecha de la pantalla.

Source:

Este componente renderiza un botón de emergencia fijo en la esquina superior derecha de la pantalla.

Requires

  • module:React

frontend/src/components/atoms/Heading.jsx

Description:
  • Renderiza un elemento de encabezado (h1, h2, etc.) con estilos consistentes.

Source:

Renderiza un elemento de encabezado (h1, h2, etc.) con estilos consistentes.

Requires

  • module:react
  • module:prop-types
  • module:../../styles/atoms/Heading.css

frontend/src/components/atoms/Input.jsx

Description:
  • Un componente de input versátil con etiqueta, icono, manejo de errores y visibilidad de contraseña.

Source:

Un componente de input versátil con etiqueta, icono, manejo de errores y visibilidad de contraseña.

Requires

  • module:react
  • module:prop-types
  • module:../../styles/atoms/Input.css

frontend/src/components/atoms/Logo.jsx

Description:
  • Muestra el logo de la aplicación y enlaza a la página de inicio.

Source:

Muestra el logo de la aplicación y enlaza a la página de inicio.

Requires

  • module:react
  • module:react-router-dom
  • module:../../styles/atoms/Logo.css

frontend/src/components/atoms/Slider.jsx

Description:
  • Un componente de input de tipo "range" con etiqueta, valor y marcas.

Source:

Un componente de input de tipo "range" con etiqueta, valor y marcas.

Requires

  • module:react
  • module:prop-types
  • module:../../styles/atoms/Slider.css

frontend/src/components/atoms/Text.jsx

Description:
  • Renderiza un elemento de párrafo con diferentes variantes de estilo.

Source:

Renderiza un elemento de párrafo con diferentes variantes de estilo.

Requires

  • module:react
  • module:prop-types
  • module:../../styles/atoms/Text.css

frontend/src/components/atoms/Textarea.jsx

Description:
  • Un componente de textarea con contador de caracteres y manejo de errores.

Source:

Un componente de textarea con contador de caracteres y manejo de errores.

Requires

  • module:react
  • module:prop-types
  • module:../../styles/atoms/Textarea.css

frontend/src/components/layout/AuthLayout.jsx

Description:
  • Proporciona una estructura consistente para las páginas de login y registro.

Source:

Proporciona una estructura consistente para las páginas de login y registro.

Requires

  • module:react
  • module:../atoms/Logo
  • module:../../styles/layout/AuthLayout.css

frontend/src/components/layout/MainLayout.jsx

Description:
  • Proporciona la estructura principal de la página con barra de navegación, contenido principal y pie de página.

Source:

Proporciona la estructura principal de la página con barra de navegación, contenido principal y pie de página.

Requires

  • module:React
  • module:../molecules/Navbar
  • module:../molecules/Footer
  • module:../../styles/Layout.css

frontend/src/components/molecules/ActionCard.jsx

Description:
  • Muestra una tarjeta con título, descripción y un botón que navega a una ruta específica.

Source:

Muestra una tarjeta con título, descripción y un botón que navega a una ruta específica.

Requires

  • module:react
  • module:prop-types
  • module:react-router-dom
  • module:../atoms/Button
  • module:../../styles/molecules/ActionCard.css

frontend/src/components/molecules/ActivitySelector.jsx

Description:
  • Permite a los usuarios añadir actividades de una lista, especificar duración e intensidad, y ver las actividades registradas.

Source:

Permite a los usuarios añadir actividades de una lista, especificar duración e intensidad, y ver las actividades registradas.

Requires

  • module:react
  • module:prop-types
  • module:../atoms/Button
  • module:../../styles/molecules/ActivitySelector.css

frontend/src/components/molecules/AuthButtons.jsx

Description:
  • Muestra los botones de "Registrarse" e "Iniciar sesión".

Source:

Muestra los botones de "Registrarse" e "Iniciar sesión".

Requires

  • module:react
  • module:react-router-dom
  • module:../atoms/Button
  • module:../../styles/molecules/AuthButtons.css

frontend/src/components/molecules/Carousel.jsx

Description:
  • Muestra una colección de tarjetas en un carrusel navegable.

Source:

Muestra una colección de tarjetas en un carrusel navegable.

Requires

  • module:react
  • module:prop-types
  • module:../atoms/Card
  • module:../../styles/molecules/Carousel.css

frontend/src/components/molecules/CognitionSelector.jsx

Description:
  • Permite a los usuarios seleccionar diferentes aspectos cognitivos y asignarles una intensidad.

Source:

Permite a los usuarios seleccionar diferentes aspectos cognitivos y asignarles una intensidad.

Requires

  • module:react
  • module:prop-types
  • module:../atoms/Slider
  • module:../atoms/Checkbox
  • module:../../styles/molecules/CognitionSelector.css

frontend/src/components/molecules/DiaryBanner.jsx

Description:
  • Muestra un banner con un título, descripción y un botón de llamada a la acción.

Source:

Muestra un banner con un título, descripción y un botón de llamada a la acción.

Requires

  • module:react
  • module:prop-types
  • module:react-router-dom
  • module:../atoms/Button
  • module:../../styles/molecules/DiaryBanner.css

frontend/src/components/molecules/DiaryEditor.jsx

Description:
  • Un formulario completo para escribir, guardar y opcionalmente proteger con contraseña las entradas del diario.

Source:

Un formulario completo para escribir, guardar y opcionalmente proteger con contraseña las entradas del diario.

Requires

  • module:react
  • module:prop-types
  • module:../atoms/Input
  • module:../atoms/Textarea
  • module:../atoms/Button
  • module:../../hooks
  • module:../../styles/molecules/DiaryEditor.css

frontend/src/components/molecules/DiaryEntry.jsx

Description:
  • Muestra el contenido de una entrada del diario con opciones para editar, eliminar y compartir.

Source:

Muestra el contenido de una entrada del diario con opciones para editar, eliminar y compartir.

Requires

  • module:react
  • module:prop-types
  • module:../../utils
  • module:../../styles/molecules/DiaryEntry.css

frontend/src/components/molecules/EmotionSelector.jsx

Description:
  • Permite a los usuarios seleccionar emociones y asignarles una intensidad, además de añadir un comentario.

Source:

Permite a los usuarios seleccionar emociones y asignarles una intensidad, además de añadir un comentario.

Requires

  • module:react
  • module:prop-types
  • module:../atoms/Slider
  • module:../atoms/Checkbox
  • module:../../styles/molecules/EmotionSelector.css

frontend/src/components/molecules/EmotionStats.jsx

Description:
  • Muestra las estadísticas de emociones de los últimos 7 días usando gráficos de progreso circular.

Source:

Muestra las estadísticas de emociones de los últimos 7 días usando gráficos de progreso circular.

Requires

  • module:react
  • module:prop-types
  • module:../atoms/CircularProgress
  • module:../../styles/molecules/EmotionStats.css

frontend/src/components/molecules/Footer.jsx

Description:
  • Muestra el pie de página de la aplicación con enlaces de navegación, legales y redes sociales.

Source:

Muestra el pie de página de la aplicación con enlaces de navegación, legales y redes sociales.

Requires

  • module:react
  • module:react-router-dom
  • module:../../styles/molecules/Footer.css

frontend/src/components/molecules/HeroSection.jsx

Description:
  • Muestra un título y una descripción prominentes, típicamente en la parte superior de una página.

Source:

Muestra un título y una descripción prominentes, típicamente en la parte superior de una página.

Requires

  • module:react
  • module:prop-types
  • module:../atoms/Heading
  • module:../atoms/Text
  • module:../../styles/molecules/HeroSection.css

frontend/src/components/molecules/Navbar.jsx

Description:
  • Muestra la barra de navegación principal de la aplicación, con enlaces que cambian según el estado de autenticación del usuario.

Source:

Muestra la barra de navegación principal de la aplicación, con enlaces que cambian según el estado de autenticación del usuario.

Requires

  • module:react
  • module:react-router-dom
  • module:../../store/authStore
  • module:../../styles/molecules/Navbar.css

frontend/src/components/organisms/EmergencyModal.jsx

Description:
  • Este componente muestra un modal con opciones de emergencia, incluyendo información, contactos y llamadas.

Source:

Este componente muestra un modal con opciones de emergencia, incluyendo información, contactos y llamadas.

Requires

  • module:react
  • module:../../service/contactoEmergencia.service

frontend/src/components/organisms/ErrorBoundary.jsx

frontend/src/components/organisms/LandingHero.jsx

Description:
  • Combina la sección Hero con los botones de autenticación para la página principal.

Source:

Combina la sección Hero con los botones de autenticación para la página principal.

Requires

  • module:react
  • module:../molecules/HeroSection
  • module:../molecules/AuthButtons
  • module:../../styles/organisms/LandingHero.css

frontend/src/config/api.js

Description:
  • Centraliza la URL base, los endpoints y una función apiFetch para realizar peticiones al backend.

Source:

Centraliza la URL base, los endpoints y una función apiFetch para realizar peticiones al backend.

frontend/src/config/api.service.js

Description:
  • Crea una instancia de Axios con configuración base e interceptores para el manejo de tokens y errores.

Source:

Crea una instancia de Axios con configuración base e interceptores para el manejo de tokens y errores.

Requires

  • module:axios

frontend/src/hooks/index.js

Description:
  • Exporta todos los hooks personalizados desde un único punto para facilitar las importaciones.

Source:

Exporta todos los hooks personalizados desde un único punto para facilitar las importaciones.

frontend/src/hooks/useToast.js

Description:
  • Proporciona funciones para mostrar fácilmente notificaciones de éxito, error, información y carga.

Source:

Proporciona funciones para mostrar fácilmente notificaciones de éxito, error, información y carga.

Requires

  • module:react-hot-toast

frontend/src/index.js

Description:
  • Renderiza el componente raíz de la aplicación en el DOM.

Source:

Renderiza el componente raíz de la aplicación en el DOM.

Requires

  • module:react
  • module:react-dom/client
  • module:./styles/index.css
  • module:./App
  • module:./reportWebVitals

frontend/src/pages/Articulos.jsx

Description:
  • Muestra una colección de artículos sobre salud mental con opciones de filtrado y búsqueda

Source:

Muestra una colección de artículos sobre salud mental con opciones de filtrado y búsqueda

Requires

  • module:react
  • module:../service/articlesService
  • module:../styles/pages/Articulos.css

frontend/src/pages/Debug.jsx

Description:
  • Esta página permite verificar qué está guardado en localStorage y el estado del store

Source:

Esta página permite verificar qué está guardado en localStorage y el estado del store

frontend/src/pages/Diario.jsx

Description:
  • Permite a los usuarios crear, ver, editar, eliminar y compartir entradas de su diario personal.

Source:

Permite a los usuarios crear, ver, editar, eliminar y compartir entradas de su diario personal.

Requires

  • module:react
  • module:../hooks
  • module:../service/diario.service
  • module:../components/molecules/DiaryEditor
  • module:../components/molecules/DiaryEntry
  • module:../components/atoms/Button
  • module:../components/atoms/Input
  • module:../styles/Diario.css

frontend/src/pages/Home.jsx

Description:
  • Muestra un panel de control personalizado para el usuario con estadísticas, accesos directos y artículos recomendados.

Source:

Muestra un panel de control personalizado para el usuario con estadísticas, accesos directos y artículos recomendados.

Requires

  • module:react
  • module:../store/authStore
  • module:../components/molecules/EmotionStats
  • module:../components/molecules/ActionCard
  • module:../components/molecules/DiaryBanner
  • module:../components/molecules/Carousel
  • module:../styles/Home.css

frontend/src/pages/Landing.jsx

Description:
  • La página principal que ven los usuarios no autenticados.

Source:

La página principal que ven los usuarios no autenticados.

Requires

  • module:react
  • module:../components/organisms/LandingHero
  • module:../styles/pages/Landing.css

frontend/src/pages/Login.js

Description:
  • Formulario para que los usuarios existentes inicien sesión en la aplicación.

Source:

Formulario para que los usuarios existentes inicien sesión en la aplicación.

Requires

  • module:react
  • module:react-router-dom
  • module:../store/authStore
  • module:../config/api
  • module:../styles/Auth-forms.css

frontend/src/pages/Register.js

Description:
  • Formulario para que nuevos usuarios creen una cuenta.

Source:

Formulario para que nuevos usuarios creen una cuenta.

Requires

  • module:react
  • module:react-router-dom
  • module:../store/authStore
  • module:../config/api
  • module:../styles/Auth-forms.css

frontend/src/pages/Seguimiento.jsx

Description:
  • Un formulario de varios pasos para que los usuarios registren su estado de ánimo, sueño, actividad y otros datos diarios.

Source:

Un formulario de varios pasos para que los usuarios registren su estado de ánimo, sueño, actividad y otros datos diarios.

Requires

  • module:react
  • module:react-router-dom
  • module:../store/authStore
  • module:../config/api
  • module:../components/molecules/EmotionSelector
  • module:../components/molecules/ActivitySelector
  • module:../components/molecules/CognitionSelector
  • module:../components/atoms/Slider
  • module:../components/atoms/Checkbox
  • module:../components/atoms/Button
  • module:../styles/Seguimiento.css

frontend/src/reportWebVitals.js

Description:
  • Mide las métricas de rendimiento de la aplicación y las envía a una función de callback.

Source:

Mide las métricas de rendimiento de la aplicación y las envía a una función de callback.

frontend/src/service/articlesService.js

Description:
  • Proporciona métodos para obtener artículos de fuentes médicas reales usando PubMed API

Source:

Proporciona métodos para obtener artículos de fuentes médicas reales usando PubMed API

frontend/src/service/contactoEmergencia.service.js

frontend/src/service/diario.service.js

Description:
  • Proporciona métodos para interactuar con la API del diario (crear, leer, actualizar, eliminar entradas).

Source:

Proporciona métodos para interactuar con la API del diario (crear, leer, actualizar, eliminar entradas).

Requires

  • module:../config/api.service

frontend/src/service/medicalAPIs.js

Description:
  • Integra con NewsAPI y otras fuentes para obtener artículos médicos reales

Source:

Integra con NewsAPI y otras fuentes para obtener artículos médicos reales

frontend/src/setupTests.js

Description:
  • Importa jest-dom para añadir matchers personalizados de Jest para el DOM.

Source:

Importa jest-dom para añadir matchers personalizados de Jest para el DOM.

Requires

  • module:@testing-library/jest-dom

frontend/src/store/authStore.js

Description:
  • Gestiona el estado de autenticación del usuario (usuario, token) y lo persiste en el almacenamiento local.

Source:

Gestiona el estado de autenticación del usuario (usuario, token) y lo persiste en el almacenamiento local.

Requires

  • module:zustand
  • module:zustand/middleware

frontend/src/utils/formatters.js

Description:
  • Contiene funciones para formatear fechas en diferentes formatos.

Source:

Contiene funciones para formatear fechas en diferentes formatos.

frontend/src/utils/index.js

Description:
  • Exporta todas las funciones de utilidad desde un único punto para facilitar las importaciones.

Source:

Exporta todas las funciones de utilidad desde un único punto para facilitar las importaciones.