src/ui/components.py

import gradio as gr

from src.core.config import settings
from src.ui.callbacks import bot_response, set_interactive, user_input
from src.ui.styles import CSS


def create_ui():
    # fill_height=True растягивает интерфейс на всю высоту экрана
    with gr.Blocks(theme=gr.themes.Base(), css=CSS, fill_height=True) as demo:
        gr.HTML("<script>document.title = 'AI Agent';</script>")

        with gr.Sidebar(width=280):
            use_search = gr.Checkbox(label="🌐 Интернет-поиск", value=False)
            uploaded_file = gr.File(
                label="📎 Файл контекста",
                file_types=[".txt", ".pdf", ".py", ".md", ".json"],
            )

            # Аккордеон скроет страшные ползунки, пока юзер сам их не откроет
            with gr.Accordion("⚙️ Настройки модели", open=False):
                sys_pt = gr.Textbox(
                    label="System Prompt",
                    value="Вы AI-агент. Если нужно узнать свежую информацию, используйте поиск.",
                    lines=3,
                )
                temp = gr.Slider(0, 1, value=settings.DEFAULT_TEMP, label="Температура")
                tokens = gr.Slider(
                    512,
                    settings.CONTEXT_SIZE,
                    value=settings.DEFAULT_MAX_TOKENS,
                    label="Max Tokens",
                    step=128,
                )

            clear = gr.Button("🗑️ Очистить чат")

        # Чат
        chatbot = gr.Chatbot(
            elem_id="chatbot",
            show_label=False,
            scale=1,
        )

        # Плашка ввода в самом низу
        with gr.Row():
            msg = gr.Textbox(
                show_label=False,
                placeholder="Напиши сообщение...",
                scale=10,
                autofocus=True,
                container=False,
            )
            submit = gr.Button("➤", variant="primary", scale=1, min_width=50)

        # События интерфейса (обработчики)
        input_args = [msg, chatbot]
        output_args = [msg, chatbot]
        gen_args = [chatbot, sys_pt, temp, tokens, use_search, uploaded_file]

        # Обработка Enter в поле ввода
        msg.submit(user_input, input_args, output_args, queue=False).then(
            lambda: set_interactive(False), None, [msg, submit]
        ).then(bot_response, gen_args, chatbot).then(
            lambda: set_interactive(True), None, [msg, submit]
        )

        # Обработка клика по кнопке отправки
        submit.click(user_input, input_args, output_args, queue=False).then(
            lambda: set_interactive(False), None, [msg, submit]
        ).then(bot_response, gen_args, chatbot).then(
            lambda: set_interactive(True), None, [msg, submit]
        )

        # Очистка чата
        clear.click(lambda: [], None, chatbot)

    return demo