update ui

ui.py

@@ -4,10 +4,11 @@ import gradio as gr
 
 import config
 from model import engine
-from utils import sanitize_content
+from utils import get_clean_text
 
+# --- CSS стили ---
 CUSTOM_CSS = """
-/* Убираем отступы у основного контейнера и растягиваем его */
+/* Убираем глобальные отступы и скролл страницы */
 .gradio-container {
     width: 100% !important;
     height: 100vh !important;
@@ -17,43 +18,53 @@ CUSTOM_CSS = """
     overflow: hidden !important;
 }
 
-/* Настройка главной колонки чата */
-#main-col {
-    height: 100% !important;
-    max_height: 100vh !important;
-    display: flex !important;
-    flex-direction: column !important;
-    justify-content: space-between !important; /* Распределяем пространство */
-    padding-bottom: 10px !important;
+/* Настройки боковой панели - она тоже должна быть во весь экран */
+.sidebar {
+    height: 100vh !important;
+    overflow-y: auto !important;
 }
 
-/* Сам чатбот - он должен расти (flex-grow) и иметь скролл */
+/*
+   ГЛАВНОЕ ИСПРАВЛЕНИЕ РАЗМЕРА:
+   Задаем высоту чата жестко: 75% от высоты экрана.
+   min-height гарантирует, что он не схлопнется.
+   flex-grow отключен, чтобы избежать конфликтов.
+*/
 #chatbot {
-    flex-grow: 1 !important; /* Занимает всё доступное место */
-    height: auto !important;
-    min-height: 0 !important; /* Важно для работы скролла во flex-контейнере */
+    height: 75vh !important;
+    min-height: 75vh !important;
     overflow-y: auto !important;
     margin-bottom: 10px !important;
 }
 
-/* Скрываем футер */
+/* Блок ввода прижимаем ниже */
+.input-row {
+    height: auto !important;
+    padding-bottom: 15px !important;
+}
+
 footer { display: none !important; }
 """
 
+
 # --- Логика событий ---
 
 
 def user_input(user_message, history):
     if not user_message:
         return None, history
+
     if history is None:
         history = []
 
     clean_history = []
     for msg in history:
-        clean_history.append(
-            {"role": msg["role"], "content": sanitize_content(msg.get("content", ""))}
-        )
+        # Чистим контент перед добавлением в историю
+        raw_content = msg.get("content", "")
+        text_content = get_clean_text(raw_content)
+
+        clean_history.append({"role": msg["role"], "content": text_content})
+
     clean_history.append({"role": "user", "content": str(user_message)})
     return "", clean_history
 
@@ -65,12 +76,16 @@ def bot_response(history, system_prompt, temperature, max_tokens):
         return
 
     messages = [{"role": "system", "content": system_prompt}]
+
+    # Берем последние 15 сообщений
     relevant_history = history[-15:] if len(history) > 15 else history
 
     for msg in relevant_history:
-        messages.append(
-            {"role": msg["role"], "content": sanitize_content(msg.get("content", ""))}
-        )
+        # Также чистим контент перед отправкой в модель
+        raw_content = msg.get("content", "")
+        text_content = get_clean_text(raw_content)
+
+        messages.append({"role": msg["role"], "content": text_content})
 
     history.append({"role": "assistant", "content": ""})
 
@@ -81,6 +96,7 @@ def bot_response(history, system_prompt, temperature, max_tokens):
             temperature=temperature,
             stream=True,
         )
+
         partial_text = ""
         for chunk in stream:
             delta = chunk["choices"][0]["delta"]
@@ -99,9 +115,7 @@ def set_interactive(is_interactive):
     return (
         gr.update(
             interactive=is_interactive,
-            placeholder="Wait for response..."
-            if not is_interactive
-            else "Type code question...",
+            placeholder="Wait..." if not is_interactive else "Type code question...",
         ),
         gr.update(interactive=is_interactive),
     )
@@ -113,10 +127,9 @@ def set_interactive(is_interactive):
 def create_ui():
     theme = gr.themes.Soft(primary_hue="blue", text_size="lg")
 
-    with gr.Blocks(
-        theme=theme, css=CUSTOM_CSS, title="Qwen Coder Pro", fill_height=True
-    ) as demo:
-        with gr.Row(elem_id="main-row", variant="panel"):
+    # Убрали fill_height=True, чтобы CSS работал жестко
+    with gr.Blocks(theme=theme, css=CUSTOM_CSS, title="Qwen Coder Pro") as demo:
+        with gr.Row():
             # Боковая панель
             with gr.Sidebar():
                 gr.Markdown("### ⚙️ Settings")
@@ -133,16 +146,19 @@ def create_ui():
                 )
                 clear_btn = gr.Button("🗑️ Clear Chat", variant="secondary")
 
-            with gr.Column(scale=1, elem_id="main-col"):
+            # Основная колонка
+            with gr.Column(scale=1):
+                # Чатбот
                 chatbot = gr.Chatbot(
                     label="Code Assistant",
-                    elem_id="chatbot",
+                    elem_id="chatbot",  # Связка с CSS #chatbot
                     avatar_images=(None, "https://api.iconify.design/noto:robot.svg"),
+                    type="messages",
                     scale=1,
                 )
 
-                # Группа ввода
-                with gr.Row(variant="compact", elem_id="input-row"):
+                # Строка ввода
+                with gr.Row(variant="compact", elem_classes="input-row"):
                     msg = gr.Textbox(
                         show_label=False,
                         placeholder="Type your code question here...",
@@ -155,7 +171,7 @@ def create_ui():
                         "Run ➤", variant="primary", scale=1, min_width=100
                     )
 
-        # Chains (События)
+        # Chains
         submit_event = (
             msg.submit(user_input, [msg, chatbot], [msg, chatbot], queue=False)
             .then(lambda: set_interactive(False), None, [msg, submit_btn], queue=False)

utils.py

@@ -6,3 +6,16 @@ def sanitize_content(content):
     if isinstance(content, list):
         return "\n".join(str(item) for item in content)
     return str(content) if content is not None else ""
+
+
+def get_clean_text(content):
+    """
+    Извлекает текст из разных форматов Gradio 5 (словарь, список, строка).
+    Решает проблему отображения {'text': ...}
+    """
+    # Если пришел словарь {'text': '...', 'type': 'text'}
+    if isinstance(content, dict) and "text" in content:
+        return str(content["text"])
+
+    # Если пришла строка или список, используем вашу функцию из utils.py
+    return sanitize_content(content)