Update app.py

app.py

@@ -1,67 +1,29 @@
 import streamlit as st
-from streamlit_webrtc import webrtc_streamer, WebRtcMode, ClientSettings
 import numpy as np
 import io
 import wave
 import requests
 from audio_to_text import audio_to_text
-import streamlit.components.v1 as components
+from streamlit_mic_recorder import mic_recorder
 
 # Initialize Streamlit app layout
 st.title("Microphone Input in Streamlit")
 
-# Load the custom component
-audio_recorder_html = """
-<script>
-const recordButton = document.getElementById("recordButton");
-const stopButton = document.getElementById("stopButton");
-const audioChunks = [];
-
-let mediaRecorder;
-
-navigator.mediaDevices.getUserMedia({ audio: true })
-.then(function(stream) {
-  mediaRecorder = new MediaRecorder(stream);
-
-  recordButton.onclick = function() {
-    mediaRecorder.start();
-    console.log("Recording started...");
-  };
-
-  stopButton.onclick = function() {
-    mediaRecorder.stop();
-    console.log("Recording stopped...");
-  };
-
-  mediaRecorder.ondataavailable = function(e) {
-    audioChunks.push(e.data);
-  };
-
-  mediaRecorder.onstop = function(e) {
-    const audioBlob = new Blob(audioChunks, { type: "audio/wav" });
-    const reader = new FileReader();
-    reader.readAsDataURL(audioBlob);
-    reader.onloadend = function() {
-      const base64data = reader.result.split(',')[1];
-      Streamlit.setComponentValue(base64data);
-    };
-  };
-});
-</script>
-<button id="recordButton">Start Recording</button>
-<button id="stopButton">Stop Recording</button>
-"""
-
-# Embed the JavaScript and HTML in Streamlit
-components.html(audio_recorder_html, height=300)
-
-# Retrieve the audio data from the component (if available)
-audio_data = st.query_params().get("value")
-
-
-def audio_callback(frame):
+# Record audio
+audio = mic_recorder(
+    start_prompt="Start recording",
+    stop_prompt="Stop recording",
+    just_once=False,
+    use_container_width=True
+    )
+
+    # Check if audio is recorded
+if audio:
+    st.audio(audio['bytes'], format='audio/wav')
+    byte_data=audio['bytes']
+    
     # Get raw audio data from the frame
-    audio_data = frame.to_ndarray().astype(np.int16)
+    audio_data = byte_data.to_ndarray().astype(np.int16)
 
     # Convert audio to text
     transcription = audio_to_text(audio_data)
@@ -82,22 +44,4 @@ def audio_callback(frame):
         st.write("Assistant:", response.json())
     else:
         st.write("Error:", response.status_code, response.text)
-            
-
-webrtc_ctx = webrtc_streamer(
-    key="audio-only",
-    mode=WebRtcMode.SENDRECV,
-    rtc_configuration={"iceServers": [{"urls": ["stun:stun1.l.google.com:19302"]}]},
-    media_stream_constraints={
-        "audio": True,
-        "video": False
-    },
-    audio_frame_callback=audio_callback
-)
-
-# Placeholder for capturing audio
-if webrtc_ctx.state.playing:
-    st.write("Microphone is active. Speak into the microphone...")
-else:
-    st.write("Click to start microphone input.")