Update app.py

app.py

@@ -4,7 +4,7 @@ import json
 import os
 from datetime import datetime
 
-# API configuration (replace with your actual endpoint and token)
+
 API_ENDPOINT = os.getenv("API_ENDPOINT", "none")
 API_TOKEN = os.getenv("API_TOKEN")
 
@@ -69,6 +69,10 @@ def update_history_display(stored_history):
     html += f"<script>localStorage.setItem('chat_history', JSON.stringify({json.dumps(stored_history)}))</script>"
     return html
 
+# Function to load history from JavaScript
+def load_history_from_js():
+    return gr.Var(value=[], js="() => { const history = localStorage.getItem('chat_history'); return history ? JSON.parse(history) : []; }")
+
 # Modern CSS for a clean UI
 custom_css = """
 body { background-color: #1a1a1a; color: #ffffff; font-family: 'Arial', sans-serif; }
@@ -82,7 +86,7 @@ button:hover { background-color: #404040; }
 """
 
 # Build the Gradio app
-with gr.Blocks(css=custom_css, title="Modern AI Chatbot") as demo:
+with gr.Blocks(css=custom_css, title="Reka Flash 3 Demo") as demo:
     with gr.Row():
         # Sidebar for history
         with gr.Column(scale=1, min_width=300, elem_id="sidebar"):
@@ -92,7 +96,7 @@ with gr.Blocks(css=custom_css, title="Modern AI Chatbot") as demo:
         
         # Main chat area
         with gr.Column(scale=3):
-            chatbot = gr.Chatbot(elem_id="chatbot", type="messages")  # Fix 1: Set type to 'messages'
+            chatbot = gr.Chatbot(elem_id="chatbot")
             with gr.Row():
                 message = gr.Textbox(placeholder="Type your message...", show_label=False, container=False)
                 submit_btn = gr.Button("Send", size="sm")
@@ -133,19 +137,21 @@ with gr.Blocks(css=custom_css, title="Modern AI Chatbot") as demo:
         history_display
     )
 
-    # Load initial history from local storage
+    # Load initial history with JavaScript
+    history_from_js = gr.JSON(visible=False)
+    
     demo.load(
-        None,
-        None,
-        history_state,
-        _js="""() => {
-            const history = localStorage.getItem('chat_history');
-            return history ? JSON.parse(history) : [];
-        }"""
+        load_history_from_js,
+        inputs=None,
+        outputs=history_from_js
+    ).then(
+        lambda x: x,
+        inputs=history_from_js,
+        outputs=history_state
     ).then(
         update_history_display,
-        history_state,
-        history_display
+        inputs=history_state,
+        outputs=history_display
     )
 
 demo.launch()