Update modules/studentact/current_situation_interface.py

modules/studentact/current_situation_interface.py

@@ -100,32 +100,124 @@ def display_current_situation_interface(lang_code, nlp_models, t):
                     logger.error(f"Error en interfaz: {str(e)}")
                     st.error("Error general en la interfaz")
 
+################################################################
 def display_current_situation_visual(doc, metrics):
-    """Visualización de resultados"""
+    """Visualización mejorada de resultados con interpretaciones"""
     try:
         with st.container():
-            st.subheader("Riqueza de Vocabulario")
-            vocabulary_graph = create_vocabulary_network(doc)
-            if vocabulary_graph:
-                st.pyplot(vocabulary_graph)
-                plt.close(vocabulary_graph)
-            
-            st.subheader("Estructura de Oraciones") 
-            syntax_graph = create_syntax_complexity_graph(doc)
-            if syntax_graph:
-                st.pyplot(syntax_graph)
-                plt.close(syntax_graph)
-            
-            st.subheader("Cohesión del Texto")
-            cohesion_map = create_cohesion_heatmap(doc)
-            if cohesion_map:
-                st.pyplot(cohesion_map)
-                plt.close(cohesion_map)
+            # Estilos CSS mejorados para los contenedores
+            st.markdown("""
+                <style>
+                .graph-container {
+                    background-color: white;
+                    border-radius: 10px;
+                    padding: 20px;
+                    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
+                    margin: 15px 0;
+                }
+                .interpretation-box {
+                    background-color: #f8f9fa;
+                    border-left: 4px solid #0d6efd;
+                    padding: 15px;
+                    margin: 10px 0;
+                }
+                .metric-indicator {
+                    font-size: 1.2em;
+                    font-weight: 500;
+                    color: #1f2937;
+                }
+                </style>
+            """, unsafe_allow_html=True)
+
+            # 1. Riqueza de Vocabulario
+            with st.expander("📚 Riqueza de Vocabulario", expanded=True):
+                st.markdown('<div class="graph-container">', unsafe_allow_html=True)
+                vocabulary_graph = create_vocabulary_network(doc)
+                if vocabulary_graph:
+                    # Mostrar gráfico
+                    st.pyplot(vocabulary_graph)
+                    plt.close(vocabulary_graph)
+                    
+                    # Interpretación
+                    st.markdown('<div class="interpretation-box">', unsafe_allow_html=True)
+                    st.markdown("**¿Qué significa este gráfico?**")
+                    st.markdown("""
+                        - 🔵 Los nodos azules representan palabras clave en tu texto
+                        - 📏 El tamaño de cada nodo indica su frecuencia de uso
+                        - 🔗 Las líneas conectan palabras que aparecen juntas frecuentemente
+                        - 🎨 Los colores más intensos indican palabras más centrales
+                    """)
+                    st.markdown("</div>", unsafe_allow_html=True)
+                st.markdown("</div>", unsafe_allow_html=True)
+
+            # 2. Estructura de Oraciones
+            with st.expander("🏗️ Complejidad Estructural", expanded=True):
+                st.markdown('<div class="graph-container">', unsafe_allow_html=True)
+                syntax_graph = create_syntax_complexity_graph(doc)
+                if syntax_graph:
+                    st.pyplot(syntax_graph)
+                    plt.close(syntax_graph)
+                    
+                    st.markdown('<div class="interpretation-box">', unsafe_allow_html=True)
+                    st.markdown("**Análisis de la estructura:**")
+                    st.markdown("""
+                        - 📊 Las barras muestran la complejidad de cada oración
+                        - 📈 Mayor altura indica estructuras más elaboradas
+                        - 🎯 La línea punteada indica el nivel óptimo de complejidad
+                        - 🔄 Variación en las alturas sugiere dinamismo en la escritura
+                    """)
+                    st.markdown("</div>", unsafe_allow_html=True)
+                st.markdown("</div>", unsafe_allow_html=True)
+
+            # 3. Cohesión Textual
+            with st.expander("🔄 Cohesión del Texto", expanded=True):
+                st.markdown('<div class="graph-container">', unsafe_allow_html=True)
+                cohesion_map = create_cohesion_heatmap(doc)
+                if cohesion_map:
+                    st.pyplot(cohesion_map)
+                    plt.close(cohesion_map)
+                    
+                    st.markdown('<div class="interpretation-box">', unsafe_allow_html=True)
+                    st.markdown("**¿Cómo leer el mapa de calor?**")
+                    st.markdown("""
+                        - 🌈 Colores más intensos indican mayor conexión entre oraciones
+                        - 📝 La diagonal muestra la coherencia interna de cada oración
+                        - 🔗 Las zonas claras sugieren oportunidades de mejorar conexiones
+                        - 🎯 Un buen texto muestra patrones de color consistentes
+                    """)
+                    st.markdown("</div>", unsafe_allow_html=True)
+                st.markdown("</div>", unsafe_allow_html=True)
+
+            # 4. Métricas Generales
+            with st.expander("📊 Resumen de Métricas", expanded=True):
+                col1, col2, col3 = st.columns(3)
                 
+                with col1:
+                    st.metric(
+                        "Diversidad Léxica",
+                        f"{metrics['vocabulary_richness']:.2f}/1.0",
+                        help="Mide la variedad de palabras diferentes utilizadas"
+                    )
+                
+                with col2:
+                    st.metric(
+                        "Complejidad Estructural",
+                        f"{metrics['structural_complexity']:.2f}/1.0",
+                        help="Indica qué tan elaboradas son las estructuras de las oraciones"
+                    )
+                
+                with col3:
+                    st.metric(
+                        "Cohesión Textual",
+                        f"{metrics['cohesion_score']:.2f}/1.0",
+                        help="Evalúa qué tan bien conectadas están las ideas entre sí"
+                    )
+
     except Exception as e:
-        logger.error(f"Error mostrando visualizaciones: {str(e)}")
-        st.error("Error al generar visualizaciones")
+        logger.error(f"Error en visualización: {str(e)}")
+        st.error("Error al generar las visualizaciones")
 
+################################################################
 def show_recommendations(feedback, t):
     """
     Muestra las recomendaciones y ejercicios personalizados para el estudiante,