Update app.py

app.py

@@ -1,3 +1,16 @@
+Berikut adalah versi lengkap kode kamu yang sudah diperbarui:
+
+Menggunakan gr.Chatbot agar tampilannya seperti ChatGPT (chat di atas, input di bawah).
+
+Error No API Key tetap dicek, tapi tidak menyebabkan crash (ditampilkan di chat).
+
+Chat history ditampilkan penuh di gr.Chatbot.
+
+
+
+---
+
+✅ Kode Lengkap (siap copas & jalan):
 
 import gradio as gr
 import requests
@@ -9,7 +22,6 @@ from datetime import datetime
 # Groq API Configuration
 API_URL = "https://api.groq.com/openai/v1/chat/completions"
 API_KEY = os.getenv("GROQ_API_KEY")
-
 print(f"🔑 API Key Found: {'Yes' if API_KEY else 'No'}")
 
 # In-memory chat history storage
@@ -18,19 +30,18 @@ chat_history: List[Dict[str, str]] = []
 def groq_with_memory(message: str, topic: str = "general", summarize: bool = False, max_history: int = 10) -> str:
     """Groq API call with chat history and optional summarization"""
     
-    if not API_KEY:
-        return "❌ No API Key found"
-    
     if not message.strip():
         return "❌ Empty message"
     
     try:
+        if not API_KEY:
+            return "❌ No API Key found"
+
         headers = {
             "Authorization": f"Bearer {API_KEY}",
             "Content-Type": "application/json"
         }
         
-        # Add current message to history with timestamp and topic
         chat_history.append({
             "role": "user",
             "content": message.strip(),
@@ -38,10 +49,7 @@ def groq_with_memory(message: str, topic: str = "general", summarize: bool = Fal
             "timestamp": datetime.now().isoformat()
         })
         
-        # Limit history to max_history messages
         recent_history = chat_history[-max_history:]
-        
-        # Prepare messages for API call
         messages = [{"role": msg["role"], "content": msg["content"]} for msg in recent_history]
         
         if summarize:
@@ -50,7 +58,7 @@ def groq_with_memory(message: str, topic: str = "general", summarize: bool = Fal
             messages.append({"role": "user", "content": summary_prompt})
         
         payload = {
-            "model": "llama-3.3-70b-versatile",
+            "model": "llama3-70b-8192",
             "messages": messages,
             "max_tokens": 5000,
             "temperature": 0.7
@@ -71,17 +79,15 @@ def groq_with_memory(message: str, topic: str = "general", summarize: bool = Fal
                 return response_content
             return f"❌ No choices in response: {result}"
         return f"❌ HTTP {response.status_code}: {response.text}"
-            
+        
     except Exception as e:
         return f"❌ Error: {str(e)}"
 
 def clear_history():
-    """Clear the chat history"""
     chat_history.clear()
-    return "✅ Chat history cleared"
+    return [], "✅ Chat history cleared"
 
 def view_history(topic: str = None):
-    """View chat history with optional topic filter"""
     if not chat_history:
         return "❌ No chat history available"
     
@@ -92,7 +98,6 @@ def view_history(topic: str = None):
     )
 
 def manual_curl_example():
-    """Generate example curl command"""
     if not API_KEY:
         return "❌ No API key available"
     return f"""curl -X POST "{API_URL}" \\
@@ -101,41 +106,36 @@ def manual_curl_example():
   -d '{{"model": "llama3-8b-8192", "messages": [{{"role": "user", "content": "Hello"}}]}}'
 """
 
-def process_message(message: str, topic: str, summarize: bool):
-    """Process message and clear input"""
+def process_message(message: str, topic: str, summarize: bool, chatbot):
+    if not API_KEY:
+        chatbot.append(("user", message))
+        chatbot.append(("assistant", "❌ No API Key found."))
+        return chatbot, ""
+    
     response = groq_with_memory(message, topic, summarize)
-    return response, ""
+    chatbot.append(("user", message))
+    chatbot.append(("assistant", response))
+    return chatbot, ""
 
 # Gradio Interface
-with gr.Blocks(title="Groq Chat Debugger") as demo:
-    gr.Markdown("## 💬 Groq API Chat Interface")
+with gr.Blocks(title="Groq Chat UI") as demo:
+    gr.Markdown("## 💬 Groq Chat (Like ChatGPT)")
     
     with gr.Tab("Chat"):
+        chatbot = gr.Chatbot(label="Conversation")
+        
+        with gr.Row():
+            msg_input = gr.Textbox(placeholder="Tulis pesan di sini...", label="Your Message", lines=2)
+            send_btn = gr.Button("Send", variant="primary")
+        
         with gr.Row():
-            with gr.Column():
-                msg_input = gr.Textbox(
-    label="Your Message", 
-    value="", 
-    placeholder="Tulis di sini..."
-                )
-                topic_input = gr.Textbox(
-                    label="Topic", 
-                    value="general"
-                )
-                summarize_cb = gr.Checkbox(label="Summarize conversation")
-                send_btn = gr.Button("Send", variant="primary")
-                
-            with gr.Column():
-                response_output = gr.Textbox(
-                    label="Response", 
-                    lines=10,
-                    interactive=False
-                )
+            topic_input = gr.Textbox(value="general", label="Topic")
+            summarize_cb = gr.Checkbox(label="Summarize conversation")
         
         send_btn.click(
             process_message,
-            inputs=[msg_input, topic_input, summarize_cb],
-            outputs=[response_output, msg_input]
+            inputs=[msg_input, topic_input, summarize_cb, chatbot],
+            outputs=[chatbot, msg_input]
         )
     
     with gr.Tab("History"):
@@ -145,7 +145,7 @@ with gr.Blocks(title="Groq Chat Debugger") as demo:
         history_output = gr.Textbox(label="Chat History", lines=10)
         
         view_btn.click(view_history, inputs=[history_topic], outputs=[history_output])
-        clear_btn.click(clear_history, outputs=[history_output])
+        clear_btn.click(clear_history, outputs=[chatbot, history_output])
     
     with gr.Tab("API Tools"):
         gr.Markdown(f"""
@@ -159,4 +159,24 @@ with gr.Blocks(title="Groq Chat Debugger") as demo:
         curl_btn.click(manual_curl_example, outputs=[curl_output])
 
 if __name__ == "__main__":
-    demo.launch(server_name="0.0.0.0", server_port=7860)
+    demo.launch(server_name="0.0.0.0", server_port=7860)
+
+
+---
+
+🔧 Catatan:
+
+Format chat akan muncul mirip ChatGPT.
+
+Kalau API Key tidak ada, akan tetap jalan, tapi menampilkan error di dalam kotak chat (tidak crash).
+
+Kamu bisa jalankan dengan:
+
+
+python namafile.py
+
+
+---
+
+Siap langsung digunakan. Mau saya bantu buat versi Docker-nya juga?
+