Update ui/tabs.py

ui/tabs.py

@@ -11,6 +11,8 @@ from services.openai_realtime_service import HybridStreamingService
 from services.stream_object_detection_service import  StreamObjectDetection
 from services.voice_coding_service import  VoiceCodingService
 from services.sambanova_voice_service import  SambanovaVoiceService
+from services.gemini_realtime_service import GeminiRealtimeService, GeminiStreamHandler
+
 from core.rag_system import EnhancedRAGSystem
 from core.tts_service import EnhancedTTSService
 from core.wikipedia_processor import WikipediaProcessor
@@ -29,6 +31,8 @@ def create_all_tabs(audio_service: AudioService, chat_service: ChatService,
         create_streaming_voice_tab(streaming_voice_service)
     with gr.Tab("OpenAI Realtime"):
         create_openai_realtime_tab(hybrid_service)
+    with gr.tab("GemeniAI RealTime"):
+        create_gemini_realtime_tab()
     with gr.Tab("SambonovaAI Realtime"):
         create_sambanova_voice_tab()
     with gr.Tab("Generation Code"):
@@ -52,6 +56,266 @@ def create_all_tabs(audio_service: AudioService, chat_service: ChatService,
         create_language_info_tab(rag_system.multilingual_manager)
     with gr.Tab("Stream Object Detection"):
         create_streaming_object_detection()
+def create_gemini_realtime_tab():
+    """Tạo tab cho Gemini Realtime API"""
+    
+    # Khởi tạo service
+    gemini_service = GeminiRealtimeService()
+    
+    with gr.Blocks() as gemini_tab:
+        gr.Markdown("""
+        # 🎯 Gemini Realtime API
+        **Streaming hội thoại thời gian thực với Google Gemini**
+        """)
+        
+        with gr.Row():
+            with gr.Column(scale=1):
+                # Connection controls
+                with gr.Group():
+                    gr.Markdown("### 🔗 Kết nối")
+                    
+                    api_key = gr.Textbox(
+                        label="Gemini API Key",
+                        type="password",
+                        placeholder="Nhập API key của bạn...",
+                        value=os.getenv("GEMINI_API_KEY", ""),
+                        info="Lấy từ https://aistudio.google.com/"
+                    )
+                    
+                    voice_select = gr.Dropdown(
+                        choices=["Puck", "Charon", "Kore", "Fenrir", "Aoede"],
+                        value="Puck",
+                        label="Giọng nói AI",
+                        info="Chọn giọng nói cho Gemini"
+                    )
+                    
+                    with gr.Row():
+                        connect_btn = gr.Button("🔗 Kết nối", variant="primary")
+                        disconnect_btn = gr.Button("🔌 Ngắt kết nối", variant="secondary")
+                
+                # Status panel
+                with gr.Group():
+                    gr.Markdown("### 📊 Trạng thái")
+                    
+                    status_display = gr.Textbox(
+                        label="Trạng thái kết nối",
+                        value="Chưa kết nối",
+                        interactive=False
+                    )
+                    
+                    connection_info = gr.Textbox(
+                        label="Thông tin",
+                        interactive=False,
+                        lines=2
+                    )
+            
+            with gr.Column(scale=2):
+                # Chat interface
+                with gr.Group():
+                    gr.Markdown("### 💬 Hội thoại")
+                    
+                    chatbot = gr.Chatbot(
+                        label="Gemini Chat",
+                        type="messages",
+                        height=400,
+                        show_copy_button=True
+                    )
+                
+                # Audio interface
+                with gr.Group():
+                    gr.Markdown("### 🎤 Audio Streaming")
+                    
+                    with gr.Row():
+                        start_audio_btn = gr.Button("🎙️ Bắt đầu nói", variant="primary")
+                        stop_audio_btn = gr.Button("⏹️ Dừng nói", variant="secondary")
+                    
+                    transcription_display = gr.Textbox(
+                        label="Bạn nói",
+                        interactive=False,
+                        lines=2,
+                        placeholder="Văn bản nhận diện sẽ hiển thị ở đây..."
+                    )
+                    
+                    audio_output = gr.Audio(
+                        label="Gemini trả lời",
+                        interactive=False,
+                        autoplay=True
+                    )
+        
+        # State management
+        connection_state = gr.State(value=False)
+        audio_stream_state = gr.State(value=False)
+        
+        # Event handlers for connection
+        def connect_gemini(api_key: str, voice_name: str):
+            """Kết nối đến Gemini Realtime API"""
+            try:
+                if not api_key:
+                    return False, "❌ Vui lòng nhập API Key", "Chưa kết nối"
+                
+                # Lưu API key
+                gemini_service.api_key = api_key
+                
+                return True, "✅ Đang kết nối...", f"Đang kết nối với giọng: {voice_name}"
+                
+            except Exception as e:
+                return False, f"❌ Lỗi kết nối: {str(e)}", "Lỗi kết nối"
+        
+        def disconnect_gemini():
+            """Ngắt kết nối Gemini"""
+            asyncio.create_task(gemini_service.close())
+            return False, "🔌 Đã ngắt kết nối", "Ngắt kết nối"
+        
+        def handle_gemini_callback(data: dict):
+            """Xử lý callback từ Gemini service"""
+            if data['type'] == 'status':
+                return data['message']
+            elif data['type'] == 'text':
+                return f"📝 Gemini: {data['content']}"
+            elif data['type'] == 'error':
+                return f"❌ Lỗi: {data['message']}"
+            return "Unknown event"
+        
+        def start_audio_stream():
+            """Bắt đầu stream audio"""
+            # Setup callback handler
+            gemini_service.callback = handle_gemini_callback
+            return True, "🎙️ Đang nghe..."
+        
+        def stop_audio_stream():
+            """Dừng stream audio"""
+            return False, "⏹️ Đã dừng"
+        
+        def update_chat(history, message: str, role: str = "user"):
+            """Cập nhật chat history"""
+            if not message:
+                return history
+                
+            if role == "user":
+                history.append([message, None])
+            else:
+                if history and history[-1][1] is None:
+                    history[-1][1] = message
+                else:
+                    history.append([None, message])
+            return history
+        
+        # Connection events
+        connect_btn.click(
+            connect_gemini,
+            inputs=[api_key, voice_select],
+            outputs=[connection_state, status_display, connection_info]
+        )
+        
+        disconnect_btn.click(
+            disconnect_gemini,
+            outputs=[connection_state, status_display, connection_info]
+        )
+        
+        # Audio events
+        start_audio_btn.click(
+            start_audio_stream,
+            outputs=[audio_stream_state, transcription_display]
+        )
+        
+        stop_audio_btn.click(
+            stop_audio_stream,
+            outputs=[audio_stream_state, transcription_display]
+        )
+        
+        # JavaScript for real-time updates
+        gemini_tab.load(
+            fn=None,
+            inputs=[],
+            outputs=[],
+            js="""
+            function setupGeminiRealtime() {
+                console.log('Setting up Gemini Realtime interface...');
+                
+                // Setup WebRTC or other real-time communication
+                const audioContext = new (window.AudioContext || window.webkitAudioContext)();
+                
+                // Event listeners for real-time updates
+                document.addEventListener('gemini_event', function(e) {
+                    const data = e.detail;
+                    handleGeminiEvent(data);
+                });
+                
+                function handleGeminiEvent(data) {
+                    switch(data.type) {
+                        case 'transcription':
+                            updateTranscription(data.text);
+                            break;
+                        case 'response':
+                            updateChatbot(data.text, 'assistant');
+                            break;
+                        case 'audio':
+                            playAudioData(data.audioData, data.sampleRate);
+                            break;
+                        case 'status':
+                            updateStatus(data.message);
+                            break;
+                    }
+                }
+                
+                function updateTranscription(text) {
+                    const elem = document.querySelector('[data-testid="transcription-display"] textarea');
+                    if (elem) elem.value = text;
+                }
+                
+                function updateStatus(message) {
+                    const elem = document.querySelector('[data-testid="status-display"] textarea');
+                    if (elem) elem.value = message;
+                }
+                
+                function playAudioData(audioData, sampleRate) {
+                    // Implementation for playing audio data
+                    console.log('Playing audio from Gemini...');
+                }
+            }
+            setupGeminiRealtime();
+            """
+        )
+        
+        # Additional examples and instructions
+        with gr.Accordion("📖 Hướng dẫn sử dụng", open=False):
+            gr.Markdown("""
+            ### Cách sử dụng Gemini Realtime:
+            
+            1. **Lấy API Key**:
+               - Truy cập [Google AI Studio](https://aistudio.google.com/)
+               - Tạo API key mới trong mục API Keys
+               - Sao chép và dán vào ô API Key
+            
+            2. **Kết nối**:
+               - Chọn giọng nói yêu thích
+               - Nhấn "Kết nối" để thiết lập session
+            
+            3. **Hội thoại**:
+               - Nhấn "Bắt đầu nói" để bắt đầu thu âm
+               - Gemini sẽ trả lời trong thời gian thực
+               - Nhấn "Dừng nói" để kết thúc
+            
+            ### Tính năng:
+            - 🎯 Hội thoại thời gian thực
+            - 🎙️ Nhận diện giọng nói
+            - 🔊 Phản hồi audio chất lượng cao
+            - ⚡ Độ trễ thấp
+            """)
+    
+    return gemini_tab
+
+# FastAPI routes cho Gemini (tùy chọn)
+def setup_gemini_routes(app):
+    """Thiết lập routes FastAPI cho Gemini"""
+    
+    @app.get("/gemini/status")
+    async def get_gemini_status():
+        return {"status": "active", "service": "gemini_realtime"}
+    
+    @app.post("/gemini/connect")
+    async def connect_gemini():
+        return {"message": "Gemini connection endpoint"}
 def create_sambanova_voice_tab():
     """Tạo tab Sambanova AI với Voice Input/Output"""