Update app.py

app.py

@@ -102,7 +102,9 @@ def respond(message, api_key, max_tokens, top_p, temperature):
         return history, "Error: " + response.json().get("error", "Unknown error occurred.")
 
 def render_message(history):
-    messages_html = ""
+    messages_html = """
+    <div id="chatbox-container" class="chatbox">
+        <div id="messages">"""
 
     for user_message, assistant_message, user_profile, assistant_profile, user_pic, assistant_pic in history:
         if user_message:
@@ -117,27 +119,13 @@ def render_message(history):
                 messages_html += f"<img src='{assistant_pic}' style='width: 40px; height: 40px; border-radius: 50%; margin-right: 10px;'>"
             messages_html += f"{assistant_message}</div><br>"
 
+
     return messages_html
 
-def append_new_message(new_message):
-    return f"""
-    <script>
-        var chatbox = document.getElementById('messages');
-        chatbox.innerHTML += `{new_message}`;
-        var chatboxContainer = document.getElementById('chatbox-container');
-        chatboxContainer.scrollTop = chatboxContainer.scrollHeight;
-    </script>
-    """
 
+with gr.Blocks(css=".chatbox {height: 400px; overflow-y: auto; border: 1px solid #262626; padding: 10px; background-color: #171717;}") as demo:
 
-with gr.Blocks() as demo:
-    
-    with gr.Column():
-        chatbot_output = gr.HTML(elem_id="chatbox-container", value="""
-            <div id="chatbox-container" class="chatbox" style="height: 400px; overflow-y: auto; border: 1px solid #262626; padding: 10px; background-color: #171717;">
-                <div id="messages"></div>
-            </div>
-        """) 
+    with gr.Column(visible=True) as auth_view:
         gr.Markdown("## P-MSQ Authorization")
         gr.Markdown("P-MSQ is in closed alpha test! The model, api and more are subject to change. Even though the space is public, P-MSQ is restricted for public use, available for testers.")
         api_user_input = gr.Textbox(placeholder="snowflake", label="UserID", type='email')
@@ -206,10 +194,10 @@ with gr.Blocks() as demo:
         if authorize(user, api_key, PRIMARY_SYSTEM_INSTRUCTIONS):
             gr.Info("Loading, please wait.")
             messages_html, history = load_conversation(api_key)
-            return auth_status.update(visible=False), gr.update(visible=True), messages_html, history
+            return gr.update(visible=False), gr.update(visible=True), messages_html, history
         else:
             gr.Warning("Incorrect userid/token")
-            return auth_status.update(visible=True), gr.update(visible=False), auth_status.update(value="Invalid userid/token")
+            return gr.update(visible=True), gr.update(visible=False), auth_status.update(value="Invalid userid/token")
 
     def save_custom_instructions(api_key, custom_instructions):
         if api_key in sessions:
@@ -221,15 +209,10 @@ with gr.Blocks() as demo:
             return "Session not found.", gr.update(value="")
 
             
-    auth_button.click(authorize_and_proceed, 
-                      inputs=[api_user_input, api_key_input], 
-                      outputs=[auth_status, chat_view, chatbot_output, history_state])
-    save_instructions_btn.click(save_custom_instructions, 
-                                inputs=[api_key_input, system_instructions_input], 
-                                outputs=auth_status)
+    auth_button.click(authorize_and_proceed, inputs=[api_user_input, api_key_input], outputs=[auth_view, chat_view, chatbot_output, history_state])
+    save_instructions_btn.click(save_custom_instructions, inputs=[api_key_input, system_instructions_input], outputs=auth_status)
 
 
 if __name__ == "__main__":
     demo.queue = False
-    demo.config["queue"] = False
-    demo.launch()
+    demo.launch()