Update ui/tabs.py

ui/tabs.py

@@ -416,67 +416,60 @@ def create_tts_tab(tts_service: EnhancedTTSService):
             outputs=[tts_output_audio]
         )
 def create_streaming_voice_tab(streaming_service: StreamingVoiceService):
-    """Tạo tab streaming voice với VAD"""
-    
-    # Create components
-    (start_btn, stop_btn, status_display, state_display,
-    transcription, ai_response, tts_output, streaming_state,
-    conversation_history, vad_visualizer) = create_streaming_voice_components()
-    
-    def start_streaming():
-        """Bắt đầu streaming với VAD"""
-        def callback_handler(result):
-            """Xử lý kết quả real-time"""
-            # Cập nhật UI với kết quả mới
-            # Note: Trong thực tế, cần sử dụng gr.update() và queue
-            print(f"🎯 Kết quả: {result['transcription']}")
-            print(f"🤖 Phản hồi: {result['response']}")
-        
-        success = streaming_service.start_listening(callback_handler)
-        status = "✅ Đang lắng nghe..." if success else "❌ Lỗi khởi động"
-        
-        # Start background thread for UI updates
-        if success:
-            threading.Thread(target=update_ui_loop, daemon=True).start()
-        
-        return status, streaming_service.get_conversation_state()
+    """Tạo tab streaming voice sử dụng Gradio microphone"""
+    
+    # Create components - SỬA TÊN BIẾN CHO ĐÚNG
+    components = create_streaming_voice_components()
     
-    def stop_streaming():
-        """Dừng streaming"""
-        streaming_service.stop_listening()
-        return "🛑 Đã dừng lắng nghe", streaming_service.get_conversation_state()
+    # Unpack components - CHỈ CÓ 7 GIÁ TRỊ
+    (microphone, clear_btn, status_display, state_display,
+     transcription, ai_response, tts_output) = components
     
-    def update_ui_loop():
-        """Vòng lặp cập nhật UI real-time"""
-        while streaming_service.is_listening:
-            # Cập nhật trạng thái
+    def process_audio_stream(audio_data):
+        """Xử lý audio stream từ microphone"""
+        if audio_data is None:
+            return "❌ Không có âm thanh", "Vui lòng nói lại", None, "Đang chờ...", {}
+        
+        try:
+            print("🎯 Đang xử lý audio stream...")
+            
+            # Xử lý audio
+            result = streaming_service.process_streaming_audio(audio_data)
+            
+            # Cập nhật state
             state = streaming_service.get_conversation_state()
+            status = f"✅ Đã xử lý - {len(result['transcription'])} ký tự"
             
-            # Ở đây cần sử dụng gr.update() và queue để cập nhật UI
-            # Đây là phiên bản đơn giản, trong thực tế cần tích hợp với Gradio Queue
+            return result['transcription'], result['response'], result['tts_audio'], status, state
             
-            time.sleep(0.1)
+        except Exception as e:
+            error_msg = f"❌ Lỗi xử lý: {str(e)}"
+            print(f"Lỗi: {traceback.format_exc()}")
+            return error_msg, "Xin lỗi, có lỗi xảy ra", None, "❌ Lỗi", {}
+    
+    def clear_conversation():
+        """Xóa hội thoại"""
+        streaming_service.clear_conversation()
+        state = streaming_service.get_conversation_state()
+        return "", "", None, "🗑️ Đã xóa hội thoại", state
     
     # Event handlers
-    start_btn.click(
-        start_streaming,
-        outputs=[status_display, state_display]
+    microphone.stream(
+        process_audio_stream,
+        inputs=[microphone],
+        outputs=[transcription, ai_response, tts_output, status_display, state_display]
     )
     
-    stop_btn.click(
-        stop_streaming,
-        outputs=[status_display, state_display]
+    clear_btn.click(
+        clear_conversation,
+        outputs=[transcription, ai_response, tts_output, status_display, state_display]
     )
     
-    # Demo real-time updates (simplified)
-    def demo_update():
-        """Demo cập nhật real-time"""
-        if streaming_service.is_listening:
-            state = streaming_service.get_conversation_state()
-            return (
-                state['current_transcription'] or "Đang lắng nghe...",
-                "Phản hồi sẽ xuất hiện ở đây...",
-                state
-            )
-        return "Chưa lắng nghe", "Chưa có phản hồi", {}
+    # Khởi tạo giá trị ban đầu
+    def initialize_tab():
+        state = streaming_service.get_conversation_state()
+        return "Sẵn sàng - nhấn nút microphone để nói", state
+    
+    # Gọi hàm khởi tạo
+    initialize_tab()