Update app.py

app.py

@@ -21,11 +21,7 @@ MODEL_OPTIONS = [
     "liquid/lfm-40b:free"
 ]
 
-# Initialize history
-history = []
-
-def generate_text(input_text, selected_model, history_state):
-    global history
+def generate_text(input_text, selected_model):
     response = requests.post(
         url="https://openrouter.ai/api/v1/chat/completions",
         headers={
@@ -46,46 +42,38 @@ def generate_text(input_text, selected_model, history_state):
     
     # Handle errors
     if response.status_code != 200:
-        return f"Error: {response.status_code}, {response.text}", history_state
+        return f"Error: {response.status_code}, {response.text}"
     
     # Parse and return the content of the response
     try:
         response_json = response.json()
-        result = response_json.get("choices", [{}])[0].get("message", {}).get("content", "No content returned.")
+        return response_json.get("choices", [{}])[0].get("message", {}).get("content", "No content returned.")
     except json.JSONDecodeError:
-        result = "Error: Unable to parse response."
-    
-    # Add the current interaction to the history
-    history_entry = {
-        "input": input_text,
-        "selected_model": selected_model,
-        "response": result
-    }
-    history.append(history_entry)
-    
-    # Update the history state
-    history_state = history
+        return "Error: Unable to parse response."
+
+# Define the Gradio layout using Blocks
+with gr.Blocks() as iface:
+    # Inject custom CSS using gr.HTML()
+    gr.HTML("""
+        <style>
+            #output-response, #output-history {
+                height: 300px;
+                overflow: auto;
+                border: 1px solid #ddd;
+                padding: 10px;
+            }
+        </style>
+    """)
+
+    input_text = gr.Textbox(lines=2, label="Input Text", placeholder="Enter your query here")
+    selected_model = gr.Dropdown(choices=MODEL_OPTIONS, label="Select Model", value=MODEL_OPTIONS[0])
     
-    # Prepare the formatted history string
-    formatted_history = "\n".join([f"Input: {entry['input']}\nModel: {entry['selected_model']}\nResponse: {entry['response']}\n" for entry in history])
+    output_response = gr.Textbox(label="Response", placeholder="Response will be shown here")
+    output_history = gr.Textbox(label="History", placeholder="Interaction history will be shown here", lines=10, interactive=False)
     
-    return result, formatted_history, history_state
-
-# Create Gradio interface with a dropdown for model selection
-iface = gr.Interface(
-    fn=generate_text,
-    inputs=[
-        gr.Textbox(lines=2, label="Input Text", placeholder="Enter your query here"),
-        gr.Dropdown(choices=MODEL_OPTIONS, label="Select Model", value=MODEL_OPTIONS[0]),
-        gr.State()
-    ],
-    outputs=[
-        gr.Textbox(label="Response", placeholder="Response will be shown here"),
-        gr.Textbox(label="History", placeholder="Interaction history will be shown here", lines=10, interactive=False),
-        gr.State()
-    ],
-    title="Chat with OpenRouter Models"
-)
+    # Trigger the function when the user inputs text
+    generate_button = gr.Button("Generate")
+    generate_button.click(generate_text, inputs=[input_text, selected_model], outputs=[output_response, output_history])
 
-# Directly include custom CSS with HTML component
-iface.launch(inline_css=True)
+# Launch the interface
+iface.launch()