# ui.py

import gradio as gr
from config import SIMILARITY_THRESHOLD_DEFAULT, SYSTEM_PROMPT, MAX_LENGTH_DEFAULT
import os

# Define the theme (you can keep your custom theme)
def get_theme():
    theme = gr.themes.Default(
        primary_hue="indigo",
        # ... (rest of your theme configuration)
    )
    return theme

# Load images and descriptions
def load_images():
    image_carousel_data = {
        "NASA": [
            {"image": "images/rld1.png", "description": "NASA"},
            {"image": "images/rld2.png", "description": "NASA"},
        ],
        # Add more categories and images as needed
    }
    return image_carousel_data

# Build the interface
def build_interface(process_input, send_preset_question, update_image):
    theme = get_theme()
    image_carousel_data = load_images()

    with gr.Blocks(theme='upsatwal/mlsc_tiet') as demo:
        with gr.Row():
            with gr.Column(scale=0.8):
                # Add the video
                video = gr.Video(value="video.mp4", label="Video de Introducción")

                # Image Galleries
                gr.Markdown("### Carruseles de Imágenes")
                for category, images_list in image_carousel_data.items():
                    gr.Markdown(f"#### {category}")
                    # Use gr.Gallery instead of gr.Carousel
                    gallery_items = []
                    for item in images_list:
                        gallery_items.append((item["image"], item["description"]))
                    gr.Gallery(
                        value=gallery_items,
                        label=category,
                        show_label=False,
                        elem_id=None
                    )

                # Download button
                download_button = gr.File(label="Descargar Informe", value="Reporte.pdf")

                # Chatbot
                with gr.Row():
                    with gr.Column(scale=1):
                        chatbot_output = gr.Chatbot(label="ChatBot", elem_id="chatbot_output")
                        chatbot_input = gr.Textbox(label="Tu mensaje", elem_id="chatbot_input")
                        submit_button = gr.Button("Enviar")
                        chatbot_history = gr.State(value=[])

                        # Add selection options
                        selection = gr.Radio(
                            ["Solo Búsqueda Vectorial", "Solo Yi-Coder", "Ambos (basado en umbral de similitud)"],
                            label="Seleccione el modo de búsqueda",
                            value="Ambos (basado en umbral de similitud)"
                        )
                        similarity_threshold_slider = gr.Slider(
                            minimum=0.0, maximum=1.0, value=SIMILARITY_THRESHOLD_DEFAULT, step=0.01,
                            label="Umbral de similitud (solo para 'Ambos')"
                        )
                        max_length_slider = gr.Slider(
                            minimum=1, maximum=1000, value=MAX_LENGTH_DEFAULT,
                            label="Longitud máxima de tokens (solo para Yi-Coder)"
                        )
                        system_prompt_input = gr.Textbox(
                            label="Instrucción del sistema", value=SYSTEM_PROMPT, lines=2
                        )

                    with gr.Column(scale=1):
                        image_url = gr.State(value=None)
                        image_output = gr.Image(label="Imagen asociada")

                        # Define processing functions
                        def on_submit(message, history, selected_option, similarity_threshold, system_prompt, max_length):
                            history, new_history, image = process_input(
                                message, history, selected_option, similarity_threshold, system_prompt, max_length
                            )
                            return history, new_history, image

                        # Configure click events for the chatbot
                        submit_button.click(
                            on_submit,
                            inputs=[chatbot_input, chatbot_history, selection, similarity_threshold_slider, system_prompt_input, max_length_slider],
                            outputs=[chatbot_output, chatbot_history, image_url]
                        )
                        image_url.change(fn=update_image, inputs=image_url, outputs=image_output)

    return demo