Update app.py

app.py

@@ -1,46 +1,10 @@
 import gradio as gr
 from huggingface_hub import InferenceClient
-import os
 
-# Get HF token from environment variable
-HF_TOKEN = os.getenv("HF_TOKEN")
-
-# Initialize client with proper error handling
-def get_client():
-    if HF_TOKEN:
-        try:
-            # Try with the preferred model first
-            return InferenceClient("HuggingFaceH4/zephyr-7b-beta", token=HF_TOKEN)
-        except Exception as e:
-            print(f"Failed to initialize zephyr model: {e}")
-            # Fallback to mistral with token
-            try:
-                return InferenceClient("mistralai/Mistral-7B-Instruct-v0.1", token=HF_TOKEN)
-            except Exception as e2:
-                print(f"Failed to initialize mistral model: {e2}")
-                return None
-    else:
-        print("No HF_TOKEN found. Please set your Hugging Face token.")
-        return None
-
-client = get_client()
-
-# Dynamic prompt builder based on CEFR level
-def level_to_prompt(level):
-    return {
-        "A1": "You are a friendly French tutor. Speak mostly in English, use simple French, and explain everything.",
-        "A2": "You are a patient French tutor. Use short French phrases and explain them in English.",
-        "B1": "You are a helpful French tutor. Speak mostly in French but clarify in English when needed.",
-        "B2": "You are a French tutor. Speak primarily in French with rare English support.",
-        "C1": "You are a native French tutor. Speak entirely in French, clearly and professionally.",
-        "C2": "You are a native French professor. Speak in rich, complex French. Avoid English."
-    }.get(level, "You are a helpful French tutor.")
-
-# Custom background CSS
+# Custom background CSS with semi-transparent panel
 css = """
-@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP&family=Playfair+Display&display=swap');
 body {
-  background-image: url('https://cdn-uploads.huggingface.co/production/uploads/67351c643fe51cb1aa28f2e5/wuyd5UYTh9jPrMJGmV9yC.jpeg');
+  background-image: url('https://cdn-uploads.huggingface.co/production/uploads/67351c643fe51cb1aa28f2e5/vcVnxPZhCXRVL2fn3rG6B.jpeg');
   background-size: cover;
   background-position: center;
   background-repeat: no-repeat;
@@ -52,142 +16,111 @@ body {
   min-height: 100vh;
   padding-top: 2rem;
   padding-bottom: 2rem;
-}  
+}
 #chat-panel {
   background-color: rgba(255, 255, 255, 0.85);
   padding: 2rem;
   border-radius: 12px;
+  justify-content: center;
+  width: 100%;
   max-width: 700px;
   height: 70vh;
-  margin: auto;
   box-shadow: 0 0 12px rgba(0, 0, 0, 0.3);
   overflow-y: auto;
 }
+/* Improved title styling */
 .gradio-container .chatbot h1 {
-  color: var(--custom-title-color) !important;
-  font-family: 'Playfair Display', serif !important;
-  font-size: 5rem !important;
-  font-weight: bold !important;
-  text-align: center !important;
-  margin-bottom: 1.5rem !important;
-  width: 100%;
+   color: var(--custom-title-color) !important;
+   font-family: 'Noto Sans', serif !important;
+   font-size: 5rem !important;  /* Increased font size */
+   font-weight: bold !important;
+   text-align: center !important;
+   margin-bottom: 1.5rem !important;
+   width: 100%;  /* Ensure full width for centering */
 }
 """
 
-# Chat logic with proper error handling
-def respond(message, history, level, max_tokens, temperature, top_p):
-    # Check if client is available
-    if client is None:
-        yield "❌ Désolé! The AI service is not available. Please check your Hugging Face token configuration."
-        return
+client = InferenceClient("HuggingFaceH4/zephyr-7b-beta")
+
+def respond(
+    message,
+    history,
+    system_message,
+    max_tokens,
+    temperature,
+    top_p,
+):
+    messages = [{"role": "system", "content": system_message}]
     
-    system_message = level_to_prompt(level)
+    # Handle history based on its format (tuple format or messages format)
+    if history and isinstance(history[0], tuple):
+        # Old tuple format
+        for user_msg, assistant_msg in history:
+            if user_msg:
+                messages.append({"role": "user", "content": user_msg})
+            if assistant_msg:
+                messages.append({"role": "assistant", "content": assistant_msg})
+    else:
+        # New messages format
+        messages.extend(history)
+    
+    messages.append({"role": "user", "content": message})
     
-    # Generate response
     response = ""
-    try:
-        # Create a proper prompt format for instruction-following models
-        prompt = f"<|system|>\n{system_message}\n\n"
-        
-        # Add conversation history
-        if history:
-            for turn in history:
-                if isinstance(turn, dict):
-                    if turn.get("role") == "user":
-                        prompt += f"<|user|>\n{turn['content']}\n\n"
-                    elif turn.get("role") == "assistant":
-                        prompt += f"<|assistant|>\n{turn['content']}\n\n"
-                else:
-                    # Handle tuple format (user, assistant)
-                    user_msg, bot_msg = turn
-                    if user_msg:
-                        prompt += f"<|user|>\n{user_msg}\n\n"
-                    if bot_msg:
-                        prompt += f"<|assistant|>\n{bot_msg}\n\n"
-        
-        # Add current user message
-        prompt += f"<|user|>\n{message}\n\n<|assistant|>\n"
-        
-        # Generate response with streaming
-        for token in client.text_generation(
-            prompt, 
-            max_new_tokens=max_tokens, 
-            stream=True, 
-            temperature=temperature, 
-            top_p=top_p,
-            do_sample=True,
-            return_full_text=False,
-            stop_sequences=["<|user|>", "<|system|>"]  # Stop if model tries to continue conversation
-        ):
-            if token:  # Handle None tokens
-                # Clean up any unwanted tokens
-                token = token.replace("<|user|>", "").replace("<|system|>", "").replace("<|assistant|>", "")
-                if token.strip():  # Only add non-empty tokens
-                    response += token
-                    yield response
-                
-    except Exception as e:
-        error_msg = str(e)
-        print(f"Error in chat completion: {e}")
-        
-        if "401" in error_msg or "Unauthorized" in error_msg:
-            yield "🔑 Authentication Error: Please check your Hugging Face token. Make sure it's valid and has the correct permissions."
-        elif "429" in error_msg or "rate limit" in error_msg.lower():
-            yield "⏰ Rate limit exceeded. Please wait a moment before trying again."
-        elif "503" in error_msg or "Service Unavailable" in error_msg:
-            yield "🔧 The AI service is temporarily unavailable. Please try again later."
-        else:
-            yield f"❌ Désolé! There was an error: {error_msg}"
-
-# UI layout
-with gr.Blocks(css=css, title="French Tutor") as demo:
-    gr.Markdown("# 🇫🇷 French Tutor", elem_id="custom-title")
     
-    # Add status indicator
-    if client is None:
-        gr.Markdown("⚠️ **Warning**: No Hugging Face token found. Please set your HF_TOKEN environment variable.")
-    else:
-        gr.Markdown("✅ **Status**: Connected to AI service")
+    for msg in client.chat_completion(
+        messages,
+        max_tokens=max_tokens,
+        stream=True,
+        temperature=temperature,
+        top_p=top_p,
+    ):
+        token = msg.choices[0].delta.content
+        response += token
+        yield response
+
+with gr.Blocks(css=css) as demo:
+    # Title Markdown block
+    gr.Markdown("French Instructor", elem_id="custom-title")
     
     with gr.Column(elem_id="chat-panel"):
-        gr.Markdown("""
-        
-        with gr.Accordion("⚙️ Advanced Settings", open=False):
-            level = gr.Dropdown(
-                choices=["A1", "A2", "B1", "B2", "C1", "C2"],
-                value="A1",
-                label="Your French Level (CEFR)",
-                info="Choose your current French proficiency level"
+        with gr.Accordion("Advanced Settings", open=False):
+            system_message = gr.Textbox(
+                value="You are a helpful French language tutor. You help users learn French vocabulary, grammar, and cultural contexts. When appropriate, include both the French writing and pronunciation. For beginners, focus on simple phrases and gradually increase difficulty based on user proficiency.", 
+                label="System Message"
             )
             max_tokens = gr.Slider(
-                1, 2048, 
+                minimum=1, 
+                maximum=2048, 
                 value=512, 
                 step=1, 
-                label="Response Length",
-                info="Maximum number of tokens in the response"
+                label="Response Length"
             )
             temperature = gr.Slider(
-                0.1, 2.0, 
+                minimum=0.1, 
+                maximum=4.0, 
                 value=0.7, 
                 step=0.1, 
-                label="Creativity",
-                info="Higher values make responses more creative"
+                label="Creativity"
             )
             top_p = gr.Slider(
-                0.1, 1.0, 
+                minimum=0.1, 
+                maximum=1.0, 
                 value=0.95, 
                 step=0.05, 
-                label="Dynamic Text",
-                info="Controls text diversity"
+                label="Dynamic Text"
             )
         
         gr.ChatInterface(
-            fn=respond,
-            additional_inputs=[level, max_tokens, temperature, top_p],
-            type="messages",
-            title="Chat with your French Tutor",
-            description="Ask questions, practice conversation, or get help with French grammar!"
+            respond,
+            additional_inputs=[
+                system_message, 
+                max_tokens, 
+                temperature, 
+                top_p
+            ],
+            type="messages"  # Set to new message format
         )
-""")
+
 if __name__ == "__main__":
     demo.launch()