Update app.py

app.py

@@ -75,8 +75,25 @@ def response(
     
     yield AdditionalOutputs(chatbot)
 
-# Create Gradio interface
-chatbot = gr.Chatbot(type="messages")
+# Create a custom UI with Blocks for better rendering
+with gr.Blocks(theme=gr.themes.Default()) as custom_ui:
+    gr.Markdown("# LLM Voice Chat (Powered by DeepSeek & ElevenLabs)")
+    gr.Markdown("Speak after clicking the microphone button below. Your conversation will appear in the chat.")
+    
+    with gr.Row():
+        chatbot = gr.Chatbot(
+            value=[], 
+            height=500, 
+            show_label=False, 
+            type="messages",
+            elem_id="chatbot"
+        )
+    
+    # The mic_placeholder will be replaced by FastRTC with the audio controls
+    with gr.Row():
+        mic_placeholder = gr.Markdown("## Voice Controls Will Appear Here")
+
+# Create Stream with the custom UI
 stream = Stream(
     modality="audio",
     mode="send-receive",
@@ -84,8 +101,8 @@ stream = Stream(
     additional_outputs_handler=lambda a, b: b,
     additional_inputs=[chatbot],
     additional_outputs=[chatbot],
-    ui_args={"title": "LLM Voice Chat (Powered by DeepSeek & ElevenLabs)"},
-    rtc_configuration=rtc_config  # Add this line
+    ui=custom_ui,  # Use our custom UI instead of ui_args
+    rtc_configuration=rtc_config
 )
 
 # Create FastAPI app and mount stream