Update app.py

app.py

@@ -11,7 +11,7 @@ client = Groq(
 def chat_with_federer(message, history):
     prompt = f"""You are a chatbot impersonating Roger Federer, the legendary tennis player. 
     You have extensive knowledge about tennis, including its history, rules, tournaments, and players. 
-    Respond to the following message as Roger Federer would. After your main response, always include a new line with "Did you know! 🎾" followed by a short, interesting fun fact about tennis. The fun fact should be no more than 20 words and should be different for each response.
+    Respond to the following message as Roger Federer would. After your main response, always include a new line with "Did you know! 😂" followed by a short, fun fact related to tennis. The fun fact should be no more than 15 words.
 
     Human: {message}
     Roger Federer:"""
@@ -36,76 +36,41 @@ def chat_with_federer(message, history):
     response = chat_completion.choices[0].message.content
 
     if "Did you know!" in response and not response.endswith("\n"):
-        response = response.replace("Did you know!", "\nDid you know! 🎾")
+        response = response.replace("Did you know!", "\nDid you know! 😂")
     elif "Did you know!" in response:
-        response = response.replace("Did you know!", "Did you know! 🎾")
+        response = response.replace("Did you know!", "Did you know! 😂")
 
     return response
 
-# Custom CSS for improved layout and aesthetics
+# Custom CSS for center alignment
 custom_css = """
-.container {
-    max-width: 800px;
-    margin: auto;
-    padding: 20px;
-}
 .center-text {
     text-align: center;
     margin: auto;
     max-width: 90%;
 }
-#chatbot {
-    height: 600px !important;
-    overflow-y: auto;
-}
-#chatbot .message {
-    padding: 10px;
-    margin: 5px;
-    border-radius: 10px;
-}
-#chatbot .user {
-    background-color: #e6f3ff;
-}
-#chatbot .bot {
-    background-color: #f0f0f0;
-}
-.custom-textbox textarea {
-    font-size: 16px !important;
-}
 """
 
-# Create the Gradio interface with custom CSS and improved layout
+# Create the Gradio interface with custom CSS and updated title
 with gr.Blocks(css=custom_css) as iface:
-    with gr.Column(elem_classes=["container"]):
-        gr.Markdown(
-            "# 🎾 Chat with the G.O.A.T. Roger Federer 🏆",
-            elem_classes=["center-text"]
-        )
-        gr.Markdown(
-            "🌟 Serve up your questions to the tennis legend! 🎾 Get expert insights on Grand Slams, technique, and more. Let's rally some knowledge! 💬🏆",
-            elem_classes=["center-text"]
-        )
-        chatbot = gr.Chatbot(elem_id="chatbot")
-        msg = gr.Textbox(
-            show_label=False,
-            placeholder="Type your message here...",
-            elem_classes=["custom-textbox"]
-        )
-        clear = gr.Button("Clear")
-        
-        gr.Examples(
-            examples=[
-                "What's your favorite Grand Slam tournament and why?",
-                "Can you explain the difference between clay and grass courts?",
-                "What do you think about the current state of men's tennis?",
-                "Any tips for improving my backhand?",
-                "What was your most memorable match and why?",
-            ],
-            inputs=msg
-        )
-
-    msg.submit(chat_with_federer, [msg, chatbot], [msg, chatbot])
-    clear.click(lambda: None, None, chatbot, queue=False)
+    gr.Markdown(
+        "# 🎾 Chat with the G.O.A.T. Roger Federer 🏆",
+        elem_classes=["center-text"]
+    )
+    gr.Markdown(
+        "🌟 Serve up your questions to the tennis legend! 🎾 Get expert insights on Grand Slams, technique, and more. Let's rally some knowledge! 💬🏆",
+        elem_classes=["center-text"]
+    )
+    chatbot = gr.ChatInterface(
+        chat_with_federer,
+        examples=[
+            "What's your favorite Grand Slam tournament and why?",
+            "Can you explain the difference between clay and grass courts?",
+            "What do you think about the current state of men's tennis?",
+            "Any tips for improving my backhand?",
+            "What was your most memorable match and why?",
+        ],
+    )
 
 # Launch the interface
 iface.launch()