|
|
import gradio as gr |
|
|
import os |
|
|
from groq import Groq |
|
|
|
|
|
api_key = os.getenv("GROQ_API_KEY") |
|
|
client = Groq(api_key=api_key) |
|
|
|
|
|
def chat_with_bot_stream(user_input, conversation_history): |
|
|
if conversation_history is None: |
|
|
conversation_history = [] |
|
|
|
|
|
conversation_history.append({"role": "user", "content": user_input}) |
|
|
|
|
|
|
|
|
if len(conversation_history) == 1: |
|
|
conversation_history.insert(0, { |
|
|
"role": "system", |
|
|
"content": ( |
|
|
"You are a music and genre recommendation bot designed to help users discover new music " |
|
|
"based on their preferences, mood, or activity.\n\n" |
|
|
"Your responses should be engaging, personalized, and insightful. You can recommend:\n\n" |
|
|
"- Specific songs, albums, or artists\n" |
|
|
"- Genres based on mood, activity, or past preferences\n" |
|
|
"- Hidden gems and deep cuts for music enthusiasts\n" |
|
|
"- Trending or classic hits based on user taste\n\n" |
|
|
"Be conversational, suggest multiple options when possible, and encourage users to explore new sounds. " |
|
|
"If requested, provide brief descriptions of artists or genres, and explain why a recommendation might suit the user.\n\n" |
|
|
"If asked about visibility on the website, such as font sizing and themes (dark or light mode ONLY), " |
|
|
"direct them to the settings tab at the top of the chatbot.\n\n" |
|
|
"If asked about the languages you speak, you can say that you speak English, Spanish, and French ONLY. " |
|
|
"Direct the user to the settings tab to change the language.\n\n" |
|
|
"Limit your responses to music-related inquiries only. Limit your responses to 15 lines or less.\n\n" |
|
|
"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." |
|
|
"If a user sends lots of prompts back-to-back, politely ask them to slow down and clarify what they would like" |
|
|
) |
|
|
}) |
|
|
|
|
|
completion = client.chat.completions.create( |
|
|
model="llama-3.3-70b-versatile", |
|
|
messages=conversation_history, |
|
|
temperature=0.95, |
|
|
max_tokens=1024, |
|
|
top_p=0.9, |
|
|
stream=True, |
|
|
) |
|
|
|
|
|
response_content = "" |
|
|
for chunk in completion: |
|
|
response_content += chunk.choices[0].delta.content or "" |
|
|
|
|
|
conversation_history.append({"role": "assistant", "content": response_content}) |
|
|
|
|
|
return [ |
|
|
(msg["content"] if msg["role"] == "user" else None, |
|
|
msg["content"] if msg["role"] == "assistant" else None) |
|
|
for msg in conversation_history |
|
|
], conversation_history |
|
|
|
|
|
|
|
|
|
|
|
translations = { |
|
|
"English": { |
|
|
"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", |
|
|
"select_language_label": "🌐 Language", |
|
|
"theme_label": "🌗 Theme", |
|
|
"theme_choices": ["Dark", "Light"], |
|
|
"font_size_label": "🗛 Font Size", |
|
|
"font_size_choices": ["Small", "Medium", "Large"], |
|
|
"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", |
|
|
"select_language_label": "🌐 Idioma", |
|
|
"theme_label": "🌗 Tema", |
|
|
"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"], |
|
|
"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", |
|
|
"select_language_label": "🌐 Langue", |
|
|
"theme_label": "🌗 Thème", |
|
|
"theme_choices": ["Sombre", "Clair"], |
|
|
"font_size_label": "🗛 Taille de police", |
|
|
"font_size_choices": ["Petit", "Moyen", "Grand"], |
|
|
"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 ?" |
|
|
] |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
english_to_spanish_theme = {"Dark": "Oscuro", "Light": "Claro"} |
|
|
spanish_to_english_theme = {"Oscuro": "Dark", "Claro": "Light"} |
|
|
english_to_french_theme = {"Dark": "Sombre", "Light": "Clair"} |
|
|
french_to_english_theme = {"Sombre": "Dark", "Clair": "Light"} |
|
|
|
|
|
english_to_spanish_font = {"Small": "Pequeño", "Medium": "Mediano", "Large": "Grande"} |
|
|
spanish_to_english_font = {"Pequeño": "Small", "Mediano": "Medium", "Grande": "Large"} |
|
|
english_to_french_font = {"Small": "Petit", "Medium": "Moyen", "Large": "Grand"} |
|
|
french_to_english_font = {"Petit": "Small", "Moyen": "Medium", "Grand": "Large"} |
|
|
|
|
|
|
|
|
def normalize_language(lang): |
|
|
if lang in ["English", "Inglés", "Anglais"]: |
|
|
return "English" |
|
|
elif lang in ["Spanish", "Español", "Espagnol"]: |
|
|
return "Spanish" |
|
|
elif lang in ["French", "Français"]: |
|
|
return "French" |
|
|
else: |
|
|
return "English" |
|
|
|
|
|
def update_all_settings(theme, font_size, language): |
|
|
target_lang = normalize_language(language) |
|
|
t = translations[target_lang] |
|
|
|
|
|
if target_lang == "Spanish": |
|
|
theme_for_ui = english_to_spanish_theme.get(theme, theme) if theme in english_to_spanish_theme else theme if theme in spanish_to_english_theme else "Oscuro" |
|
|
elif target_lang == "French": |
|
|
theme_for_ui = english_to_french_theme.get(theme, theme) if theme in english_to_french_theme else theme if theme in french_to_english_theme else "Sombre" |
|
|
else: |
|
|
theme_for_ui = spanish_to_english_theme.get(theme, theme) if theme in spanish_to_english_theme else theme if theme in english_to_spanish_theme else "Dark" |
|
|
|
|
|
if target_lang == "Spanish": |
|
|
font_for_ui = english_to_spanish_font.get(font_size, font_size) if font_size in english_to_spanish_font else font_size if font_size in spanish_to_english_font else "Mediano" |
|
|
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 font_size in english_to_spanish_font else "Medium" |
|
|
|
|
|
if theme in ["Dark", "Light"]: |
|
|
theme_for_style = theme |
|
|
elif theme in spanish_to_english_theme: |
|
|
theme_for_style = spanish_to_english_theme.get(theme, "Dark") |
|
|
elif theme in french_to_english_theme: |
|
|
theme_for_style = french_to_english_theme.get(theme, "Dark") |
|
|
else: |
|
|
theme_for_style = "Dark" |
|
|
|
|
|
if font_size in ["Small", "Medium", "Large"]: |
|
|
font_for_style = font_size |
|
|
elif font_size in spanish_to_english_font: |
|
|
font_for_style = spanish_to_english_font.get(font_size, "Medium") |
|
|
elif font_size in french_to_english_font: |
|
|
font_for_style = french_to_english_font.get(font_size, "Medium") |
|
|
else: |
|
|
font_for_style = "Medium" |
|
|
|
|
|
dynamic_style = update_styles(theme_for_style, font_for_style) |
|
|
|
|
|
|
|
|
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, |
|
|
gr.update(value=header_html), |
|
|
gr.update(placeholder=t["user_input_placeholder"]), |
|
|
gr.update(value=t["send_button"]), |
|
|
gr.update(value=t["settings_markdown"]), |
|
|
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(value=clear_button_text), |
|
|
gr.update(value=inspiration_html), |
|
|
gr.update(choices=t["example_questions"]) |
|
|
) |
|
|
|
|
|
|
|
|
def update_styles(theme, font_size): |
|
|
if theme == "Dark": |
|
|
bg = "#18181B" |
|
|
text_color = "#EAEAEA" |
|
|
button_bg = "#56246B" |
|
|
radio_bg = "#444444" |
|
|
border_color = "#444444" |
|
|
placeholder_color = "#e8e8e8" |
|
|
button_text_color = "#ffffff" |
|
|
chatbot_bg = "#212125" |
|
|
settings_box_bg = chatbot_bg |
|
|
chatbot_text_color = "#ffffff" |
|
|
purple="#56246B" |
|
|
light_purple="#795699" |
|
|
settings_heading_color = text_color |
|
|
user_msg_bg_color="#333333" |
|
|
bot_msg_bg_color="#1F1F1F" |
|
|
msg_text_color="#FFFFFF" |
|
|
else: |
|
|
bg = "#F2F2F2" |
|
|
text_color = "#1C1C1C" |
|
|
button_bg = "#56246B" |
|
|
radio_bg = "#CCCCCC" |
|
|
border_color = "#B0B0B0" |
|
|
placeholder_color = "#EAEAEA" |
|
|
button_text_color = "#ffffff" |
|
|
chatbot_bg = "#fcfcfc" |
|
|
settings_box_bg = chatbot_bg |
|
|
chatbot_text_color = "#000000" |
|
|
purple="#56246B" |
|
|
light_purple="#795699" |
|
|
settings_heading_color = "#333333" |
|
|
user_msg_bg_color="#e0e0e0" |
|
|
bot_msg_bg_color="#cccccc" |
|
|
msg_text_color="#000000" |
|
|
|
|
|
if font_size == "Small": |
|
|
fsize = "0.8rem" |
|
|
tab_padding = "4px 8px" |
|
|
elif font_size == "Medium": |
|
|
fsize = "1.2rem" |
|
|
tab_padding = "6px 12px" |
|
|
elif font_size == "Large": |
|
|
fsize = "1.8rem" |
|
|
tab_padding = "8px 16px" |
|
|
else: |
|
|
fsize = "1rem" |
|
|
tab_padding = "5px 10px" |
|
|
|
|
|
style = f""" |
|
|
<style id="dynamic_styles"> |
|
|
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;600&display=swap'); |
|
|
|
|
|
body, .gradio-container {{ |
|
|
background-color: {bg} !important; |
|
|
color: {text_color} !important; |
|
|
font-size: {fsize} !important; |
|
|
font-family: 'Inter', sans-serif; |
|
|
margin: 0; |
|
|
padding: 0; |
|
|
}} |
|
|
|
|
|
#header_section {{ |
|
|
width: 400px; |
|
|
height: 100px; |
|
|
background: url("https://huggingface.co/spaces/MusifyLTD/Musify/resolve/main/logo.png") |
|
|
no-repeat center center; |
|
|
background-size: contain; |
|
|
margin: 0px auto; |
|
|
margin-bottom: -10px; |
|
|
}} |
|
|
|
|
|
#header_description {{ |
|
|
text-align: center; |
|
|
color: {text_color} !important; |
|
|
font-size: {fsize} !important; |
|
|
margin-top: -10px; |
|
|
margin-bottom: 10px; |
|
|
}} |
|
|
|
|
|
#chatbot {{ |
|
|
background-color: {chatbot_bg} !important; |
|
|
color: {chatbot_text_color} !important; |
|
|
font-size: {fsize} !important; |
|
|
border: {border_color} solid 0.5px; |
|
|
}} |
|
|
|
|
|
fieldset {{ |
|
|
background-color: {settings_box_bg} !important; |
|
|
color: {text_color} !important; |
|
|
border: none; |
|
|
margin: 0; |
|
|
}} |
|
|
|
|
|
div[role="log"] {{ |
|
|
border: none; |
|
|
background-color: {chatbot_bg} !important; |
|
|
color: {chatbot_text_color} !important; |
|
|
font-size: {fsize} !important; |
|
|
}} |
|
|
|
|
|
#user_input {{ |
|
|
background-color: {purple} !important; |
|
|
border: none; |
|
|
height: 65px; |
|
|
}} |
|
|
|
|
|
#user_input textarea {{ |
|
|
background-color: {light_purple} !important; |
|
|
color: {button_text_color} !important; |
|
|
font-size: {fsize} !important; |
|
|
border: 0.5px solid {light_purple} !important; |
|
|
padding: 10px; |
|
|
}} |
|
|
|
|
|
#user_input textarea::placeholder {{ |
|
|
background-color: {light_purple} !important; |
|
|
color: {placeholder_color} !important; |
|
|
font-size: {fsize} !important; |
|
|
opacity: 0.73; |
|
|
}} |
|
|
|
|
|
#send_button {{ |
|
|
background-color: {button_bg} !important; |
|
|
color: {button_text_color} !important; |
|
|
font-size: {fsize} !important; |
|
|
border: none; |
|
|
border-radius: 6px; |
|
|
margin-left: 1px; |
|
|
font-family: 'Inter', sans-serif; |
|
|
height: 65px; |
|
|
display: flex; |
|
|
align-items: center; |
|
|
justify-content: center; |
|
|
padding: 0 10px; |
|
|
transition: background-color 0.2s ease-in-out, transform 0.1s ease-in-out; |
|
|
}} |
|
|
|
|
|
#send_button:hover {{ |
|
|
background-color: {light_purple} !important; |
|
|
}} |
|
|
|
|
|
#apply_button {{ |
|
|
background-color: {button_bg} !important; |
|
|
color: {button_text_color} !important; |
|
|
font-size: {fsize} !important; |
|
|
border: none; |
|
|
border-radius: 6px; |
|
|
width: 13%; |
|
|
align-self: center; |
|
|
font-family: 'Inter', sans-serif; |
|
|
transition: background-color 0.2s ease-in-out, transform 0.1s ease-in-out; |
|
|
}} |
|
|
|
|
|
#apply_button:hover {{ |
|
|
background-color: {light_purple} !important; |
|
|
}} |
|
|
|
|
|
#settings_box {{ |
|
|
background-color: {settings_box_bg} !important; |
|
|
color: {text_color} !important; |
|
|
font-size: {fsize} !important; |
|
|
border: {border_color} solid 0.5px; |
|
|
border-radius: 6px; |
|
|
padding: 10px; |
|
|
margin: 10px; |
|
|
}} |
|
|
|
|
|
h3 {{ |
|
|
color: {text_color} !important; |
|
|
font-weight: 600; |
|
|
text-align: center; |
|
|
display: flex; |
|
|
justify-content: center; |
|
|
align-items: center; |
|
|
height: 100%; |
|
|
font-size: {fsize} !important; |
|
|
}} |
|
|
|
|
|
.form.svelte-633qhp {{ |
|
|
border: {border_color} solid 0.5px; |
|
|
border-radius: 6px; |
|
|
}} |
|
|
|
|
|
label[data-testid] {{ |
|
|
background-color: {bg} !important; |
|
|
color: {text_color} !important; |
|
|
}} |
|
|
|
|
|
[data-testid="block-info"] {{ |
|
|
color: {text_color} !important; |
|
|
}} |
|
|
|
|
|
div[role="tablist"] {{ |
|
|
border: 1px; |
|
|
border-radius: 8px; |
|
|
padding: {tab_padding} !important; |
|
|
height: auto !important; |
|
|
min-height: 0 !important; |
|
|
}} |
|
|
|
|
|
div[role="tab"] {{ |
|
|
font-size: {fsize} !important; |
|
|
padding: {tab_padding} !important; |
|
|
color: {text_color} !important; |
|
|
}} |
|
|
|
|
|
button[role="tab"][aria-selected="true"]::after {{ |
|
|
background-color:{light_purple} !important; |
|
|
}} |
|
|
|
|
|
button[role="tab"][aria-selected="true"] {{ |
|
|
color: {text_color} !important; |
|
|
}} |
|
|
|
|
|
button[role="tab"][aria-selected="false"] {{ |
|
|
background-color:transparent !important; |
|
|
color: #616161 !important; |
|
|
}} |
|
|
|
|
|
input[type="radio"] {{ |
|
|
background-color: #795699 !important; |
|
|
}} |
|
|
|
|
|
input[type="radio"]:checked {{ |
|
|
background-color: #56246B !important; |
|
|
border-color: #795699 !important; |
|
|
}} |
|
|
|
|
|
.user.svelte-pcjl1g.message {{ |
|
|
background-color: {user_msg_bg_color} !important; |
|
|
color: {msg_text_color} !important; |
|
|
}} |
|
|
|
|
|
.bot.svelte-pcjl1g.message {{ |
|
|
background-color: {bot_msg_bg_color} !important; |
|
|
color: {msg_text_color} !important; |
|
|
}} |
|
|
|
|
|
.md.svelte-7ddecg.chatbot.prose > p {{ |
|
|
color: {msg_text_color} !important; |
|
|
font-size: {fsize} !important; |
|
|
}} |
|
|
|
|
|
#example_questions {{ |
|
|
display: flex; |
|
|
justify-content: center; |
|
|
align-items: center; |
|
|
flex-wrap: wrap; |
|
|
gap: 10px; |
|
|
text-align: center; |
|
|
}} |
|
|
|
|
|
#example_questions .wrap.svelte-1kzox3m {{ |
|
|
display: contents; |
|
|
}} |
|
|
|
|
|
</style> |
|
|
""" |
|
|
return style |
|
|
|
|
|
def load_chat_history(chat_history): |
|
|
if chat_history is None: |
|
|
return [] |
|
|
return [ |
|
|
( |
|
|
msg["content"] if msg["role"] == "user" else None, |
|
|
msg["content"] if msg["role"] == "assistant" else None |
|
|
) |
|
|
for msg in chat_history |
|
|
] |
|
|
|
|
|
|
|
|
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>') |
|
|
header_desc = gr.HTML('<p id="header_description">' + translations["English"]["header_description"] + '</p>') |
|
|
chatbot = gr.Chatbot(label="", height=500, show_label=False, elem_id="chatbot", show_copy_button=False, show_copy_all_button=False, show_share_button=False) |
|
|
|
|
|
with gr.Row(): |
|
|
user_input = gr.Textbox( |
|
|
show_label=False, |
|
|
lines=1, |
|
|
placeholder=translations["English"]["user_input_placeholder"], |
|
|
interactive=True, |
|
|
elem_id="user_input", |
|
|
scale=13 |
|
|
) |
|
|
send_button = gr.Button( |
|
|
value=translations["English"]["send_button"], |
|
|
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>") |
|
|
|
|
|
inspiration_heading = gr.HTML('<h3 style="text-align: center;">' + translations["English"]["inspiration_heading"] + '</h3>') |
|
|
|
|
|
example_questions = gr.Radio( |
|
|
choices=translations["English"]["example_questions"], |
|
|
label="", |
|
|
interactive=True, |
|
|
elem_id="example_questions" |
|
|
) |
|
|
|
|
|
example_questions.change( |
|
|
fn=lambda x: chat_with_bot_stream(x, conversation_state.value[:1]), |
|
|
inputs=example_questions, |
|
|
outputs=[chatbot, conversation_state] |
|
|
) |
|
|
|
|
|
user_input.submit( |
|
|
fn=chat_with_bot_stream, |
|
|
inputs=[user_input, conversation_state], |
|
|
outputs=[chatbot, conversation_state] |
|
|
).then( |
|
|
fn=lambda: "", |
|
|
inputs=None, |
|
|
outputs=user_input |
|
|
) |
|
|
|
|
|
send_button.click( |
|
|
fn=chat_with_bot_stream, |
|
|
inputs=[user_input, conversation_state], |
|
|
outputs=[chatbot, conversation_state] |
|
|
).then( |
|
|
fn=lambda: "", |
|
|
inputs=None, |
|
|
outputs=user_input |
|
|
) |
|
|
|
|
|
clear_button.click( |
|
|
fn=lambda: ([], []), |
|
|
inputs=None, |
|
|
outputs=[chatbot, conversation_state] |
|
|
) |
|
|
|
|
|
|
|
|
with gr.TabItem(translations["English"]["settings_tab_item"]): |
|
|
with gr.Column(elem_id="settings_box"): |
|
|
settings_md = gr.Markdown(translations["English"]["settings_markdown"]) |
|
|
theme_radio = gr.Radio( |
|
|
choices=translations["English"]["theme_choices"], |
|
|
value="Dark", |
|
|
label=translations["English"]["theme_label"], |
|
|
) |
|
|
font_radio = gr.Radio( |
|
|
choices=translations["English"]["font_size_choices"], |
|
|
value="Medium", |
|
|
label=translations["English"]["font_size_label"], |
|
|
) |
|
|
language_radio = gr.Radio( |
|
|
choices=translations["English"]["language_choices"], |
|
|
value="English", |
|
|
label=translations["English"]["select_language_label"], |
|
|
) |
|
|
apply_button = gr.Button( |
|
|
translations["English"]["apply_settings_button"], |
|
|
elem_id="apply_button", |
|
|
) |
|
|
apply_button.click( |
|
|
fn=update_all_settings, |
|
|
inputs=[theme_radio, font_radio, language_radio], |
|
|
outputs=[ |
|
|
dynamic_styles, |
|
|
header_desc, |
|
|
user_input, |
|
|
send_button, |
|
|
settings_md, |
|
|
apply_button, |
|
|
theme_radio, |
|
|
font_radio, |
|
|
language_radio, |
|
|
clear_button, |
|
|
inspiration_heading, |
|
|
example_questions |
|
|
] |
|
|
) |
|
|
|
|
|
demo.launch() |
