Update app.py

app.py

@@ -1,9 +1,7 @@
 import gradio as gr
 from huggingface_hub import InferenceClient
 
-"""
-For more information on `huggingface_hub` Inference API support, please check the docs: https://huggingface.co/docs/huggingface_hub/v0.22.2/en/guides/inference
-"""
+# Initialize Hugging Face Inference Client
 client = InferenceClient(model="Futuresony/future_ai_12_10_2024.gguf")
 
 
@@ -26,7 +24,6 @@ def respond(
     messages.append({"role": "user", "content": message})
 
     response = ""
-
     for message in client.chat_completion(
         messages,
         max_tokens=max_tokens,
@@ -35,12 +32,11 @@ def respond(
         top_p=top_p,
     ):
         token = message.choices[0].delta.content
-
         response += token
         yield response
 
 
-# JavaScript for speech recognition
+# JavaScript for speech-to-text functionality
 speech_recognition_js = """
 <script>
     let micButton = document.getElementById('mic_button');
@@ -58,11 +54,11 @@ speech_recognition_js = """
         };
 
         recognition.onspeechend = function() {
-            recognition.stop(); // Stop listening after 2 seconds of silence
+            recognition.stop();
         };
 
         micButton.onclick = function() {
-            recognition.start(); // Start listening when mic button is clicked
+            recognition.start();
         };
     } else {
         micButton.onclick = function() {
@@ -72,7 +68,7 @@ speech_recognition_js = """
 </script>
 """
 
-# Gradio Chat Interface
+# Chat Interface with Additional Inputs
 demo = gr.ChatInterface(
     fn=respond,
     additional_inputs=[
@@ -89,7 +85,7 @@ demo = gr.ChatInterface(
     ],
 )
 
-# Add mic button to the interface
+# Add Mic Button to the Interface
 with gr.Blocks() as ui:
     with gr.Row():
         gr.HTML(
@@ -111,12 +107,12 @@ with gr.Blocks() as ui:
             </style>
             <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined">
             <div style="display: flex; align-items: center;">
-                <button id="mic_button">🎤</button>
+                <button id="mic_button" title="Click to speak">🎤</button>
                 <input id="user_input" type="text" placeholder="Type your message here..." />
             </div>
             """
         )
-        gr.HTML(speech_recognition_js)  # Inject JavaScript for mic button
+        gr.HTML(speech_recognition_js)  # Include JS for mic button functionality
 
     demo.launch()