Update app.py

app.py

@@ -70,25 +70,29 @@ def render_message(history):
     
     return messages_html
 
-with gr.Blocks() as demo:
-    gr.Markdown("## P-MSQ Chat Interface with Profile Pictures")  
+with gr.Blocks(css=".chatbox {height: 400px; overflow-y: auto;}") as demo:
+    gr.Markdown("## P-MSQ Chat Interface with Profile Pictures")
     gr.Markdown("""
     Welcome to the **P-MSQ** (Messaging Service Query) chat interface! 
     You are interacting with a friendly AI chatbot that can assist you in various situations.
     Use the text input box below to start chatting.
     """)
 
-    with gr.Column():  
-        chatbot_output = gr.HTML()  
+    chatbot_output = gr.HTML(elem_id="chatbox", label="Chat History") 
 
-    with gr.Row():
-        msg_input = gr.Textbox(show_label=False, placeholder="Type your message here...", lines=2)
-        send_btn = gr.Button("Send")
-        regen_btn = gr.Button("Regenerate")
+    msg_input = gr.Textbox(
+        show_label=False, 
+        placeholder="Type your message and press Enter...", 
+        lines=2
+    )
+
+    send_btn = gr.Button("Send")
+    regen_btn = gr.Button("Regenerate")
 
     system_message = gr.Textbox(value="You are P-MSQ (Messaging Service Query), a friendly AI Chatbot that can help in any situations.", label="System message")
     
-    gr.Markdown("### Settings")  
+    gr.Markdown("### Settings")
+    
     max_tokens = gr.Slider(minimum=1, maximum=2048, value=1024, step=1, label="Max new tokens")
     top_p = gr.Slider(minimum=0, maximum=2, value=0.8, step=0.1, label="Top P")
     temperature = gr.Slider(minimum=0.1, maximum=1, value=0.7, step=0.1, label="Temperature")
@@ -106,6 +110,10 @@ with gr.Blocks() as demo:
             return render_message(history), history
         return render_message(history), history  
 
+    msg_input.submit(user_interaction, 
+                     inputs=[msg_input, history_state, system_message, max_tokens, top_p, temperature], 
+                     outputs=[chatbot_output, history_state, msg_input, last_message_state])
+
     send_btn.click(user_interaction, 
                    inputs=[msg_input, history_state, system_message, max_tokens, top_p, temperature], 
                    outputs=[chatbot_output, history_state, msg_input, last_message_state])
@@ -114,5 +122,9 @@ with gr.Blocks() as demo:
                     inputs=[history_state, last_message_state, system_message, max_tokens, top_p, temperature], 
                     outputs=[chatbot_output, history_state])
 
+    with gr.Row():
+        send_btn
+        regen_btn
+
 if __name__ == "__main__":
     demo.launch()