Update app.py

app.py

@@ -73,13 +73,10 @@ def on_user_message(user_message: str, state: Dict):
     if not user_message.strip():
         return [], state, gr.update(value="")
     messages = state["messages"]
-
     if not state["system_used"]:
         messages.insert(0, {"role": "system", "content": SYSTEM_PROMPT})
         state["system_used"] = True
-
     messages.append({"role": "user", "content": user_message})
-
     try:
         client = get_client()
         response = client.chat_completion(
@@ -92,10 +89,8 @@ def on_user_message(user_message: str, state: Dict):
         assistant_reply = response.choices[0].message["content"].strip()
     except:
         assistant_reply = mock_predict(user_message)
-
     messages.append({"role": "assistant", "content": assistant_reply})
     state["messages"] = messages
-
     chat_history = []
     for msg in messages:
         if msg["role"] != "system" and msg["content"].strip():
@@ -106,56 +101,28 @@ def on_user_message(user_message: str, state: Dict):
                 f'</span></div>'
             )
             chat_history.append({"role": msg["role"], "content": html})
-
     return chat_history, state, gr.update(value="")
 
 # -----------------------------
 # Build UI
 # -----------------------------
 def build_ui():
-
     css = """
     body {background-color:#000000; color:#00aaff;}
-
-    .chat-container {
-        display:flex;
-        flex-direction:row;
-        gap:20px;
-        height:auto;
-    }
-
-    .chat-box {
-        flex:2;
-        overflow-y:auto;
-        padding:10px;
-        border:1px solid #00aaff;
-        border-radius:5px;
-        background:#000;
-        height:250px !important;
-    }
-
-    .ads-box {
-        flex:1;
-        display:flex;
-        flex-direction:column;
-        gap:10px;
+    .chat-container {display:flex; flex-direction:row; gap:20px; height:600px;}
+    .chat-box { flex:2; overflow-y:auto; padding:10px; border:1px solid #00aaff; border-radius:5px; background:#000; width:100%; }
+    .ads-box {flex:1; display:flex; flex-direction:column; gap:10px; height:600px;}
+    .ad { background-color:#111; color:#fff; flex:1; display:flex; justify-content:center; align-items:center; font-weight:bold; border:1px solid #00aaff; border-radius:5px; }
+    /* СТИЛЬ ОКНА ВВОДА — КАК ОКНО ЧАТА */
+    .input-styled {
+        width:100% !important;
+        max-width: none !important;
     }
-
-    .ad {
-        background-color:#111;
-        color:#fff;
-        flex:1;
-        display:flex;
-        justify-content:center;
-        align-items:center;
-        font-weight:bold;
-        border:1px solid #00aaff;
-        border-radius:5px;
-        height:120px;
+    .input-styled .wrap {
+        width:100% !important;
     }
-
-    /* Окно ввода текста — одинаковое с чатом */
     .input-styled textarea {
+        width:100% !important;
         background:#000000 !important;
         color:#00aaff !important;
         border:1px solid #00aaff !important;
@@ -163,13 +130,15 @@ def build_ui():
         padding:10px !important;
         font-size:14px !important;
         font-family:Arial, sans-serif !important;
-        height:250px !important;
-        resize:none !important;
-        width:100% !important;
-        box-sizing:border-box !important;
+        resize: vertical;
+        min-height: 40px;
+    }
+    .input-styled label {
+        color: #00aaff !important;
+        font-family: Arial, sans-serif;
+        font-size: 14px;
     }
     """
-
     autoscroll_js = """
     <script>
     const chatObserver = new MutationObserver((mutations) => {
@@ -179,12 +148,10 @@ def build_ui():
     document.querySelectorAll('.chat-box').forEach(el => chatObserver.observe(el, {childList:true, subtree:true}));
     </script>
     """
-
     initial_bot_message = (
-        "Привет! Я твой консультант по Ozon. Помогаю с товарами, аналитикой, карточками, продажами "
-        "и сложными ситуациями. С чего начнем?"
+        "Привет! Я консультант Ozon. Могу помочь с товарами, заказами и продажами. "
+        "С чем хотите помочь первым?"
     )
-
     chat_history_initial = [
         {
             "role": "assistant",
@@ -195,51 +162,36 @@ def build_ui():
             ),
         }
     ]
-
     with gr.Blocks() as app:
         gr.HTML(f"<style>{css}</style>")
         gr.HTML(autoscroll_js)
-
         with gr.Row(elem_classes="chat-container"):
             with gr.Column(scale=3):
-
-                chat = gr.Chatbot(
-                    value=chat_history_initial,
-                    elem_classes="chat-box"
-                )
-
+                chat = gr.Chatbot(value=chat_history_initial, elem_classes="chat-box")
                 input_box = gr.Textbox(
                     placeholder="Введите сообщение…",
+                    label="Сообщение",
                     elem_classes="input-styled",
-                    multiline=True,
-                    lines=5,
-                    label=None
+                    lines=1
                 )
-
                 state = gr.State(reset_state())
-
                 input_box.submit(
                     on_user_message,
                     inputs=[input_box, state],
                     outputs=[chat, state, input_box]
                 )
-
                 gr.Button("Очистить чат").click(
                     lambda: (chat_history_initial, reset_state(), gr.update(value="")),
                     None,
                     [chat, state, input_box]
                 )
-
             with gr.Column(scale=1):
                 with gr.Row(elem_classes="ads-box"):
                     gr.HTML('<div class="ad">Здесь может быть ваша реклама</div>')
                     gr.HTML('<div class="ad">Здесь может быть ваша реклама</div>')
-
     return app
 
-
 app = build_ui()
-
 if __name__ == "__main__":
     app.queue(max_size=5)
-    app.launch(server_name="0.0.0.0", server_port=7860, debug=True, share=False)
+    app.launch(server_name="0.0.0.0", server_port=7860, debug=True, share=False)