Update app.py

app.py

@@ -4,12 +4,11 @@ import os
 import uuid
 import json
 
-# 1. CẤU HÌNH HỆ THỐNG
+# 1. HỆ THỐNG & MODEL
 HF_TOKEN = os.getenv("HUGGINGFACE_HUB_TOKEN")
 client = InferenceClient(model="Qwen/Qwen2.5-7B-Instruct", token=HF_TOKEN)
 DB_FILE = "nodeai_user_vault.json"
 
-# 2. QUẢN LÝ DỮ LIỆU THEO USER (DATABASE LOGIC)
 def load_vault():
     if os.path.exists(DB_FILE):
         try:
@@ -21,7 +20,7 @@ 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)
 
-# 3. GIAO DIỆN GLASSMORPHISM PLATINUM
+# 2. GIAO DIỆN SIÊU CẤP (GLASSMORPHISM)
 custom_css = """
 @import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@800&family=Plus+Jakarta+Sans:wght@400;600&display=swap');
 
@@ -30,7 +29,7 @@ custom_css = """
     font-family: 'Plus Jakarta Sans', sans-serif !important;
 }
 
-/* Sidebar Pro */
+/* Sidebar */
 .sidebar-node {
     position: fixed !important;
     left: 0 !important; top: 0 !important;
@@ -50,7 +49,6 @@ custom_css = """
     font-size: 24px; text-align: center; margin-bottom: 25px;
 }
 
-/* Nút Workspace Màu Cam Cực Đẹp */
 .orange-btn {
     background: linear-gradient(135deg, #ff6b6b 0%, #ff8e53 100%) !important;
     border: none !important; color: white !important;
@@ -58,12 +56,13 @@ custom_css = """
     box-shadow: 0 4px 15px rgba(255, 107, 107, 0.3) !important;
 }
 
-/* Khung Chat Chính */
+/* Chat Area */
 .chat-main {
     margin-left: 280px !important;
     width: calc(100% - 280px) !important;
     height: 100vh !important;
     padding: 0 20px !important;
+    box-sizing: border-box !important;
 }
 
 .gr-chatbot { 
@@ -71,7 +70,7 @@ custom_css = """
     height: 78vh !important; margin-bottom: 110px !important;
 }
 
-/* Thanh Nhập Liệu - Fix lỗi tràn màn hình */
+/* Input Area Fixed */
 .input-fixed-bottom {
     position: fixed !important;
     bottom: 30px !important;
@@ -85,11 +84,11 @@ custom_css = """
     border-radius: 22px !important;
     padding: 5px 15px !important;
     z-index: 2000 !important;
+    box-sizing: border-box !important;
 }
 
 footer { display: none !important; }
 
-/* Mobile Optimization */
 @media screen and (max-width: 768px) {
     .sidebar-node { display: none !important; }
     .chat-main { margin-left: 0 !important; width: 100% !important; }
@@ -97,13 +96,12 @@ footer { display: none !important; }
 }
 """
 
-# 4. XỬ LÝ CHAT THEO USERNAME
-def get_user_data(profile: gr.OAuthProfile | None):
-    # Nếu chưa login, dùng tên mặc định 'Guest'
-    return profile.username if profile else "Guest"
+# 3. CORE LOGIC
+def get_username(profile: gr.OAuthProfile | None):
+    return profile.username if profile else "Master_Phuc"
 
 def chat_fn(message, history, session_id, profile: gr.OAuthProfile | None):
-    username = get_user_data(profile)
+    username = get_username(profile)
     user_text = message.get("text", "")
     if not user_text: yield {"text": ""}, history, session_id, "" ; return
     
@@ -128,57 +126,68 @@ 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, ""
 
-# 5. DỰNG GIAO DIỆN CÁ NHÂN HÓA
-with gr.Blocks(title="NodeAI Genesis v32.5", css=custom_css) as demo:
+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:
     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>")
-            
-            # Nút đăng nhập chính chủ
-            gr.LoginButton(value="Xác thực Nick")
-            
+            gr.LoginButton(value="Đăng nhập")
             new_btn = gr.Button("＋ NEW WORKSPACE", elem_classes="orange-btn")
             
             gr.Markdown("### 🕒 Lịch sử trò chuyện")
-            history_area = gr.Column()
-
-            @gr.render(inputs=history_area)
-            def render_history(profile: gr.OAuthProfile | None):
-                username = get_user_data(profile)
-                vault = load_vault()
-                user_chats = vault.get(username, {})
-                
-                for sid in reversed(list(user_chats.keys())):
-                    btn = gr.Button(f"◈ {user_chats[sid]['title']}", variant="ghost")
-                    # Khi bấm vào lịch sử, load lại đúng chat của sid đó
-                    btn.click(lambda s=sid, u=username: (load_vault()[u][s]["history"], s), 
-                              None, [chatbot, session_id])
-
-        # MAIN AREA
+            
+            # 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)
+                user_chats = current_vault.get(username, {})
+                with gr.Column():
+                    for sid in reversed(list(user_chats.keys())):
+                        btn = gr.Button(f"◈ {user_chats[sid]['title']}", variant="ghost")
+                        btn.click(lambda s=sid, u=username: (load_vault()[u][s]["history"], s), 
+                                  None, [chatbot, session_id])
+
+        # MAIN
         with gr.Column(elem_classes="chat-main"):
             chatbot = gr.Chatbot(show_label=False, type="messages") 
             audio_out = gr.Audio(autoplay=True, visible=False)
             
             with gr.Row(elem_classes="input-fixed-bottom"):
                 msg_input = gr.MultimodalTextbox(
-                    show_label=False, placeholder="Nhập tin nhắn...", container=False
+                    show_label=False, placeholder="Hỏi Master Phúc...", container=False
                 )
 
     # EVENT HANDLERS
+    def update_vault(): return load_vault()
+
     msg_input.submit(
         chat_fn, [msg_input, chatbot, session_id], [msg_input, chatbot, session_id, tts_buffer]
-    ).then(lambda x: gr.update() if not x else gr.Audio(value=f"https://translate.google.com/translate_tts?ie=UTF-8&tl=vi&client=tw-ob&q={x}"), 
-           tts_buffer, audio_out)
+    ).then(
+        update_vault, None, vault_state # Cập nhật lại state để sidebar render lại
+    ).then(
+        tts_engine, tts_buffer, audio_out
+    )
     
     new_btn.click(lambda: ([], str(uuid.uuid4())), None, [chatbot, session_id])
 
 if __name__ == "__main__":
-    demo.launch()
+    # CHUYỂN CSS VÀO ĐÂY ĐỂ FIX WARNING
+    demo.launch(css=custom_css)