Update ui/tabs.py

ui/tabs.py

@@ -228,6 +228,12 @@ def create_streaming_voice_tab(streaming_service: StreamingVoiceService):
                     type="numpy",
                     streaming=True
                 )
+                with gr.Accordion("📊 Performance Metrics", open=False):
+                    latency_display = gr.JSON(
+                        label="Latency Statistics",
+                        value={}
+                    )
+                    refresh_latency_btn = gr.Button("🔄 Refresh Metrics", size="sm")
                 
                 clear_btn = gr.Button("🗑️ Xóa hội thoại")
                 
@@ -315,7 +321,27 @@ def create_streaming_voice_tab(streaming_service: StreamingVoiceService):
                 state = f"VAD: Đã xử lý\nHistory: {len(streaming_service.conversation_history)} messages"
                 return result['transcription'], result['response'], result['tts_audio'], state
             return gr.skip(), gr.skip(), gr.skip(), gr.skip()
+        def refresh_latency():
+            """Làm mới latency metrics"""
+            stats = streaming_service.get_latency_stats()
+            return stats
         
+        def update_state_info():
+            """Cập nhật thông tin trạng thái với latency"""
+            state = streaming_service.get_conversation_state()
+            
+            # Format latency info
+            latency_info = state.get('latency_stats', {})
+            formatted_state = f"VAD: {'Đang chạy' if state['is_listening'] else 'Dừng'}\n"
+            formatted_state += f"Processing: {state['is_processing']}\n"
+            formatted_state += f"History: {state['history_length']} messages\n"
+            formatted_state += f"Queue: {state['queue_size']}\n"
+            
+            if latency_info.get('total', {}).get('count', 0) > 0:
+                total_avg = latency_info['total']['recent_avg']
+                formatted_state += f"Avg Latency: {total_avg:.2f}s"
+            
+            return formatted_state, latency_info
         # Event handlers đơn giản
         start_btn.click(start_vad, outputs=[vad_status, state_info])
         stop_btn.click(stop_vad, outputs=[vad_status, state_info])
@@ -330,6 +356,19 @@ def create_streaming_voice_tab(streaming_service: StreamingVoiceService):
             clear_chat,
             outputs=[transcription_box, response_box, audio_output, state_info]
         )
+
+        # Thêm event cho refresh latency
+        refresh_latency_btn.click(
+            refresh_latency,
+            outputs=[latency_display]
+        )
+        
+        # Tự động cập nhật latency mỗi 5 giây
+        streaming_tab.load(
+            update_state_info,
+            outputs=[state_info, latency_display],
+            every=5000
+        )
     
     return streaming_tab
 def create_image_tab(image_service: ImageService):