Update app.py

app.py

@@ -4,7 +4,7 @@ import os
 import uuid
 import json
 
-# 1. HỆ THỐNG & MODEL
+# 1. CẤU HÌNH HỆ THỐNG
 HF_TOKEN = os.getenv("HUGGINGFACE_HUB_TOKEN")
 client = InferenceClient(model="Qwen/Qwen2.5-7B-Instruct", token=HF_TOKEN)
 DB_FILE = "nodeai_user_vault.json"
@@ -20,43 +20,43 @@ def save_vault(vault_data):
     with open(DB_FILE, "w", encoding="utf-8") as f:
         json.dump(vault_data, f, ensure_ascii=False, indent=4)
 
-# 2. GIAO DIỆN SIÊU CẤP (GLASSMORPHISM)
+# 2. GIAO DIỆN SIÊU CẤP (GLASSMORPHISM DIAMOND)
 custom_css = """
 @import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@800&family=Plus+Jakarta+Sans:wght@400;600&display=swap');
 
 .gradio-container {
-    background: radial-gradient(circle at 50% 0%, #10101a 0%, #050505 100%) !important;
+    background: radial-gradient(circle at 50% 0%, #0f172a 0%, #020617 100%) !important;
     font-family: 'Plus Jakarta Sans', sans-serif !important;
 }
 
-/* Sidebar */
+/* Sidebar Kính Mờ */
 .sidebar-node {
     position: fixed !important;
     left: 0 !important; top: 0 !important;
     width: 280px !important; height: 100vh !important;
-    background: rgba(10, 10, 15, 0.7) !important;
-    backdrop-filter: blur(25px) !important;
-    border-right: 1px solid rgba(255, 255, 255, 0.05) !important;
+    background: rgba(15, 23, 42, 0.6) !important;
+    backdrop-filter: blur(20px) !important;
+    border-right: 1px solid rgba(255, 255, 255, 0.1) !important;
     z-index: 1000 !important;
     padding: 25px !important;
 }
 
 .logo-text {
     font-family: 'Orbitron', sans-serif !important;
-    background: linear-gradient(90deg, #00f2fe, #7ef2ff);
+    background: linear-gradient(90deg, #38bdf8, #818cf8);
     -webkit-background-clip: text;
     -webkit-text-fill-color: transparent;
-    font-size: 24px; text-align: center; margin-bottom: 25px;
+    font-size: 22px; text-align: center; margin-bottom: 25px;
 }
 
 .orange-btn {
-    background: linear-gradient(135deg, #ff6b6b 0%, #ff8e53 100%) !important;
+    background: linear-gradient(135deg, #f97316 0%, #fb923c 100%) !important;
     border: none !important; color: white !important;
     font-weight: 600 !important; border-radius: 12px !important;
-    box-shadow: 0 4px 15px rgba(255, 107, 107, 0.3) !important;
+    box-shadow: 0 4px 15px rgba(249, 115, 22, 0.3) !important;
 }
 
-/* Chat Area */
+/* Chat Main Area */
 .chat-main {
     margin-left: 280px !important;
     width: calc(100% - 280px) !important;
@@ -67,21 +67,21 @@ custom_css = """
 
 .gr-chatbot { 
     background: transparent !important; border: none !important; 
-    height: 78vh !important; margin-bottom: 110px !important;
+    height: 75vh !important; margin-bottom: 110px !important;
 }
 
-/* Input Area Fixed */
+/* Input Area Fixed - Không bao giờ tràn */
 .input-fixed-bottom {
     position: fixed !important;
-    bottom: 30px !important;
+    bottom: 25px !important;
     left: 50% !important;
     transform: translateX(calc(-50% + 140px)) !important;
-    width: 90% !important;
+    width: calc(100% - 340px) !important;
     max-width: 800px !important;
-    background: rgba(25, 25, 35, 0.9) !important;
-    backdrop-filter: blur(15px) !important;
-    border: 1px solid rgba(0, 242, 254, 0.3) !important;
-    border-radius: 22px !important;
+    background: rgba(30, 41, 59, 0.8) !important;
+    backdrop-filter: blur(10px) !important;
+    border: 1px solid rgba(56, 189, 248, 0.3) !important;
+    border-radius: 20px !important;
     padding: 5px 15px !important;
     z-index: 2000 !important;
     box-sizing: border-box !important;
@@ -92,7 +92,7 @@ footer { display: none !important; }
 @media screen and (max-width: 768px) {
     .sidebar-node { display: none !important; }
     .chat-main { margin-left: 0 !important; width: 100% !important; }
-    .input-fixed-bottom { transform: translateX(-50%) !important; width: 95% !important; }
+    .input-fixed-bottom { transform: translateX(-50%) !important; width: 92% !important; }
 }
 """
 
@@ -109,7 +109,7 @@ def chat_fn(message, history, session_id, profile: gr.OAuthProfile | None):
     if username not in vault: vault[username] = {}
     
     if session_id not in vault[username]:
-        vault[username][session_id] = {"title": user_text[:25], "history": []}
+        vault[username][session_id] = {"title": user_text[:20] + "...", "history": []}
     
     api_messages = [{"role": "system", "content": f"Master: {username}. Bạn là NodeAI Genesis."}]
     for msg in history: api_messages.append({"role": msg["role"], "content": msg["content"]})
@@ -126,35 +126,25 @@ def chat_fn(message, history, session_id, profile: gr.OAuthProfile | None):
         final_h = new_h + [{"role": "assistant", "content": ans}]
         vault[username][session_id]["history"] = final_h
         save_vault(vault)
-        # Trả về ans cuối cùng để đưa vào TTS
         yield {"text": ""}, final_h, session_id, ans
     except Exception as e:
         yield {"text": ""}, history + [{"role": "assistant", "content": str(e)}], session_id, ""
 
-def tts_engine(text):
-    if not text or len(text) < 2: return None
-    try:
-        # Sử dụng API TTS của Google trực tiếp để tránh lỗi file
-        return f"https://translate.google.com/translate_tts?ie=UTF-8&tl=vi&client=tw-ob&q={text[:200]}"
-    except: return None
-
 # 4. GIAO DIỆN
-with gr.Blocks(title="NodeAI Genesis v32.6") as demo:
+with gr.Blocks(title="NodeAI Genesis v32.7") as demo:
     session_id = gr.State(str(uuid.uuid4()))
     tts_buffer = gr.Textbox(visible=False)
-    # State để kích hoạt render lại lịch sử
     vault_state = gr.State(load_vault())
     
     with gr.Row():
         # SIDEBAR
         with gr.Column(elem_classes="sidebar-node"):
             gr.HTML("<div class='logo-text'>NODEAI GENESIS</div>")
-            gr.LoginButton(value="Đăng nhập")
+            gr.LoginButton(value="Xác thực Nick")
             new_btn = gr.Button("＋ NEW WORKSPACE", elem_classes="orange-btn")
             
-            gr.Markdown("### 🕒 Lịch sử trò chuyện")
+            gr.Markdown("### 🕒 Lịch sử Chat")
             
-            # SỬA LỖI RENDER TẠI ĐÂY
             @gr.render(inputs=[vault_state]) 
             def render_history(current_vault, profile: gr.OAuthProfile | None):
                 username = get_username(profile)
@@ -167,12 +157,15 @@ with gr.Blocks(title="NodeAI Genesis v32.6") as demo:
 
         # MAIN
         with gr.Column(elem_classes="chat-main"):
-            chatbot = gr.Chatbot(show_label=False, type="messages") 
+            # Đã xóa type="messages" để fix lỗi runtime
+            chatbot = gr.Chatbot(show_label=False) 
             audio_out = gr.Audio(autoplay=True, visible=False)
             
             with gr.Row(elem_classes="input-fixed-bottom"):
                 msg_input = gr.MultimodalTextbox(
-                    show_label=False, placeholder="Hỏi Master Phúc...", container=False
+                    show_label=False, 
+                    placeholder="Hỏi Master Phúc bất cứ điều gì...", 
+                    container=False
                 )
 
     # EVENT HANDLERS
@@ -181,13 +174,13 @@ with gr.Blocks(title="NodeAI Genesis v32.6") as demo:
     msg_input.submit(
         chat_fn, [msg_input, chatbot, session_id], [msg_input, chatbot, session_id, tts_buffer]
     ).then(
-        update_vault, None, vault_state # Cập nhật lại state để sidebar render lại
+        update_vault, None, vault_state
     ).then(
-        tts_engine, tts_buffer, audio_out
+        lambda x: f"https://translate.google.com/translate_tts?ie=UTF-8&tl=vi&client=tw-ob&q={x[:200]}" if x else None,
+        tts_buffer, audio_out
     )
     
     new_btn.click(lambda: ([], str(uuid.uuid4())), None, [chatbot, session_id])
 
 if __name__ == "__main__":
-    # CHUYỂN CSS VÀO ĐÂY ĐỂ FIX WARNING
     demo.launch(css=custom_css)