Update app.py

app.py

@@ -19,21 +19,17 @@ def _secret(key: str, fallback: str = None) -> str:
 # ----------------------------------------------------------------------
 # 1. Configuration & Constants
 # ----------------------------------------------------------------------
-# The private repo containing the vector DB and the logic script
 REPO_ID = _secret("REPO_ID") 
-# Files to download from the repo
 FILES_TO_DOWNLOAD = ["index.faiss", "index.pkl", "agent_logic.py"]
-# A local directory to store all downloaded assets
 LOCAL_DOWNLOAD_DIR = "downloaded_assets"
 EMBEDDING_MODEL_NAME = "google/embeddinggemma-300m" 
 
 # ----------------------------------------------------------------------
 # 2. Bootstrap Phase: Download assets and initialize the engine
-#    (This code runs only once when the Space starts up)
 # ----------------------------------------------------------------------
 print("--- [UI App] Starting bootstrap process ---")
 os.makedirs(LOCAL_DOWNLOAD_DIR, exist_ok=True)
-hf_token = _secret("HF_TOKEN") # A read-access token is required for private repos
+hf_token = _secret("HF_TOKEN")
 
 for filename in FILES_TO_DOWNLOAD:
     print(f"--- [UI App] Downloading '{filename}'... ---")
@@ -45,15 +41,12 @@ for filename in FILES_TO_DOWNLOAD:
     except Exception as e:
         raise RuntimeError(f"Failed to download '{filename}'. Check repo/file names and HF_TOKEN. Error: {e}")
 
-# Dynamically import the RAG_Engine class from the downloaded script
 logic_script_path = os.path.join(LOCAL_DOWNLOAD_DIR, "agent_logic.py")
 spec = importlib.util.spec_from_file_location("agent_logic", logic_script_path)
 agent_logic_module = importlib.util.module_from_spec(spec)
 spec.loader.exec_module(agent_logic_module)
 print("--- [UI App] Agent logic module imported successfully. ---")
 
-# Instantiate the engine. This single line triggers all the complex setup
-# defined in the private_logic.py file.
 engine = agent_logic_module.RAG_Engine(
     local_download_dir=LOCAL_DOWNLOAD_DIR,
     embedding_model_name=EMBEDDING_MODEL_NAME
@@ -61,41 +54,96 @@ engine = agent_logic_module.RAG_Engine(
 print("--- [UI App] Bootstrap complete. Gradio UI is starting. ---")
 
 # ----------------------------------------------------------------------
-# 3. Core Gradio Chat Logic (Now a simple wrapper)
+# 3. Core Gradio Chat Logic
 # ----------------------------------------------------------------------
-def respond(message: str, history: list[dict[str, str]]):
+def add_message_and_respond(message: str, history: list):
     """
-    This function is called by Gradio for each user message.
-    It passes the inputs to the RAG engine and streams the output.
+    Adds the user's message to the chat history and gets the bot's streaming response.
     """
-    final_response = engine.get_response(message, history)
+    # Add the user's message to the UI immediately
+    history.append([message, None])
+    yield history
+
+    # Convert chat history to the format the engine expects
+    history_for_engine = []
+    for user_msg, bot_msg in history[:-1]: # Exclude the current turn
+        history_for_engine.append({"role": "user", "content": user_msg})
+        if bot_msg:
+            history_for_engine.append({"role": "assistant", "content": bot_msg})
+
+    # Get the response from the agent
+    final_response = engine.get_response(message, history_for_engine)
     
-    # Stream the response back to the UI for a "typing" effect
-    response = ""
+    # Stream the complete response back to the UI
+    history[-1][1] = ""
     for char in final_response:
-        response += char
+        history[-1][1] += char
         time.sleep(0.01)
-        yield response
+        yield history
 
 # ----------------------------------------------------------------------
-# 4. UI Layout and Launch
+# 4. UI Layout and Launch (Beautified with gr.Blocks)
 # ----------------------------------------------------------------------
-chatbot = gr.ChatInterface(
-    respond,
-    type="messages",
-    title="PRECISE RAG Agent",
-    description="Silakan bertanya tentang PRECISE.",
-    examples=[
-        ["Apa rumus untuk menghitung PVR?"],
-        ["Apa tujuan pengadaan PRECISE?"],
-    ],
-    cache_examples=False,
-    theme=gr.themes.Soft(),
-)
 
-with gr.Blocks() as demo:
-    chatbot.render()
+# Custom CSS for a cleaner look
+css = """
+#chatbot { min-height: 600px; }
+.footer { text-align: center; color: #777; font-size: 0.8em; padding: 10px 0; }
+"""
+
+with gr.Blocks(theme=gr.themes.Soft(), css=css) as demo:
+    # Header
+    gr.Markdown("<h1>🤖 PRECISE RAG Agent</h1>")
+    gr.Markdown("Tanya Jawab Cerdas Mengenai Dokumentasi Sistem PRECISE")
+    
+    # Main Chatbot Interface
+    chatbot = gr.Chatbot(
+        elem_id="chatbot",
+        label="Conversation",
+        bubble_fill=False,
+        render_math=True  # <-- THE FIX FOR FORMULAS!
+    )
+    
+    # Input area
+    with gr.Row():
+        msg = gr.Textbox(
+            label="Your Question",
+            placeholder="Ketik pertanyaan Anda di sini dan tekan Enter...",
+            scale=4, # Make the textbox wider
+        )
+        submit_btn = gr.Button("Send", variant="primary", scale=1)
 
+    # Example questions
+    gr.Examples(
+        examples=[
+            "Apa tujuan pengadaan PRECISE?",
+            "Apa keunggulan utama PRECISE dibandingkan sistem perhitungan target promosi yang lama?",
+            "Apakah PRECISE sudah terbukti memberikan manfaat finansial? Bisakah diberikan contohnya?",
+            "Selain akurasi, aspek teknis apa yang membuat PRECISE unik?"
+        ],
+        inputs=msg,
+    )
+    
+    # Footer
+    gr.Markdown("<hr><p class='footer'>Powered by OpenRouter and LangChain. All rights reserved.</p>")
+
+    # --- Event Handlers ---
+    
+    # Define the action for submitting a message (either by pressing Enter or clicking the button)
+    def submit_action(message, history):
+        yield from add_message_and_respond(message, history)
+
+    # When the user submits, call the action and update the chatbot
+    # Then, clear the input textbox
+    msg.submit(submit_action, [msg, chatbot], chatbot)
+    msg.submit(lambda: "", None, msg) # Clears textbox
+    
+    submit_btn.click(submit_action, [msg, chatbot], chatbot)
+    submit_btn.click(lambda: "", None, msg) # Clears textbox
+
+# ----------------------------------------------------------------------
+# 5. Launch the App
+# ----------------------------------------------------------------------
 if __name__ == "__main__":
     allowed_user = _secret("CHAT_USER")
     allowed_pass = _secret("CHAT_PASS")