added translation code before we reverted commit cuz of api key public

app.py

@@ -5,8 +5,6 @@ from groq import Groq
 api_key = os.getenv("GROQ_API_KEY")
 client = Groq(api_key=api_key)
 
-# TODO for solin: add new translations
-
 def chat_with_bot_stream(user_input, conversation_history):
     if conversation_history is None:
         conversation_history = []
@@ -35,6 +33,9 @@ def chat_with_bot_stream(user_input, conversation_history):
                 "If you do not recognize an artist/genre/album/song name, try to clarify further, and if you still don't recognize it let the user know that you're not familiar with said artist/genre/album/song.\n\n"
                 "Encourage users to continue the conversation. If you suggest music, offer to refine your recommendations further, "
                 "such as recommending more similar artists, making a mini playlist, or adjusting based on user feedback.\n\n"
+                "If you're unable to provide a recommendation, let the user know and suggest they try rephrasing their question.\n\n"
+                "Remember to always be polite, engaging, and helpful. Make sure to keep the conversation flowing and the user engaged."
+                "Make sure to match the user's tone and energy, and always be respectful and professional."
             )
         })
 
@@ -66,6 +67,7 @@ translations = {
          "header_description": "Your own personal music discovery assistant!",
          "user_input_placeholder": "Enter your music-related questions here!",
          "send_button": "↗️ Send",
+         "clear_button": "🗑️ Clear",
          "settings_tab_item": "⚙️ Settings",
          "settings_markdown": "### Settings",
          "apply_settings_button": "Apply Settings",
@@ -74,12 +76,22 @@ translations = {
          "theme_choices": ["Dark", "Light"],
          "font_size_label": "🗛 Font Size",
          "font_size_choices": ["Small", "Medium", "Large"],
-         "language_choices": ["English", "Español", "Français"]
+         "language_choices": ["English", "Español", "Français"],
+         "inspiration_heading": "Need inspiration? Try asking about one of these topics:",
+         "example_questions": [
+             "🎵 What's some good background music for studying?",
+             "🔥 Which indie artists are blowing up right now?",
+             "🎷 Can you recommend iconic jazz albums?",
+             "🎶 I need a workout playlist—any suggestions?",
+             "💿 What classic rock albums should I listen to?",
+             "🎧 Who’s an underrated artist I should check out?"
+         ]
     },
     "Spanish": {
          "header_description": "¡Tu asistente personal para descubrir música!",
          "user_input_placeholder": "¡Introduce tus preguntas relacionadas con la música!",
          "send_button": "↗️ Enviar",
+         "clear_button": "🗑️ Limpiar",
          "settings_tab_item": "⚙️ Configuración",
          "settings_markdown": "### Configuración",
          "apply_settings_button": "Aplicar Configuración",
@@ -88,12 +100,22 @@ translations = {
          "theme_choices": ["Oscuro", "Claro"],
          "font_size_label": "🗛 Tamaño de Fuente",
          "font_size_choices": ["Pequeño", "Mediano", "Grande"],
-         "language_choices": ["English", "Español", "Français"]
+         "language_choices": ["English", "Español", "Français"],
+         "inspiration_heading": "¿Necesitas inspiración? Prueba preguntar sobre uno de estos temas:",
+         "example_questions": [
+             "🎵 ¿Qué buena música ambiental recomiendas para estudiar?",
+             "🔥 ¿Qué artistas indie están en auge ahora mismo?",
+             "🎷 ¿Puedes recomendar álbumes icónicos de jazz?",
+             "🎶 Necesito una lista de reproducción para entrenar, ¿alguna sugerencia?",
+             "💿 ¿Qué álbumes de rock clásico debería escuchar?",
+             "🎧 ¿Qué artista poco reconocido debería escuchar?"
+         ]
     },
     "French": {
          "header_description": "Votre assistant personnel pour découvrir de la musique !",
          "user_input_placeholder": "Entrez vos questions sur la musique ici !",
          "send_button": "↗️ Envoyer",
+         "clear_button": "🗑️ Effacer",
          "settings_tab_item": "⚙️ Paramètres",
          "settings_markdown": "### Paramètres",
          "apply_settings_button": "Appliquer les paramètres",
@@ -102,7 +124,16 @@ translations = {
          "theme_choices": ["Sombre", "Clair"],
          "font_size_label": "🗛 Taille de police",
          "font_size_choices": ["Petit", "Moyen", "Grand"],
-         "language_choices": ["English", "Español", "Français"]
+         "language_choices": ["English", "Español", "Français"],
+         "inspiration_heading": "Besoin d'inspiration ? Essayez de poser l'une de ces questions :",
+         "example_questions": [
+             "🎵 Quelle bonne musique d'ambiance pour étudier ?",
+             "🔥 Quels artistes indie font sensation en ce moment ?",
+             "🎷 Peux-tu recommander des albums de jazz emblématiques ?",
+             "�� J'ai besoin d'une playlist pour m'entraîner, des suggestions ?",
+             "💿 Quels albums de rock classique devrais-je écouter ?",
+             "🎧 Quel artiste sous-estimé devrais-je découvrir ?"
+         ]
     }
 }
 
@@ -144,7 +175,7 @@ def update_all_settings(theme, font_size, language):
     elif target_lang == "French":
         font_for_ui = english_to_french_font.get(font_size, font_size) if font_size in english_to_french_font else font_size if font_size in french_to_english_font else "Moyen"
     else:
-        font_for_ui = spanish_to_english_font.get(font_size, font_size) if font_size in spanish_to_english_font else font_size if theme in english_to_spanish_font else "Medium"
+        font_for_ui = spanish_to_english_font.get(font_size, font_size) if font_size in spanish_to_english_font else font_size if font_size in english_to_spanish_font else "Medium"
     
     if theme in ["Dark", "Light"]:
         theme_for_style = theme
@@ -166,14 +197,17 @@ def update_all_settings(theme, font_size, language):
     
     dynamic_style = update_styles(theme_for_style, font_for_style)
     
-    #Languages
+    # Languages
     if target_lang == "English":
         language_value = "English"
     elif target_lang == "Spanish":
         language_value = "Español"
     elif target_lang == "French":
         language_value = "Français"
+        
     header_html = f'<p id="header_description">{t["header_description"]}</p>'
+    clear_button_text = t["clear_button"]
+    inspiration_html = f'<h3 style="text-align: center;">{t["inspiration_heading"]}</h3>'
     
     return (
         dynamic_style,
@@ -184,7 +218,10 @@ def update_all_settings(theme, font_size, language):
         gr.update(value=t["apply_settings_button"]),
         gr.update(label=t["theme_label"], choices=t["theme_choices"], value=theme_for_ui),
         gr.update(label=t["font_size_label"], choices=t["font_size_choices"], value=font_for_ui),
-        gr.update(label=t["select_language_label"], choices=t["language_choices"], value=language_value)
+        gr.update(label=t["select_language_label"], choices=t["language_choices"], value=language_value),
+        gr.update(value=clear_button_text),
+        gr.update(value=inspiration_html),
+        gr.update(choices=t["example_questions"])
     )
 
 
@@ -336,7 +373,7 @@ def update_styles(theme, font_size):
         font-size: {fsize} !important;
         border: none;
         border-radius: 6px;
-        width: 20%;
+        width: 13%;
         align-self: center;
         font-family: 'Inter', sans-serif;
         transition: background-color 0.2s ease-in-out, transform 0.1s ease-in-out;
@@ -433,12 +470,12 @@ def update_styles(theme, font_size):
     }}
 
     #example_questions {{
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    flex-wrap: wrap;
-    gap: 10px;
-    text-align: center;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        flex-wrap: wrap;
+        gap: 10px;
+        text-align: center;
     }}
 
     #example_questions .wrap.svelte-1kzox3m {{
@@ -463,7 +500,7 @@ def load_chat_history(chat_history):
 # Gradio stuff
 with gr.Blocks(css=None) as demo:
     dynamic_styles = gr.HTML(value=update_styles("Dark", "Medium"))
-    
+
     with gr.Tabs():
         with gr.TabItem("💬 Chatbot"):
             gr.HTML('<div id="header_section"></div>')
@@ -472,7 +509,7 @@ with gr.Blocks(css=None) as demo:
             
             with gr.Row():
                 user_input = gr.Textbox(
-                    show_label=False, 
+                    show_label=False,
                     lines=1,
                     placeholder=translations["English"]["user_input_placeholder"],
                     interactive=True,
@@ -484,23 +521,22 @@ with gr.Blocks(css=None) as demo:
                     elem_id="send_button",
                     scale=2
                 )
-                clear_button = gr.Button("🗑️ Clear", elem_id="send_button", scale=2)
+                clear_button = gr.Button(
+                    value=translations["English"]["clear_button"],
+                    elem_id="send_button",
+                    scale=2
+                )
 
             conversation_state = gr.BrowserState([])
             demo.load(load_chat_history, inputs=[conversation_state], outputs=[chatbot])
             
             gr.HTML("<br>")
-            gr.HTML("<h3 style='text-align: center;'>Need inspiration? Try asking about one of these topics:</h3>")
-
+            # Create a new HTML element for the inspiration heading using translations
+            inspiration_heading = gr.HTML('<h3 style="text-align: center;">' + translations["English"]["inspiration_heading"] + '</h3>')
+            gr.HTML("<br>")
+            
             example_questions = gr.Radio(
-                choices=[
-                    "🎵 What's some good background music for studying?",
-                    "🔥 Which indie artists are blowing up right now?",
-                    "🎷 Can you recommend iconic jazz albums?",
-                    "🎶 I need a workout playlist—any suggestions?",
-                    "💿 What classic rock albums should I listen to?",
-                    "🎧 Who’s an underrated artist I should check out?"
-                ],
+                choices=translations["English"]["example_questions"],
                 label="",
                 interactive=True,
                 elem_id="example_questions"
@@ -537,7 +573,7 @@ with gr.Blocks(css=None) as demo:
                 inputs=None,
                 outputs=[chatbot, conversation_state]
             )
-        
+
         # SETTINGS PAGE
         with gr.TabItem(translations["English"]["settings_tab_item"]):
             with gr.Column(elem_id="settings_box"):
@@ -573,7 +609,10 @@ with gr.Blocks(css=None) as demo:
                         apply_button,
                         theme_radio,
                         font_radio,
-                        language_radio
+                        language_radio,
+                        clear_button,
+                        inspiration_heading,
+                        example_questions
                     ]
                 )