Update app.py

app.py

@@ -1,132 +1,97 @@
-import os
-from openai import OpenAI
 import gradio as gr
-from enum import Enum
+from chat import *
+from settings import *
 
-client = OpenAI(
-    base_url="https://router.huggingface.co/hf-inference/models/HuggingFaceTB/SmolLM3-3B/v1",
-    api_key=os.environ["access_token"],
-)
-
-model = "HuggingFaceTB/SmolLM3-3B"
-
-system_message = """
-You are a friendly and patient Spanish language tutor. Your goal is to help me practice short, natural conversations in Spanish.
-
-Instructions:
-1. Start by suggesting a simple, friendly conversation topic (e.g., hobbies, food, travel, daily life). Be creative!
-2. Ask me one short question about this topic in Spanish. Keep it casual and natural.
-3. After each of my replies, ask a new short question on the same topic. Correct any mistakes I make, clearly and kindly.
-4. If my reply is off-topic, politely ignore it and ask your question again.
-5. After each of your messages, include the English translation in parentheses starting with 🇬🇧.
-6. End the conversation after I reply 5 times. In your final message:
-    - Provide detailed feedback on my Spanish: correctness, vocabulary, sentence length, and fluency.
-    - Give me a score from 0 to 100.
-    - Start your final feedback message with the symbol $.
-
-Keep the conversation light, friendly, and supportive.
-"""
-
-class ChatLength(Enum):
-    SHORT = "Short (5 replies)"
-    MEDIUM = "Medium (10 replies)"
-    LONG = "Long (20 replies"
-
-# Global storage for settings
-settings = {
-    "chat_length": ChatLength.MEDIUM,
-    "show_en_translation": True
-}
-
-def show_settings_updated_alert():
-    gr.Info("Settings updated.")
-
-def set_chat_length(length):
-    settings["chat_length"] = length
-    show_settings_updated_alert()
-
-def get_chat_length():
-    return settings["chat_length"]
-
-def set_show_en_translation(show):
-    settings["show_en_translation"] = show
-    show_settings_updated_alert()
-
-def get_show_en_translation():
-    return settings["show_en_translation"]
-
-def get_response(system_message, history):
-    messages = [{"role": "system", "content": system_message}] + history
-    completion = client.chat.completions.create(model=model, messages=messages)
-    return completion.choices[0].message.content   
-
-def chat_fn(message, history):
-    history.append({"role": "user", "content": message})
-
-    # Check chat length.
-    if len([msg for msg in history if msg["role"] == "user"]) >= settings["chat_length"]:
-        gr.Info("Chat ended.")
-        history.append({"role": "assistant", "content": "Chat ended. Your feedback: TODO"}) # TODO: FIX
-        return history, gr.update(interactive=False)
-    else:
-        response = get_response(system_message, history)
-        history.append({"role": "assistant", "content": response})
-        return history, gr.update()
-
-# Chat interface
+# Chat interface.
 with gr.Blocks() as chat_app:
-    chatbot = gr.Chatbot(type="messages")
-    msg = gr.Textbox(label="Your Message:")
-    clear_btn = gr.Button("Start New Chat")
-
-    msg.submit(chat_fn, [msg, chatbot], [chatbot, msg])
-    clear_btn.click(lambda: [], None, chatbot) # TODO: FIX
-
-# Settings interface
-# with gr.Blocks() as settings_app:
-#     def update_chat_length_state(choice, state):
-#         state = choice
-#         set_chat_length(choice)
-#         return state
+    def update_api_key_state(value):
+        state = value
+        set_api_key(value)
+        return state
+
+    api_key_input = gr.Textbox(
+        show_label=False, 
+        placeholder="OpenAI API Key (required)",
+        type="password"
+    )
+    api_key_input.change(fn=update_api_key_state, inputs=api_key_input, outputs=None)
+    
+    start_new_chat_btn = gr.Button("✨ Start New Chat")
+
+    chatbot = gr.Chatbot(
+        type="messages",
+        label=get_current_chat_language(),
+        show_copy_button=True,
+        placeholder="Please provide OpenAI API Key and press ✨ Start New Chat."
+    )
     
-#     def update_show_en_translation_state(value, state):
-#         state = value
-#         set_show_en_translation(value)
-#         return state
+    with gr.Row(equal_height=True):
+        msg = gr.Textbox(
+            placeholder="Type a message...",
+            show_label=False
+        )
+        submit_btn = gr.Button("Submit", scale=0)
+
+    msg.submit(chat_send_user_answer, [msg, chatbot], [msg, chatbot], queue=False).then(
+        chat_send_assistant_answer, chatbot, chatbot
+    )
+
+    submit_btn.click(chat_send_user_answer, [msg, chatbot], [msg, chatbot], queue=False).then(
+        chat_send_assistant_answer, chatbot, chatbot
+    )
+    
+    start_new_chat_btn.click(chat_clear_history, outputs=[chatbot], queue=False).then(
+        chat_start_new, outputs=[chatbot]
+    )
+    
+# Settings interface.
+with gr.Blocks() as settings_app:
+    def update_chat_length_state(choice, state):
+        state = choice
+        set_chat_length(choice)
+        return state
+    
+    def update_show_en_translation_state(value, state):
+        state = value
+        set_show_en_translation(value)
+        return state
         
-#     with gr.Blocks() as demo:
-#         chat_length_state = gr.State()
-#         show_en_translation_state = gr.State()
-
-#         with gr.Row():
-#             with gr.Column():
-#                 chat_length_radio = gr.Radio(
-#                     [ChatLength.SHORT.value, ChatLength.MEDIUM.value, ChatLength.LONG.value],
-#                     label="Chat length",
-#                     value=get_chat_length()
-#                 )
-#             with gr.Column():
-#                 show_en_translation_checkbox = gr.Checkbox(
-#                     label="Show English translation",
-#                     value=get_show_en_translation()
-#                 )
+    with gr.Blocks() as demo:
+        chat_length_state = gr.State()
+        show_en_translation_state = gr.State()
         
-#         chat_length_radio.change(
-#             update_chat_length_state, 
-#             [chat_length_radio, chat_length_state], 
-#             chat_length_state
-#         )
-#         show_en_translation_checkbox.change(
-#             update_show_en_translation_state, 
-#             [show_en_translation_checkbox, show_en_translation_state],
-#             show_en_translation_state
-#         )
-
-# Tabs for navigation
-with gr.Blocks() as app:
-    # with gr.Tab("Chat"):
-    chat_app.render()
-    # with gr.Tab("Settings"):
-    #     settings_app.render()
+        with gr.Row():
+            with gr.Column():
+                chat_length_radio = gr.Radio(
+                    [ChatLength.SHORT.value, ChatLength.MEDIUM.value, ChatLength.LONG.value],
+                    show_label=False, 
+                    info="Chat length",
+                    value=get_chat_length()
+                )
+            with gr.Column():
+                show_en_translation_checkbox = gr.Checkbox(
+                    label="Show English translation",
+                    value=get_show_en_translation()
+                )
+
+        gr.Markdown("Please start a new chat after changing any settings.")
+        
+        chat_length_radio.change(
+            update_chat_length_state, 
+            [chat_length_radio, chat_length_state], 
+            chat_length_state
+        )
+        show_en_translation_checkbox.change(
+            update_show_en_translation_state, 
+            [show_en_translation_checkbox, show_en_translation_state],
+            show_en_translation_state
+        )
+
+# Tabs for navigation.
+with gr.Blocks(theme=gr.themes.Soft()) as app:
+    with gr.Tab("Chat"):
+        chat_app.render()
+    with gr.Tab("Settings"):
+        settings_app.render()
 
 app.launch()