Update app.py

app.py

@@ -4,7 +4,6 @@ import os
 import json
 from gtts import gTTS  # Import gTTS for text-to-speech
 
-
 # OpenAI API setup
 openai.api_key = os.getenv("GROQ_API_KEY")
 openai.api_base = "https://api.groq.com/openai/v1"
@@ -56,11 +55,12 @@ def get_groq_response(message, history=[]):
 # Text-to-Speech function
 def text_to_speech(latest_response):
     try:
+        if not latest_response:  # If there's no response
+            return None
         tts = gTTS(latest_response, lang="en")  # Generate speech from text
         audio_file = "response_audio.mp3"
         tts.save(audio_file)
-        print(f"Audio file saved at: {audio_file}")  # Debugging print
-        return audio_file  # Ensure correct file path is returned
+        return audio_file
     except Exception as e:
         print(f"Error generating audio: {e}")
         return None
@@ -98,68 +98,36 @@ with gr.Blocks(css="""
         background-color: #FFFFFF;
         border-radius: 10px;
         padding: 20px;
-        max-height: 600px;  /* Increased height */
+        max-height: 600px;
         overflow-y: auto;
         box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.1);
-        scroll-behavior: smooth; /* Smooth scrolling */
+        scroll-behavior: smooth;
     }
 
-    .user-message {
-        background-color: #9ACBD0;
-        color: #FFF;
-        padding: 12px;
+    .user-message, .bot-message {
         border-radius: 8px;
         margin: 10px 0;
         max-width: 60%;
+        padding: 12px;
+    }
+
+    .user-message {
+        background-color: #9ACBD0;
+        color: #FFF;
         text-align: right;
         float: right;
         clear: both;
-        transition: transform 0.3s ease;
     }
 
     .bot-message {
         background-color: #48A6A7;
         color: #FFF;
-        padding: 12px;
-        border-radius: 8px;
-        margin: 10px 0;
-        max-width: 60%;
         text-align: left;
         float: left;
         clear: both;
-        transition: transform 0.3s ease;
-    }
-
-    .user-message:hover, .bot-message:hover {
-        transform: scale(1.05);
-        box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.1);
-    }
-
-    .gr-button {
-        background-color: #2973B2;
-        color: white;
-        padding: 10px 15px;
-        border-radius: 8px;
-        border: none;
-        transition: background-color 0.3s ease;
-    }
-
-    .gr-button:hover {
-        background-color: #21689D;
-    }
-
-    .gr-textbox input {
-        padding: 15px;
-        font-size: 16px;
-    }
-
-    .gr-markdown h1 {
-        color: #3A5A6E;
-        font-size: 28px;
-        text-align: center;
     }
 """) as demo:
-    gr.Markdown("""# Mom: We have ChatGPT at Home, \n ChatGPT at Home: Feel free to ask questions. After you're done, remember to clear the history for privacy. """)
+    gr.Markdown("# ChatGPT at Home\nAsk me anything and hear the response!")
 
     # Chatbot UI
     chatbot_ui = gr.Chatbot()
@@ -174,9 +142,9 @@ with gr.Blocks(css="""
     # Chat interaction
     user_input.submit(chatbot, inputs=[user_input, history_state], outputs=[chatbot_ui, history_state, user_input])
     hear_button.click(
-        lambda latest: text_to_speech(latest[-1][1] if latest else ""),  # Fetch latest bot response
-        inputs=[history_state],  # Pass the conversation history
-        outputs=audio_output # Output the file to the audio player
+        lambda latest: text_to_speech(latest[-1][1] if latest else "No response yet."),  # Handle empty state
+        inputs=[history_state],
+        outputs=audio_output
     )
     
     # Clear history button action