Update app.py

app.py

@@ -1,126 +1,143 @@
 import gradio as gr
 from huggingface_hub import InferenceClient
+from supabase import create_client, Client
 import os
 import uuid
 import json
+import base64
 
-# 1. CẤU HÌNH MODEL (Qwen 2.5 là model ổn định và mạnh nhất hiện tại)
-HF_TOKEN = os.getenv("HUGGINGFACE_HUB_TOKEN")
-MODEL_ID = "Qwen/Qwen2.5-7B-Instruct" 
-client = InferenceClient(model=MODEL_ID, token=HF_TOKEN)
-DB_FILE = "nodeai_final_vault.json"
+# 1. CẤU HÌNH CORE (Lấy từ Secrets của Hugging Face)
+URL = os.environ.get("SUPABASE_URL")
+KEY = os.environ.get("SUPABASE_KEY")
+HF_TOKEN = os.environ.get("HUGGINGFACE_HUB_TOKEN")
 
-def load_vault():
-    if os.path.exists(DB_FILE):
-        try:
-            with open(DB_FILE, "r", encoding="utf-8") as f: return json.load(f)
-        except: return {}
-    return {}
+# Khởi tạo siêu máy chủ
+supabase: Client = create_client(URL, KEY)
+client = InferenceClient(model="Qwen/Qwen2.5-7B-Instruct", token=HF_TOKEN)
 
-def save_vault(data):
-    with open(DB_FILE, "w", encoding="utf-8") as f:
-        json.dump(data, f, ensure_ascii=False, indent=4)
+# 2. HÀM XỬ LÝ DATABASE (Supabase Vĩnh Cửu)
+def get_user_history(username):
+    try:
+        res = supabase.table("chats").select("*").eq("username", username).order("created_at", desc=True).execute()
+        return res.data
+    except: return []
+
+def save_to_db(username, session_id, title, history):
+    try:
+        data = {"username": username, "session_id": session_id, "title": title, "history": history}
+        supabase.table("chats").upsert(data, on_conflict="session_id").execute()
+    except Exception as e: print(f"DB Error: {e}")
 
-# 2. UI GLASSMORPHISM PLATINUM
+# 3. GIAO DIỆN SIÊU CẤP (GLASSMORPHISM PRO)
 custom_css = """
-@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;600&family=Orbitron:wght@700&display=swap');
-.gradio-container { background: #050508 !important; color: white !important; font-family: 'Plus Jakarta Sans', sans-serif !important; }
-.sidebar-node { position: fixed !important; left: 0; top: 0; width: 280px; height: 100vh; background: rgba(10, 10, 20, 0.8); backdrop-filter: blur(20px); border-right: 1px solid rgba(255,255,255,0.1); padding: 20px; z-index: 100; }
-.logo-text { font-family: 'Orbitron', sans-serif; background: linear-gradient(90deg, #00d2ff, #3a7bd5); -webkit-background-clip: text; -webkit-text-fill-color: transparent; font-size: 20px; font-weight: bold; margin-bottom: 30px; text-align: center; }
-.orange-btn { background: linear-gradient(135deg, #ff6b6b, #f093fb) !important; border: none !important; color: white !important; font-weight: bold !important; border-radius: 10px !important; }
-.chat-main { margin-left: 300px !important; max-width: calc(100% - 320px) !important; }
-.input-fixed-bottom { position: fixed !important; bottom: 20px; left: 50%; transform: translateX(calc(-50% + 140px)); width: 80%; max-width: 800px; background: #1a1a2e; border: 1px solid #3a7bd5; border-radius: 15px; z-index: 1000; }
+@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@700&family=Plus+Jakarta+Sans:wght@400;600&display=swap');
+:root { --primary: #38bdf8; --accent: #f97316; }
+.gradio-container { background: radial-gradient(circle at 50% 0%, #0f172a 0%, #020617 100%) !important; color: #e2e8f0 !important; }
+.sidebar-node { background: rgba(15, 23, 42, 0.7) !important; backdrop-filter: blur(20px) !important; border-right: 1px solid rgba(56, 189, 248, 0.2) !important; height: 100vh !important; }
+.logo-area { font-family: 'Orbitron', sans-serif; background: linear-gradient(90deg, var(--primary), #818cf8); -webkit-background-clip: text; -webkit-text-fill-color: transparent; text-align: center; padding: 20px 0; }
+.chat-bubble { border-radius: 15px !important; border: 1px solid rgba(255,255,255,0.1) !important; }
+.input-area { background: rgba(30, 41, 59, 0.9) !important; border: 1px solid var(--primary) !important; border-radius: 20px !important; box-shadow: 0 0 20px rgba(56, 189, 248, 0.2) !important; }
+.orange-btn { background: linear-gradient(135deg, #f97316 0%, #fb923c 100%) !important; color: white !important; font-weight: bold !important; border: none !important; }
 footer { display: none !important; }
 """
 
-# 3. XỬ LÝ NỘI DUNG FILE
-def process_message(message):
+# 4. LOGIC XỬ LÝ ĐA PHƯƠNG TIỆN (Multimodal)
+def process_content(message):
     text = message.get("text", "")
     files = message.get("files", [])
-    file_contents = ""
+    combined_prompt = text
     
     for f in files:
-        # Nếu là file văn bản/code thì đọc nội dung
+        name = os.path.basename(f)
         if f.lower().endswith(('.lua', '.py', '.txt', '.js', '.html', '.css')):
             try:
                 with open(f, "r", encoding="utf-8") as file:
-                    content = file.read()
-                    file_contents += f"\n\n[FILE: {os.path.basename(f)}]\n{content}\n"
+                    combined_prompt += f"\n\n[FILE: {name}]\n{file.read()}"
             except: pass
-    return text + file_contents
+        elif f.lower().endswith(('.png', '.jpg', '.jpeg')):
+            combined_prompt += f"\n\n[ Master đã gửi 1 ảnh: {name} ]"
+    return combined_prompt
 
-# 4. CHAT FUNCTION
-def chat_fn(message, history, session_id, profile: gr.OAuthProfile | None):
+def chat_engine(message, history, session_id, profile: gr.OAuthProfile | None):
     username = profile.username if profile else "Master_Phuc"
-    full_text = process_message(message)
+    full_prompt = process_content(message)
     
-    if not full_text.strip():
-        yield {"text": ""}, history, session_id, ""
-        return
+    if not full_prompt.strip(): yield "", history, session_id, "" ; return
 
-    vault = load_vault()
-    if username not in vault: vault[username] = {}
-    if session_id not in vault[username]:
-        vault[username][session_id] = {"title": message.get("text", "New Chat")[:20], "history": []}
-
-    # Format chuẩn hội thoại
-    messages = [{"role": "system", "content": f"Bạn là NodeAI Genesis. Master: {username}. Bạn hỗ trợ chuyên sâu về Roblox Lua và Web."}]
-    for msg in history:
-        messages.append({"role": msg["role"], "content": msg["content"]})
-    messages.append({"role": "user", "content": full_text})
+    # Build Prompt
+    messages = [{"role": "system", "content": f"Bạn là NodeAI Genesis. Master: {username}. Bạn là chuyên gia Roblox và Web. Hãy phân tích kỹ code Master gửi."}]
+    for msg in history: messages.append({"role": msg["role"], "content": msg["content"]})
+    messages.append({"role": "user", "content": full_prompt})
 
+    ans = ""
+    # Cập nhật UI ngay lập tức
+    display_history = history + [{"role": "user", "content": message.get("text") or "Gửi file"}]
+    
     try:
-        ans = ""
-        # Cập nhật history cho giao diện (hiển thị thumbnail ảnh nếu có)
-        new_h = history + [{"role": "user", "content": message.get("text") or "Gửi file"}]
-        
         for token in client.chat_completion(messages=messages, max_tokens=2048, stream=True):
             if token.choices[0].delta.content:
                 ans += token.choices[0].delta.content
-                yield {"text": ""}, new_h + [{"role": "assistant", "content": ans}], session_id, ""
+                yield "", display_history + [{"role": "assistant", "content": ans}], session_id, ""
         
-        final_h = new_h + [{"role": "assistant", "content": ans}]
-        vault[username][session_id]["history"] = final_h
-        save_vault(vault)
-        yield {"text": ""}, final_h, session_id, ans
+        # Lưu vào Supabase sau khi hoàn thành stream
+        final_history = display_history + [{"role": "assistant", "content": ans}]
+        title = message.get("text", "Workspace Analysis")[:25]
+        save_to_db(username, session_id, title, final_history)
+        yield "", final_history, session_id, ans
     except Exception as e:
-        yield {"text": ""}, history + [{"role": "assistant", "content": f"Lỗi: {str(e)}"}], session_id, ""
+        yield "", history + [{"role": "assistant", "content": f"⚠️ Lỗi: {str(e)}"}], session_id, ""
 
-# 5. GIAO DIỆN
-with gr.Blocks(title="NodeAI Genesis Pro") as demo:
+# 5. DỰNG WEB APP
+with gr.Blocks(title="NodeAI Diamond Pro", css=custom_css) as demo:
     session_id = gr.State(str(uuid.uuid4()))
     tts_buffer = gr.Textbox(visible=False)
-    vault_state = gr.State(load_vault())
-    
+    db_state = gr.State([])
+
     with gr.Row():
-        with gr.Column(elem_classes="sidebar-node"):
-            gr.HTML("<div class='logo-text'>NODEAI GENESIS</div>")
+        # Sidebar History
+        with gr.Column(scale=1, elem_classes="sidebar-node"):
+            gr.HTML("<div class='logo-area'><h1>NODEAI GENESIS</h1></div>")
             gr.LoginButton()
-            new_btn = gr.Button("＋ NEW WORKSPACE", elem_classes="orange-btn")
+            new_chat = gr.Button("＋ NEW WORKSPACE", elem_classes="orange-btn")
             
-            @gr.render(inputs=[vault_state]) 
-            def render_history(current_vault, profile: gr.OAuthProfile | None):
-                username = profile.username if profile else "Master_Phuc"
-                user_chats = current_vault.get(username, {})
+            gr.Markdown("### 🛠 Lịch sử Cloud")
+            @gr.render(inputs=[db_state])
+            def render_history(items, profile: gr.OAuthProfile | None):
                 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])
+                    for item in items:
+                        b = gr.Button(f"◈ {item['title']}", variant="ghost")
+                        b.click(lambda h=item['history'], s=item['session_id']: (h, s), 
+                                None, [chatbot, session_id])
 
-        with gr.Column(elem_classes="chat-main"):
-            chatbot = gr.Chatbot(show_label=False)
-            audio_out = gr.Audio(autoplay=True, visible=False)
-            with gr.Row(elem_classes="input-fixed-bottom"):
+        # Main Chat Area
+        with gr.Column(scale=4):
+            chatbot = gr.Chatbot(show_label=False, bubble_full_width=False, height="75vh")
+            audio_player = gr.Audio(autoplay=True, visible=False)
+            
+            with gr.Row(elem_classes="input-area"):
                 msg_input = gr.MultimodalTextbox(
-                    show_label=False, placeholder="Gửi ảnh, file lua hoặc nhắn tin...", 
-                    container=False, file_types=["image", ".lua", ".py", ".txt"]
+                    show_label=False, 
+                    placeholder="Dán script Roblox hoặc hỏi Master Phúc...",
+                    file_types=["image", ".lua", ".py", ".txt"],
+                    container=False
                 )
 
-    msg_input.submit(chat_fn, [msg_input, chatbot, session_id], [msg_input, chatbot, session_id, tts_buffer]
-    ).then(lambda: load_vault(), None, vault_state
-    ).then(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)
+    # Khởi tạo dữ liệu
+    def refresh(profile: gr.OAuthProfile | None):
+        user = profile.username if profile else "Master_Phuc"
+        return get_user_history(user)
+
+    demo.load(refresh, None, db_state)
+    
+    # Event Handlers
+    msg_input.submit(
+        chat_engine, [msg_input, chatbot, session_id], [msg_input, chatbot, session_id, tts_buffer]
+    ).then(refresh, None, db_state).then(
+        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_player
+    )
     
-    new_btn.click(lambda: ([], str(uuid.uuid4())), None, [chatbot, session_id])
+    new_chat.click(lambda: ([], str(uuid.uuid4())), None, [chatbot, session_id])
 
 if __name__ == "__main__":
-    demo.launch(css=custom_css)
+    demo.launch()