Update app.py

app.py

@@ -1,40 +1,117 @@
 import gradio as gr
-
-# Usamos el cliente de Hugging Face para conectar un modelo libre e ilimitado
-# En este caso, usamos un modelo potente y rápido llamado 'Meta-Llama-3-8B-Instruct'
-import os
 from huggingface_hub import InferenceClient
 
-client = InferenceClient("meta-llama/Meta-Llama-3-8B-Instruct")
+# Diccionario de modelos disponibles (Todos libres y rápidos en la nube)
+MODELOS = {
+    "Qwen 2.5 (Recomendado - Excelente en Español)": "Qwen/Qwen2.5-7B-Instruct",
+    "Llama 3.1 (Meta - Respuestas Creativas)": "meta-llama/Meta-Llama-3.1-8B-Instruct",
+    "Mistral Nemo (Rápido y Preciso)": "mistralai/Mistral-Nemo-Instruct-2407"
+}
 
-def responder(message, history):
-    # Formateamos el historial para que la IA entienda el contexto
-    messages = []
-    for user_msg, ai_msg in history:
-        messages.append({"role": "user", "content": user_msg})
-        messages.append({"role": "assistant", "content": ai_msg})
+def responder_ia(mensaje, historial, modelo_seleccionado, rol_sistema, creatividad, max_tokens):
+    # Conseguimos el ID del modelo que el usuario elija en el menú
+    model_id = MODELOS[modelo_seleccionado]
+    client = InferenceClient(model_id)
+    
+    # 1. Configuramos la personalidad (System Prompt)
+    messages = [{"role": "system", "content": rol_sistema}]
     
-    messages.append({"role": "user", "content": message})
+    # 2. Reconstruimos el historial de chat para la IA
+    for usuario, asistente in historial:
+        if usuario: messages.append({"role": "user", "content": usuario})
+        if asistente: messages.append({"role": "assistant", "content": asistente})
     
-    # Llamamos a la IA
-    response = ""
-    for message in client.chat_completion(
-        messages,
-        max_tokens=512,
-        stream=True,
-    ):
-        token = message.choices[0].delta.content
-        if token:
-            response += token
-            yield response
+    # 3. Añadimos el mensaje actual
+    messages.append({"role": "user", "content": mensaje})
+    
+    respuesta = ""
+    try:
+        for token in client.chat_completion(
+            messages,
+            max_tokens=max_tokens,
+            temperature=creatividad,
+            stream=True
+        ):
+            texto = token.choices[0].delta.content
+            if texto:
+                respuesta += texto
+                yield respuesta
+    except Exception as e:
+        yield f"⚠️ Error en los servidores de Hugging Face: {str(e)}\nIntenta seleccionando otro modelo en el panel izquierdo."
+
+# --- DISEÑO DE LA INTERFAZ ESTILO PRO ---
+with gr.Blocks(theme=gr.themes.Soft(primary_hue="blue", secondary_hue="slate")) as demo:
+    
+    gr.Markdown("# 🤖 Centro de Inteligencia Artificial Avanzado")
+    gr.Markdown("Modifica la personalidad, cambia el motor de la IA y consulta guías integradas directamente desde la nube.")
+    
+    with gr.Row():
+        # COLUMNA IZQUIERDA: Ajustes, Controles e Información Integrada
+        with gr.Column(scale=1):
+            gr.Markdown("### ⚙️ Panel de Control")
+            
+            # Selector de Modelos de IA
+            selector_modelo = gr.Dropdown(
+                choices=list(MODELOS.keys()), 
+                value="Qwen 2.5 (Recomendado - Excelente en Español)", 
+                label="Seleccionar Motor de IA"
+            )
+            
+            # Caja para cambiar cómo se comporta el bot
+            prompt_sistema = gr.Textbox(
+                value="Eres un asistente de IA ultra-inteligente, preciso, amigable y respondes siempre en español.",
+                label="Personalidad / Rol del Sistema",
+                lines=3
+            )
+            
+            # Menú oculto desplegable para ajustes técnicos
+            with gr.Accordion("Ajustes Técnicos Avanzados", open=False):
+                slider_temp = gr.Slider(minimum=0.1, maximum=1.5, value=0.7, step=0.1, label="Creatividad (Temperatura)")
+                slider_tokens = gr.Slider(minimum=128, maximum=2048, value=1024, step=128, label="Longitud Máxima de Respuesta")
+            
+            gr.Markdown("---")
+            gr.Markdown("### 📘 Recursos e Información")
+            
+            # BOTÓN 1: Abre un panel informativo sobre cómo usar el chat
+            btn_info = gr.Button("ℹ️ ¿Cómo funciona este Chat?")
+            with gr.Accordion("Guía de Operación", open=False) as panel_guia:
+                gr.Markdown("""
+                **¿Cómo usar las funciones avanzadas?**
+                * **Cambio de Motor:** Si notas que un modelo está lento, cámbialo en el menú desplegable en tiempo real.
+                * **Modificar Personalidad:** Puedes borrar el texto y escribir algo como: *'Actúa como un profesor experto en programación'* y el chat cambiará su comportamiento por completo.
+                * **Creatividad:** Valores bajos (0.2) dan respuestas exactas. Valores altos (1.2) son para respuestas muy creativas.
+                """)
+            
+            # BOTÓN 2: Abre información sobre la infraestructura en la nube
+            btn_creditos = gr.Button("🚀 Estado del Servidor e Infraestructura")
+            with gr.Accordion("Detalles del Servidor", open=False) as panel_servidor:
+                gr.Markdown("""
+                * **Servidor Host:** Hugging Face Spaces (CPU Basic Free).
+                * **Límite de mensajes:** 100% Ilimitado y Libre.
+                * **Framework:** Gradio Blocks en Python 3.10.
+                * **Seguridad:** Conexión encriptada SSL sin almacenamiento de datos privados.
+                """)
+                
+            # BOTONES/ENLACES WEB EXTERNOS (HTML NATIVO)
+            gr.HTML("""
+            <div style="margin-top: 15px; text-align: center;">
+                <a href="https://huggingface.co/models" target="_blank" style="text-decoration:none; color:#3b82f6; font-weight:bold; font-size:14px; margin-right:15px;">🌐 Ver Más Modelos</a>
+                <a href="https://gradio.app" target="_blank" style="text-decoration:none; color:#10b981; font-weight:bold; font-size:14px;">🛠️ Documentación</a>
+            </div>
+            """)
+
+        # COLUMNA DERECHA: La Ventana del Chat Principal
+        with gr.Column(scale=2):
+            chat_interface = gr.ChatInterface(
+                fn=responder_ia,
+                additional_inputs=[selector_modelo, prompt_sistema, slider_temp, slider_tokens],
+                textbox=gr.Textbox(placeholder="Escribe tu mensaje o pregunta aquí...", container=False, scale=7),
+                type="messages"
+            )
 
-# Creamos la interfaz de chat ilimitada
-demo = gr.ChatInterface(
-    fn=responder,
-    title="🚀 Mi Chat de IA Ilimitado",
-    description="Este chat corre en un servidor gratuito de Hugging Face y no tiene límites de uso.",
-    textbox=gr.Textbox(placeholder="Escribe lo que quieras...")
-)
+    # Lógica interactiva: Cuando haces clic en los botones de información, despliegan/abren sus respectivos paneles
+    btn_info.click(fn=lambda: gr.update(open=True), outputs=panel_guia)
+    btn_creditos.click(fn=lambda: gr.update(open=True), outputs=panel_servidor)
 
 if __name__ == "__main__":
     demo.queue().launch()