Update modules/discourse/discourse_interface.py

modules/discourse/discourse_interface.py

@@ -5,6 +5,8 @@ import pandas as pd
 import matplotlib.pyplot as plt
 import plotly.graph_objects as go
 import logging
+import io  # <-- Añade esta importación
+
 from ..utils.widget_utils import generate_unique_key
 from .discourse_process import perform_discourse_analysis
 from ..database.chat_mongo_db import store_chat_history
@@ -133,186 +135,146 @@ def display_discourse_interface(lang_code, nlp_models, discourse_t):
 def display_discourse_results(result, lang_code, discourse_t):
     """
     Muestra los resultados del análisis del discurso
+    Versión actualizada con:
+    - Un solo expander para interpretación
+    - Botón de descarga combinado
+    - Sin mensaje de "próxima actualización"
+    - Estilo consistente con semantic_interface
     """
     if not result.get('success'):
         st.warning(discourse_t.get('no_results', 'No hay resultados disponibles'))
         return
 
-    # Estilo CSS
+    # Estilo CSS unificado
     st.markdown("""
-        <style>
-        .concepts-container {
-            display: flex;
-            flex-wrap: nowrap;
-            gap: 8px;
-            padding: 12px;
-            background-color: #f8f9fa;
-            border-radius: 8px;
-            overflow-x: auto;
-            margin-bottom: 15px;
-            white-space: nowrap;
-        }
-        .concept-item {
-            background-color: white;
-            border-radius: 4px;
-            padding: 6px 10px;
-            display: inline-flex;
-            align-items: center;
-            gap: 4px;
-            box-shadow: 0 1px 2px rgba(0,0,0,0.1);
-            flex-shrink: 0;
-        }
-        .concept-name {
-            font-weight: 500;
-            color: #1f2937;
-            font-size: 0.85em;
-        }
-        .concept-freq {
-            color: #6b7280;
-            font-size: 0.75em;
-        }
-        .graph-container {
-            background-color: white;
-            padding: 15px;
-            border-radius: 8px;
-            box-shadow: 0 2px 4px rgba(0,0,0,0.1);
-            margin-top: 10px;
-        }
-        </style>
+    <style>
+    .concept-table {
+        display: flex;
+        flex-wrap: wrap;
+        gap: 10px;
+        margin-bottom: 20px;
+    }
+    .concept-item {
+        background-color: #f0f2f6;
+        border-radius: 5px;
+        padding: 8px 12px;
+        display: flex;
+        align-items: center;
+        gap: 8px;
+    }
+    .concept-name {
+        font-weight: bold;
+    }
+    .concept-freq {
+        color: #666;
+        font-size: 0.9em;
+    }
+    .download-btn-container {
+        display: flex;
+        justify-content: center;
+        margin-top: 15px;
+    }
+    </style>
     """, unsafe_allow_html=True)
 
+    # Mostrar conceptos clave para ambos documentos
     col1, col2 = st.columns(2)
-
+    
     # Documento 1
     with col1:
-        st.subheader(discourse_t.get('doc1_title', 'Documento 1'))
-        st.markdown(discourse_t.get('key_concepts', 'Conceptos Clave'))
+        st.subheader(discourse_t.get('compare_doc1_title', 'Documento 1'))
         if 'key_concepts1' in result:
-            concepts_html = f"""
-                <div class="concepts-container">
-                    {''.join([
-                        f'<div class="concept-item"><span class="concept-name">{concept}</span>'
-                        f'<span class="concept-freq">({freq:.2f})</span></div>'
-                        for concept, freq in result['key_concepts1']
-                    ])}
-                </div>
-            """
-            st.markdown(concepts_html, unsafe_allow_html=True)
-
-            # Verificar el tipo de graph1 de manera más robusta
-            if 'graph1' in result:
-                st.markdown('<div class="graph-container">', unsafe_allow_html=True)
-                
-                # Más información para depuración
-                graph_type = type(result['graph1']).__name__
-                graph_size = len(result['graph1']) if isinstance(result['graph1'], bytes) else "N/A"
-                logger.info(f"Tipo de graph1: {graph_type}, Tamaño: {graph_size}")
-                
-                if isinstance(result['graph1'], bytes) and len(result['graph1']) > 0:
-                    # Es bytes válidos
-                    st.image(result['graph1'])
-                elif isinstance(result['graph1'], plt.Figure):
-                    # Es una figura de matplotlib
-                    st.pyplot(result['graph1'])
-                elif result['graph1'] is None:
-                    # Es None
-                    st.warning("Gráfico no disponible")
-                else:
-                    # Otro tipo o bytes vacíos
-                    st.warning(f"Formato de gráfico no reconocido: {graph_type}")
-                
-                # Botones y controles
-                button_col1, spacer_col1 = st.columns([1,4])
-                with button_col1:
-                    if 'graph1_bytes' in result:
-                        st.download_button(
-                            label="📥 " + discourse_t.get('download_graph', "Download"),
-                            data=result['graph1_bytes'],
-                            file_name="discourse_graph1.png",
-                            mime="image/png",
-                            use_container_width=True
-                        )
-
-                # Interpretación como texto normal sin expander
-                st.markdown("**📊 Interpretación del grafo:**")
-                st.markdown("""
-                    - 🔀 Las flechas indican la dirección de la relación entre conceptos
-                    - 🎨 Los colores más intensos indican conceptos más centrales en el texto
-                    - ⭕ El tamaño de los nodos representa la frecuencia del concepto
-                    - ↔️ El grosor de las líneas indica la fuerza de la conexión
-                """)
-                
-                st.markdown('</div>', unsafe_allow_html=True)
-            else:
-                st.warning(discourse_t.get('graph_not_available', 'Gráfico no disponible'))
-        else:
-            st.warning(discourse_t.get('concepts_not_available', 'Conceptos no disponibles'))
+            df1 = pd.DataFrame(
+                result['key_concepts1'],
+                columns=[discourse_t.get('concept', 'Concepto'), discourse_t.get('frequency', 'Frecuencia')]
+            )
+            st.write(
+                '<div class="concept-table">' + 
+                ''.join([
+                    f'<div class="concept-item"><span class="concept-name">{concept}</span>'
+                    f'<span class="concept-freq">({freq:.2f})</span></div>'
+                    for concept, freq in df1.values
+                ]) + "</div>",
+                unsafe_allow_html=True
+            )
+            
+            if 'graph1' in result and result['graph1']:
+                st.image(result['graph1'], use_container_width=True)
 
     # Documento 2
     with col2:
-        st.subheader(discourse_t.get('doc2_title', 'Documento 2'))
-        st.markdown(discourse_t.get('key_concepts', 'Conceptos Clave'))
+        st.subheader(discourse_t.get('compare_doc2_title', 'Documento 2'))
         if 'key_concepts2' in result:
-            concepts_html = f"""
-                <div class="concepts-container">
-                    {''.join([
-                        f'<div class="concept-item"><span class="concept-name">{concept}</span>'
-                        f'<span class="concept-freq">({freq:.2f})</span></div>'
-                        for concept, freq in result['key_concepts2']
-                    ])}
-                </div>
-            """
-            st.markdown(concepts_html, unsafe_allow_html=True)
-
-            # Verificar el tipo de graph1 de manera más robusta
-            if 'graph1' in result:
-                st.markdown('<div class="graph-container">', unsafe_allow_html=True)
-                
-                # Más información para depuración
-                graph_type = type(result['graph2']).__name__
-                graph_size = len(result['graph2']) if isinstance(result['graph2'], bytes) else "N/A"
-                logger.info(f"Tipo de graph2: {graph_type}, Tamaño: {graph_size}")
-                
-                if isinstance(result['graph2'], bytes) and len(result['graph2']) > 0:
-                    # Es bytes válidos
-                    st.image(result['graph2'])
-                elif isinstance(result['graph2'], plt.Figure):
-                    # Es una figura de matplotlib
-                    st.pyplot(result['graph2'])
-                elif result['graph2'] is None:
-                    # Es None
-                    st.warning("Gráfico no disponible")
-                else:
-                    # Otro tipo o bytes vacíos
-                    st.warning(f"Formato de gráfico no reconocido: {graph_type}")
-                
-                # Botones y controles
-                button_col2, spacer_col2 = st.columns([1,4])
-                with button_col2:
-                    if 'graph2_bytes' in result:
-                        st.download_button(
-                            label="📥 " + discourse_t.get('download_graph', "Download"),
-                            data=result['graph2_bytes'],
-                            file_name="discourse_graph2.png",
-                            mime="image/png",
-                            use_container_width=True
-                        )
+            df2 = pd.DataFrame(
+                result['key_concepts2'],
+                columns=[discourse_t.get('concept', 'Concepto'), discourse_t.get('frequency', 'Frecuencia')]
+            )
+            st.write(
+                '<div class="concept-table">' + 
+                ''.join([
+                    f'<div class="concept-item"><span class="concept-name">{concept}</span>'
+                    f'<span class="concept-freq">({freq:.2f})</span></div>'
+                    for concept, freq in df2.values
+                ]) + "</div>",
+                unsafe_allow_html=True
+            )
+            
+            if 'graph2' in result and result['graph2']:
+                st.image(result['graph2'], use_container_width=True)
 
-                # Interpretación como texto normal sin expander
-                st.markdown("**📊 Interpretación del grafo:**")
-                st.markdown("""
-                    - 🔀 Las flechas indican la dirección de la relación entre conceptos
-                    - 🎨 Los colores más intensos indican conceptos más centrales en el texto
-                    - ⭕ El tamaño de los nodos representa la frecuencia del concepto
-                    - ↔️ El grosor de las líneas indica la fuerza de la conexión
-                """)
-                
-                st.markdown('</div>', unsafe_allow_html=True)
-            else:
-                st.warning(discourse_t.get('graph_not_available', 'Gráfico no disponible'))
-        else:
-            st.warning(discourse_t.get('concepts_not_available', 'Conceptos no disponibles'))
+    # Sección unificada de interpretación (como semantic_interface)
+    st.markdown("""
+    <style>
+    div[data-testid="stExpander"] div[role="button"] p {
+        text-align: center;
+        font-weight: bold;
+    }
+    </style>
+    """, unsafe_allow_html=True)
+    
+    with st.expander("📊 " + discourse_t.get('semantic_graph_interpretation', "Interpretación de los gráficos")):
+        st.markdown(f"""
+        - 🔀 {discourse_t.get('compare_arrow_meaning', 'Las flechas indican la dirección de la relación entre conceptos')}
+        - 🎨 {discourse_t.get('compare_color_meaning', 'Los colores más intensos indican conceptos más centrales en el texto')}
+        - ⭕ {discourse_t.get('compare_size_meaning', 'El tamaño de los nodos representa la frecuencia del concepto')}
+        - ↔️ {discourse_t.get('compare_thickness_meaning', 'El grosor de las líneas indica la fuerza de la conexión')}
+        """)
 
-    # Nota informativa sobre la comparación
-    st.info(discourse_t.get('comparison_note', 
-        'La funcionalidad de comparación detallada estará disponible en una próxima actualización.'))
+    # Botón de descarga combinado (para ambas imágenes)
+    if 'graph1' in result and 'graph2' in result and result['graph1'] and result['graph2']:
+        # Crear figura combinada
+        fig, (ax1, ax2) = plt.subplots(1, 2, figsize=(24, 10))
+        
+        # Mostrar primer gráfico
+        if isinstance(result['graph1'], bytes):
+            img1 = plt.imread(io.BytesIO(result['graph1']))
+            ax1.imshow(img1)
+        ax1.axis('off')
+        ax1.set_title(discourse_t.get('compare_doc1_title', 'Documento 1'))
+        
+        # Mostrar segundo gráfico
+        if isinstance(result['graph2'], bytes):
+            img2 = plt.imread(io.BytesIO(result['graph2']))
+            ax2.imshow(img2)
+        ax2.axis('off')
+        ax2.set_title(discourse_t.get('compare_doc2_title', 'Documento 2'))
+        
+        plt.tight_layout()
+        
+        # Convertir a bytes
+        buf = io.BytesIO()
+        plt.savefig(buf, format='png', dpi=150, bbox_inches='tight')
+        buf.seek(0)
+        
+        # Botón de descarga
+        st.markdown('<div class="download-btn-container">', unsafe_allow_html=True)
+        st.download_button(
+            label="📥 " + discourse_t.get('download_both_graphs', "Descargar ambos gráficos"),
+            data=buf,
+            file_name="comparison_graphs.png",
+            mime="image/png",
+            use_container_width=True
+        )
+        st.markdown('</div>', unsafe_allow_html=True)
+        
+        plt.close()