app.py

import os
from dotenv import find_dotenv, load_dotenv
import streamlit as st
from typing import Generator
from groq import Groq

# Cargar variables de entorno
_ = load_dotenv(find_dotenv())

# Configurar la página de Streamlit
st.set_page_config(page_icon="📃", layout="wide", page_title="Groq & LLaMA3.1 Chat Bot...")

# Menú superior con fondo transparente
st.markdown(
    """
    <style>
        .menu-container {
            padding: 20px;
            background-color: transparent;  /* Fondo transparente */
            border-bottom: 1px solid #e1e1e1;
        }
        .menu-title {
            font-size: 24px;
            font-weight: bold;
            margin-bottom: 10px;
        }
        .menu-description {
            line-height: 1.5;
        }
        .menu-description a {
            color: #1f77b4;
            text-decoration: none;
        }
        .menu-description a:hover {
            text-decoration: underline;
        }
    </style>
    <div class="menu-container">
        <p class="menu-title">Bot con I.A. para crear EL TITULO de productos.</p>
        <p class="menu-description">
            Este titulo va en titulo  del producto (En la parte de arriba).<br><br>
            Si desea usar otro BOT de I.A. escoja:<br>
            <a href='https://magnetimpact-mc-bot.hf.space'>Marketing de Contenidos |</a>
            <a href='https://magnetimpact-tit-bot.hf.space'> Creacion de TITULOS |</a>
            <a href='https://magnetimpact-dp-bot.hf.space'> Descripcion de Productos |</a>
            <a href='https://magnetimpact-cp-bot.hf.space'> Caracteristicas de Productos |</a>
            <a href='https://wa.me/51927929109'> Desarrollado por MAGNET IMPACT - Agencia de Marketing Digital</a>
        </p>
    </div>
    """,
    unsafe_allow_html=True
)

# Inicializar cliente Groq
client = Groq(
    api_key=os.environ['GROQ_API_KEY'],
)

# Inicializar historial de chat y modelo seleccionado
if "messages" not in st.session_state:
    st.session_state.messages = []

if "selected_model" not in st.session_state:
    st.session_state.selected_model = "mixtral-8x7b-32768"

# Detalles del modelo
models = {
    "mixtral-8x7b-32768": {
        "name": "Mixtral-8x7b-Instruct-v0.1",
        "tokens": 32768,
        "developer": "Mistral",
    },
}

# Configurar el modelo y tokens
model_option = "mixtral-8x7b-32768"
max_tokens_range = models[model_option]["tokens"]

# No mostrar la selección del modelo ni la barra de tokens
st.session_state.max_tokens = max_tokens_range

# Detectar cambio de modelo y limpiar historial de chat si el modelo ha cambiado
if st.session_state.selected_model != model_option:
    st.session_state.messages = []
    st.session_state.selected_model = model_option

# Añadir un botón para "Limpiar Chat"
if st.button("Limpiar Chat"):
    st.session_state.messages = []

# Cargar la imagen del avatar del asistente
assistant_avatar = "botm.png"

# Mostrar mensajes de chat del historial en la aplicación
for message in st.session_state.messages:
    avatar = assistant_avatar if message["role"] == "assistant" else "🧑‍💻"
    with st.chat_message(message["role"], avatar=avatar):
        st.markdown(message["content"])

def generate_chat_responses(chat_completion) -> Generator[str, None, None]:
    """Generar contenido de respuesta del chat a partir de la respuesta de la API de Groq."""
    for chunk in chat_completion:
        if chunk.choices[0].delta.content:
            yield chunk.choices[0].delta.content

# Instrucción privada que se aplicará a cada mensaje
private_instruction = (
    "# Actúa como generador de títulos SEO para productos en sitios web de comercio electrónico y crea un título conciso que utilice guiones (-) como separadores, no utilice comas (,) ni dos puntos (:) y tenga menos de 300 caracteres como se muestra en este ejemplo: [Nombre del resumen del producto] - [CARACTERÍSTICA 1] - [CARACTERÍSTICA 2]. A partir de la siguiente información, cree un título para un producto respondiendo siempre en ESPAÑOL y utilizando siempre MAYÚSCULAS. No incluyas en el título el precio, las garantías, los signos de exclamación ni las ventajas. No des explicaciones, sólo da el título con todas las características posibles: [AQUÍ EL USUARIO COLOCARÁ LA INFORMACIÓN DEL PRODUCTO]. #Contesta siempre en ESPAÑOL."
)

# Manejar la entrada del chat del usuario
if prompt := st.chat_input("Escribe tu mensaje aquí..."):
    st.session_state.messages.append({"role": "user", "content": prompt})

    with st.chat_message("user", avatar="🧑‍💻"):  
        st.markdown(prompt)

    # Preparar los mensajes para la API, incluyendo la instrucción privada
    messages_for_api = [
        {"role": "system", "content": private_instruction},
    ] + [
        {"role": m["role"], "content": m["content"]}
        for m in st.session_state.messages
    ]

    # Obtener respuesta de la API de Groq
    try:
        chat_completion = client.chat.completions.create(
            model=model_option,
            messages=messages_for_api,
            max_tokens=max_tokens_range,
            stream=True,
        )

        # Usar la función generadora con st.write_stream
        with st.chat_message("assistant", avatar=assistant_avatar):
            chat_responses_generator = generate_chat_responses(chat_completion)
            full_response = st.write_stream(chat_responses_generator)

        # Añadir la respuesta completa al historial de mensajes
        if isinstance(full_response, str):
            st.session_state.messages.append(
                {"role": "assistant", "content": full_response}
            )
        else:
            combined_response = "\n".join(str(item) for item in full_response)
            st.session_state.messages.append(
                {"role": "assistant", "content": combined_response}
            )

    except Exception as e:
        st.error(e, icon="❌")