Update app.py

app.py

@@ -40,17 +40,20 @@ def voice_assistant(audio_file):
 with gr.Blocks() as demo:
     gr.HTML("<h1 style='text-align: center; color: #333;'>🎤 Voice Assistant</h1>")
     
-    # Voice Assistant Section
     with gr.Row():
-        mic_button = gr.Image(
-            value="/mnt/data/Screenshot 2024-12-28 101858.jpg", 
-            interactive=True, 
-            label="Click to Speak"
-        )
-        mic_input = gr.Audio(type="filepath", label="Record Your Query", visible=False)
-        mic_response = gr.Audio(type="filepath", label="Response", visible=False)
+        # Microphone icon to prompt users to speak
+        gr.HTML(f"""
+            <div style="text-align: center;">
+                <img src="/mnt/data/Screenshot 2024-12-28 101858.jpg" alt="Microphone" 
+                     style="cursor: pointer; width: 50px; height: 50px;" 
+                     onclick="document.getElementById('audio-input').click()">
+                <p>Click the microphone to speak</p>
+            </div>
+        """)
+        mic_input = gr.Audio(id="audio-input", type="filepath", label="Record Your Query")
+        response_output = gr.Audio(type="filepath", label="Response")
 
-    # Link the microphone button to the function
-    mic_button.click(voice_assistant, inputs=[mic_input], outputs=[mic_response])
+    # Link the audio input to the voice assistant function
+    mic_input.change(voice_assistant, inputs=[mic_input], outputs=[response_output])
 
 demo.launch()