Update app.py

app.py

@@ -3,16 +3,26 @@ from huggingface_hub import InferenceClient
 
 client = InferenceClient("HuggingFaceH4/zephyr-7b-beta")
 
-def respond(message, history, system_message, max_tokens, temperature, top_p):
+def respond(
+    message,
+    history: list[tuple[str, str]],
+    system_message,
+    max_tokens,
+    temperature,
+    top_p,
+):
     messages = [{"role": "system", "content": system_message}]
-    for user, assistant in history:
-        if user:
-            messages.append({"role": "user", "content": user})
-        if assistant:
-            messages.append({"role": "assistant", "content": assistant})
+
+    for val in history:
+        if val[0]:
+            messages.append({"role": "user", "content": val[0]})
+        if val[1]:
+            messages.append({"role": "assistant", "content": val[1]})
+
     messages.append({"role": "user", "content": message})
 
     response = ""
+
     for message in client.chat_completion(
         messages,
         max_tokens=max_tokens,
@@ -21,60 +31,49 @@ def respond(message, history, system_message, max_tokens, temperature, top_p):
         top_p=top_p,
     ):
         token = message.choices[0].delta.content
+
         response += token
         yield response
 
 # Custom CSS for improved visual appeal
 custom_css = """
-body {
-    background-color: #f0f4f8;
-    font-family: 'Arial', sans-serif;
-}
 .gradio-container {
     max-width: 800px !important;
     margin: auto;
     padding: 20px;
-    border-radius: 15px;
+    border-radius: 10px;
     box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
-    background-color: white;
+    background-color: #f8f9fa;
 }
 .chat-window {
-    border-radius: 10px;
+    border-radius: 8px;
     border: 1px solid #e0e0e0;
+    background-color: white;
 }
-.chat-message {
-    padding: 10px 15px;
+.additional-inputs {
+    margin-top: 20px;
+    padding: 15px;
+    background-color: #e9ecef;
     border-radius: 8px;
-    margin: 5px 0;
-}
-.user-message {
-    background-color: #e3f2fd;
-}
-.bot-message {
-    background-color: #f1f8e9;
 }
 """
 
-# Create the ChatInterface with custom styling
 demo = gr.ChatInterface(
     respond,
     additional_inputs=[
-        gr.Textbox(value="You are a friendly Chatbot.", label="System Message", lines=2),
-        gr.Slider(minimum=1, maximum=2048, value=512, step=1, label="Max New Tokens"),
+        gr.Textbox(value="You are a friendly Chatbot.", label="System message"),
+        gr.Slider(minimum=1, maximum=2048, value=512, step=1, label="Max new tokens"),
         gr.Slider(minimum=0.1, maximum=4.0, value=0.7, step=0.1, label="Temperature"),
-        gr.Slider(minimum=0.1, maximum=1.0, value=0.95, step=0.05, label="Top-p (Nucleus Sampling)"),
+        gr.Slider(
+            minimum=0.1,
+            maximum=1.0,
+            value=0.95,
+            step=0.05,
+            label="Top-p (nucleus sampling)",
+        ),
     ],
-    title="Enhanced AI Chatbot",
-    description="Engage in a conversation with an AI powered by the Zephyr-7b-beta model.",
-    theme="soft",
     css=custom_css,
-    examples=[
-        ["Tell me a short story about a robot learning to paint."],
-        ["What are the main challenges in space exploration?"],
-        ["Explain quantum computing to a 10-year-old."]
-    ],
 )
 
-
 if __name__ == "__main__":
     demo.launch()