chatui-helper / app.py
milwright
Improve configuration interface and deployment package
7bdbd56
import warnings
warnings.filterwarnings("ignore", message="The 'tuples' format for chatbot messages is deprecated")
# Ensure we're using Gradio 4.x
import gradio as gr
print(f"Gradio version: {gr.__version__}")
import json
import zipfile
import io
import os
from datetime import datetime
from dotenv import load_dotenv
import requests
from bs4 import BeautifulSoup
import tempfile
from pathlib import Path
from support_docs import create_support_docs, export_conversation_to_markdown
# Simple URL content fetching using requests and BeautifulSoup
def get_grounding_context_simple(urls):
"""Fetch grounding context using enhanced HTTP requests"""
if not urls:
return ""
context_parts = []
for i, url in enumerate(urls, 1):
if url and url.strip():
# Use enhanced URL extraction for any URLs within the URL text
extracted_urls = extract_urls_from_text(url.strip())
target_url = extracted_urls[0] if extracted_urls else url.strip()
content = enhanced_fetch_url_content(target_url)
context_parts.append(f"Context from URL {i} ({target_url}):\n{content}")
if context_parts:
return "\n\n" + "\n\n".join(context_parts) + "\n\n"
return ""
# Load environment variables from .env file
load_dotenv()
# Utility functions
import re
def extract_urls_from_text(text):
"""Extract URLs from text using regex with enhanced validation"""
url_pattern = r'https?://[^\s<>"{}|\\^`\[\]"]+'
urls = re.findall(url_pattern, text)
# Basic URL validation and cleanup
validated_urls = []
for url in urls:
# Remove trailing punctuation that might be captured
url = url.rstrip('.,!?;:')
# Basic domain validation
if '.' in url and len(url) > 10:
validated_urls.append(url)
return validated_urls
def validate_url_domain(url):
"""Basic URL domain validation"""
try:
from urllib.parse import urlparse
parsed = urlparse(url)
# Check for valid domain structure
if parsed.netloc and '.' in parsed.netloc:
return True
except:
pass
return False
def enhanced_fetch_url_content(url, enable_search_validation=False):
"""Enhanced URL content fetching with optional search validation"""
if not validate_url_domain(url):
return f"Invalid URL format: {url}"
try:
# Enhanced headers for better compatibility
headers = {
'User-Agent': 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/91.0.4472.124 Safari/537.36',
'Accept': 'text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8',
'Accept-Language': 'en-US,en;q=0.5',
'Accept-Encoding': 'gzip, deflate',
'Connection': 'keep-alive'
}
response = requests.get(url, timeout=15, headers=headers)
response.raise_for_status()
soup = BeautifulSoup(response.content, 'html.parser')
# Enhanced content cleaning
for element in soup(["script", "style", "nav", "header", "footer", "aside", "form", "button"]):
element.decompose()
# Extract main content preferentially
main_content = soup.find('main') or soup.find('article') or soup.find('div', class_=lambda x: bool(x and 'content' in x.lower())) or soup
text = main_content.get_text()
# Enhanced text cleaning
lines = (line.strip() for line in text.splitlines())
chunks = (phrase.strip() for line in lines for phrase in line.split(" "))
text = ' '.join(chunk for chunk in chunks if chunk and len(chunk) > 2)
# Smart truncation - try to end at sentence boundaries
if len(text) > 4000:
truncated = text[:4000]
last_period = truncated.rfind('.')
if last_period > 3000: # If we can find a reasonable sentence break
text = truncated[:last_period + 1]
else:
text = truncated + "..."
return text if text.strip() else "No readable content found at this URL"
except requests.exceptions.Timeout:
return f"Timeout error fetching {{url}} (15s limit exceeded)"
except requests.exceptions.RequestException as e:
return f"Error fetching {{url}}: {{str(e)}}"
except Exception as e:
return f"Error processing content from {{url}}: {{str(e)}}"
# Template for generated space app (based on mvp_simple.py)
SPACE_TEMPLATE = '''import gradio as gr
import tempfile
import os
import requests
import json
import re
from bs4 import BeautifulSoup
from datetime import datetime
import urllib.parse
# Configuration
SPACE_NAME = "{name}"
SPACE_DESCRIPTION = "{description}"
SYSTEM_PROMPT = """{system_prompt}"""
MODEL = "{model}"
GROUNDING_URLS = {grounding_urls}
# Get access code from environment variable for security
# If SPACE_ACCESS_CODE is not set, no access control is applied
ACCESS_CODE = os.environ.get("SPACE_ACCESS_CODE")
ENABLE_DYNAMIC_URLS = {enable_dynamic_urls}
# Get API key from environment - customizable variable name with validation
API_KEY = os.environ.get("{api_key_var}")
if API_KEY:
API_KEY = API_KEY.strip() # Remove any whitespace
if not API_KEY: # Check if empty after stripping
API_KEY = None
# API Key validation and logging
def validate_api_key():
"""Validate API key configuration with detailed logging"""
if not API_KEY:
print(f"⚠️ API KEY CONFIGURATION ERROR:")
print(f" Variable name: {api_key_var}")
print(f" Status: Not set or empty")
print(f" Action needed: Set '{api_key_var}' in HuggingFace Space secrets")
print(f" Expected format: sk-or-xxxxxxxxxx")
return False
elif not API_KEY.startswith('sk-or-'):
print(f"⚠️ API KEY FORMAT WARNING:")
print(f" Variable name: {api_key_var}")
print(f" Current value: {{API_KEY[:10]}}..." if len(API_KEY) > 10 else API_KEY)
print(f" Expected format: sk-or-xxxxxxxxxx")
print(f" Note: OpenRouter keys should start with 'sk-or-'")
return True # Still try to use it
else:
print(f"✅ API Key configured successfully")
print(f" Variable: {api_key_var}")
print(f" Format: Valid OpenRouter key")
return True
# Validate on startup
try:
API_KEY_VALID = validate_api_key()
except NameError:
# During template generation, API_KEY might not be defined yet
API_KEY_VALID = False
def validate_url_domain(url):
"""Basic URL domain validation"""
try:
from urllib.parse import urlparse
parsed = urlparse(url)
# Check for valid domain structure
if parsed.netloc and '.' in parsed.netloc:
return True
except:
pass
return False
def fetch_url_content(url):
"""Enhanced URL content fetching with improved compatibility and error handling"""
if not validate_url_domain(url):
return f"Invalid URL format: {{url}}"
try:
# Enhanced headers for better compatibility
headers = {{
'User-Agent': 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/91.0.4472.124 Safari/537.36',
'Accept': 'text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8',
'Accept-Language': 'en-US,en;q=0.5',
'Accept-Encoding': 'gzip, deflate',
'Connection': 'keep-alive'
}}
response = requests.get(url, timeout=15, headers=headers)
response.raise_for_status()
soup = BeautifulSoup(response.content, 'html.parser')
# Enhanced content cleaning
for element in soup(["script", "style", "nav", "header", "footer", "aside", "form", "button"]):
element.decompose()
# Extract main content preferentially
main_content = soup.find('main') or soup.find('article') or soup.find('div', class_=lambda x: bool(x and 'content' in x.lower())) or soup
text = main_content.get_text()
# Enhanced text cleaning
lines = (line.strip() for line in text.splitlines())
chunks = (phrase.strip() for line in lines for phrase in line.split(" "))
text = ' '.join(chunk for chunk in chunks if chunk and len(chunk) > 2)
# Smart truncation - try to end at sentence boundaries
if len(text) > 4000:
truncated = text[:4000]
last_period = truncated.rfind('.')
if last_period > 3000: # If we can find a reasonable sentence break
text = truncated[:last_period + 1]
else:
text = truncated + "..."
return text if text.strip() else "No readable content found at this URL"
except requests.exceptions.Timeout:
return f"Timeout error fetching {{url}} (15s limit exceeded)"
except requests.exceptions.RequestException as e:
return f"Error fetching {{url}}: {{str(e)}}"
except Exception as e:
return f"Error processing content from {{url}}: {{str(e)}}"
def extract_urls_from_text(text):
"""Extract URLs from text using regex with enhanced validation"""
import re
url_pattern = r'https?://[^\\s<>"{{}}|\\\\^`\\[\\]"]+'
urls = re.findall(url_pattern, text)
# Basic URL validation and cleanup
validated_urls = []
for url in urls:
# Remove trailing punctuation that might be captured
url = url.rstrip('.,!?;:')
# Basic domain validation
if '.' in url and len(url) > 10:
validated_urls.append(url)
return validated_urls
# Global cache for URL content to avoid re-crawling in generated spaces
_url_content_cache = {{}}
def get_grounding_context():
"""Fetch context from grounding URLs with caching"""
if not GROUNDING_URLS:
return ""
# Create cache key from URLs
cache_key = tuple(sorted([url for url in GROUNDING_URLS if url and url.strip()]))
# Check cache first
if cache_key in _url_content_cache:
return _url_content_cache[cache_key]
context_parts = []
for i, url in enumerate(GROUNDING_URLS, 1):
if url.strip():
content = fetch_url_content(url.strip())
# Add priority indicators
priority_label = "PRIMARY" if i <= 2 else "SECONDARY"
context_parts.append(f"[{{priority_label}}] Context from URL {{i}} ({{url}}):\\n{{content}}")
if context_parts:
result = "\\n\\n" + "\\n\\n".join(context_parts) + "\\n\\n"
else:
result = ""
# Cache the result
_url_content_cache[cache_key] = result
return result
def export_conversation_to_markdown(conversation_history):
"""Export conversation history to markdown format"""
if not conversation_history:
return "No conversation to export."
markdown_content = f"""# Conversation Export
Generated on: {{datetime.now().strftime('%Y-%m-%d %H:%M:%S')}}
---
"""
message_pair_count = 0
for i, message in enumerate(conversation_history):
if isinstance(message, dict):
role = message.get('role', 'unknown')
content = message.get('content', '')
if role == 'user':
message_pair_count += 1
markdown_content += f"## User Message {{message_pair_count}}\\n\\n{{content}}\\n\\n"
elif role == 'assistant':
markdown_content += f"## Assistant Response {{message_pair_count}}\\n\\n{{content}}\\n\\n---\\n\\n"
elif isinstance(message, (list, tuple)) and len(message) >= 2:
# Handle legacy tuple format: ["user msg", "assistant msg"]
message_pair_count += 1
user_msg, assistant_msg = message[0], message[1]
if user_msg:
markdown_content += f"## User Message {{message_pair_count}}\\n\\n{{user_msg}}\\n\\n"
if assistant_msg:
markdown_content += f"## Assistant Response {{message_pair_count}}\\n\\n{{assistant_msg}}\\n\\n---\\n\\n"
return markdown_content
def generate_response(message, history):
"""Generate response using OpenRouter API"""
# Enhanced API key validation with helpful messages
if not API_KEY:
error_msg = f"🔑 **API Key Required**\\n\\n"
error_msg += f"Please configure your OpenRouter API key:\\n"
error_msg += f"1. Go to Settings (⚙️) in your HuggingFace Space\\n"
error_msg += f"2. Click 'Variables and secrets'\\n"
error_msg += f"3. Add secret: **{api_key_var}**\\n"
error_msg += f"4. Value: Your OpenRouter API key (starts with `sk-or-`)\\n\\n"
error_msg += f"Get your API key at: https://openrouter.ai/keys"
print(f"❌ API request failed: No API key configured for {api_key_var}")
return error_msg
# Get grounding context
grounding_context = get_grounding_context()
# If dynamic URLs are enabled, check message for URLs to fetch
if ENABLE_DYNAMIC_URLS:
urls_in_message = extract_urls_from_text(message)
if urls_in_message:
# Fetch content from URLs mentioned in the message
dynamic_context_parts = []
for url in urls_in_message[:3]: # Limit to 3 URLs per message
content = fetch_url_content(url)
dynamic_context_parts.append(f"\\n\\nDynamic context from {{url}}:\\n{{content}}")
if dynamic_context_parts:
grounding_context += "\\n".join(dynamic_context_parts)
# Build enhanced system prompt with grounding context
enhanced_system_prompt = SYSTEM_PROMPT + grounding_context
# Build messages array for the API
messages = [{{"role": "system", "content": enhanced_system_prompt}}]
# Add conversation history - handle both modern messages format and legacy tuples
for chat in history:
if isinstance(chat, dict):
# Modern format: {{"role": "user", "content": "..."}} or {{"role": "assistant", "content": "..."}}
messages.append(chat)
elif isinstance(chat, (list, tuple)) and len(chat) >= 2:
# Legacy format: ["user msg", "assistant msg"] or ("user msg", "assistant msg")
user_msg, assistant_msg = chat[0], chat[1]
if user_msg:
messages.append({{"role": "user", "content": user_msg}})
if assistant_msg:
messages.append({{"role": "assistant", "content": assistant_msg}})
# Add current message
messages.append({{"role": "user", "content": message}})
# Make API request with enhanced error handling
try:
print(f"🔄 Making API request to OpenRouter...")
print(f" Model: {{MODEL}}")
print(f" Messages: {{len(messages)}} in conversation")
response = requests.post(
url="https://openrouter.ai/api/v1/chat/completions",
headers={{
"Authorization": f"Bearer {{API_KEY}}",
"Content-Type": "application/json",
"HTTP-Referer": "https://huggingface.co", # Required by some providers
"X-Title": "HuggingFace Space" # Helpful for tracking
}},
json={{
"model": MODEL,
"messages": messages,
"temperature": {temperature},
"max_tokens": {max_tokens}
}},
timeout=30
)
print(f"📡 API Response: {{response.status_code}}")
if response.status_code == 200:
try:
result = response.json()
# Enhanced validation of API response structure
if 'choices' not in result or not result['choices']:
print(f"⚠️ API response missing choices: {{result}}")
return "API Error: No response choices available"
elif 'message' not in result['choices'][0]:
print(f"⚠️ API response missing message: {{result}}")
return "API Error: No message in response"
elif 'content' not in result['choices'][0]['message']:
print(f"⚠️ API response missing content: {{result}}")
return "API Error: No content in message"
else:
content = result['choices'][0]['message']['content']
# Check for empty content
if not content or content.strip() == "":
print(f"⚠️ API returned empty content")
return "API Error: Empty response content"
print(f"✅ API request successful")
return content
except (KeyError, IndexError, json.JSONDecodeError) as e:
print(f"❌ Failed to parse API response: {{str(e)}}")
return f"API Error: Failed to parse response - {{str(e)}}"
elif response.status_code == 401:
error_msg = f"🔐 **Authentication Error**\\n\\n"
error_msg += f"Your API key appears to be invalid or expired.\\n\\n"
error_msg += f"**Troubleshooting:**\\n"
error_msg += f"1. Check that your **{api_key_var}** secret is set correctly\\n"
error_msg += f"2. Verify your API key at: https://openrouter.ai/keys\\n"
error_msg += f"3. Ensure your key starts with `sk-or-`\\n"
error_msg += f"4. Check that you have credits on your OpenRouter account"
print(f"❌ API authentication failed: {{response.status_code}} - {{response.text[:200]}}")
return error_msg
elif response.status_code == 429:
error_msg = f"⏱️ **Rate Limit Exceeded**\\n\\n"
error_msg += f"Too many requests. Please wait a moment and try again.\\n\\n"
error_msg += f"**Troubleshooting:**\\n"
error_msg += f"1. Wait 30-60 seconds before trying again\\n"
error_msg += f"2. Check your OpenRouter usage limits\\n"
error_msg += f"3. Consider upgrading your OpenRouter plan"
print(f"❌ Rate limit exceeded: {{response.status_code}}")
return error_msg
elif response.status_code == 400:
try:
error_data = response.json()
error_message = error_data.get('error', {{}}).get('message', 'Unknown error')
except:
error_message = response.text
error_msg = f"⚠️ **Request Error**\\n\\n"
error_msg += f"The API request was invalid:\\n"
error_msg += f"`{{error_message}}`\\n\\n"
if "model" in error_message.lower():
error_msg += f"**Model Issue:** The model `{{MODEL}}` may not be available.\\n"
error_msg += f"Try switching to a different model in your Space configuration."
print(f"❌ Bad request: {{response.status_code}} - {{error_message}}")
return error_msg
else:
error_msg = f"🚫 **API Error {{response.status_code}}**\\n\\n"
error_msg += f"An unexpected error occurred. Please try again.\\n\\n"
error_msg += f"If this persists, check:\\n"
error_msg += f"1. OpenRouter service status\\n"
error_msg += f"2. Your API key and credits\\n"
error_msg += f"3. The model availability"
print(f"❌ API error: {{response.status_code}} - {{response.text[:200]}}")
return error_msg
except requests.exceptions.Timeout:
error_msg = f"⏰ **Request Timeout**\\n\\n"
error_msg += f"The API request took too long (30s limit).\\n\\n"
error_msg += f"**Troubleshooting:**\\n"
error_msg += f"1. Try again with a shorter message\\n"
error_msg += f"2. Check your internet connection\\n"
error_msg += f"3. Try a different model"
print(f"❌ Request timeout after 30 seconds")
return error_msg
except requests.exceptions.ConnectionError:
error_msg = f"🌐 **Connection Error**\\n\\n"
error_msg += f"Could not connect to OpenRouter API.\\n\\n"
error_msg += f"**Troubleshooting:**\\n"
error_msg += f"1. Check your internet connection\\n"
error_msg += f"2. Check OpenRouter service status\\n"
error_msg += f"3. Try again in a few moments"
print(f"❌ Connection error to OpenRouter API")
return error_msg
except Exception as e:
error_msg = f"❌ **Unexpected Error**\\n\\n"
error_msg += f"An unexpected error occurred:\\n"
error_msg += f"`{{str(e)}}`\\n\\n"
error_msg += f"Please try again or contact support if this persists."
print(f"❌ Unexpected error: {{str(e)}}")
return error_msg
# Access code verification
access_granted = gr.State(False)
_access_granted_global = False # Global fallback
def verify_access_code(code):
\"\"\"Verify the access code\"\"\"
global _access_granted_global
if ACCESS_CODE is None:
_access_granted_global = True
return gr.update(visible=False), gr.update(visible=True), gr.update(value=True)
if code == ACCESS_CODE:
_access_granted_global = True
return gr.update(visible=False), gr.update(visible=True), gr.update(value=True)
else:
_access_granted_global = False
return gr.update(visible=True, value="❌ Incorrect access code. Please try again."), gr.update(visible=False), gr.update(value=False)
def protected_generate_response(message, history):
\"\"\"Protected response function that checks access\"\"\"
# Check if access is granted via the global variable
if ACCESS_CODE is not None and not _access_granted_global:
return "Please enter the access code to continue."
return generate_response(message, history)
# Global variable to store chat history for export
chat_history_store = []
def store_and_generate_response(message, history):
\"\"\"Wrapper function that stores history and generates response\"\"\"
global chat_history_store
# Generate response using the protected function
response = protected_generate_response(message, history)
# Convert current history to the format we need for export
# history comes in as [["user1", "bot1"], ["user2", "bot2"], ...]
chat_history_store = []
if history:
for exchange in history:
if isinstance(exchange, (list, tuple)) and len(exchange) >= 2:
chat_history_store.append({{"role": "user", "content": exchange[0]}})
chat_history_store.append({{"role": "assistant", "content": exchange[1]}})
# Add the current exchange
chat_history_store.append({{"role": "user", "content": message}})
chat_history_store.append({{"role": "assistant", "content": response}})
return response
def export_current_conversation():
\"\"\"Export the current conversation\"\"\"
if not chat_history_store:
return gr.update(visible=False)
markdown_content = export_conversation_to_markdown(chat_history_store)
# Save to temporary file
with tempfile.NamedTemporaryFile(mode='w', suffix='.md', delete=False, encoding='utf-8') as f:
f.write(markdown_content)
temp_file = f.name
return gr.update(value=temp_file, visible=True)
def export_conversation(history):
\"\"\"Export conversation to markdown file\"\"\"
if not history:
return gr.update(visible=False)
markdown_content = export_conversation_to_markdown(history)
# Save to temporary file
with tempfile.NamedTemporaryFile(mode='w', suffix='.md', delete=False, encoding='utf-8') as f:
f.write(markdown_content)
temp_file = f.name
return gr.update(value=temp_file, visible=True)
# Configuration status display
def get_configuration_status():
\"\"\"Generate a configuration status message for display\"\"\"
status_parts = []
if API_KEY_VALID:
status_parts.append("✅ **API Key:** Configured and valid")
else:
status_parts.append("❌ **API Key:** Not configured - Set `{api_key_var}` in Space secrets")
status_parts.append(f"🤖 **Model:** {{MODEL}}")
status_parts.append(f"🌡️ **Temperature:** {temperature}")
status_parts.append(f"📝 **Max Tokens:** {max_tokens}")
# URL Grounding details
if GROUNDING_URLS:
status_parts.append(f"🔗 **URL Grounding:** {{len(GROUNDING_URLS)}} URLs configured")
# Show first few URLs as examples
for i, url in enumerate(GROUNDING_URLS[:3], 1):
priority_label = "Primary" if i <= 2 else "Secondary"
status_parts.append(f" - [{{priority_label}}] {{url}}")
if len(GROUNDING_URLS) > 3:
status_parts.append(f" - ... and {{len(GROUNDING_URLS) - 3}} more URLs")
else:
status_parts.append("🔗 **URL Grounding:** No URLs configured")
if ENABLE_DYNAMIC_URLS:
status_parts.append("🔄 **Dynamic URLs:** Enabled")
else:
status_parts.append("🔄 **Dynamic URLs:** Disabled")
if ACCESS_CODE is not None:
status_parts.append("🔐 **Access Control:** Enabled")
else:
status_parts.append("🌐 **Access:** Public Chatbot")
# System Prompt (add at the end)
status_parts.append("") # Empty line for spacing
status_parts.append("**System Prompt:**")
status_parts.append(f"{{SYSTEM_PROMPT}}")
return "\\n".join(status_parts)
# Create interface with access code protection
with gr.Blocks(title=SPACE_NAME) as demo:
gr.Markdown(f"# {{SPACE_NAME}}")
gr.Markdown(SPACE_DESCRIPTION)
# Access code section (shown only if ACCESS_CODE is set)
with gr.Column(visible=(ACCESS_CODE is not None)) as access_section:
gr.Markdown("### 🔐 Access Required")
gr.Markdown("Please enter the access code provided by your instructor:")
access_input = gr.Textbox(
label="Access Code",
placeholder="Enter access code...",
type="password"
)
access_btn = gr.Button("Submit", variant="primary")
access_error = gr.Markdown(visible=False)
# Main chat interface (hidden until access granted)
with gr.Column(visible=(ACCESS_CODE is None)) as chat_section:
chat_interface = gr.ChatInterface(
fn=store_and_generate_response, # Use wrapper function to store history
title="", # Title already shown above
description="", # Description already shown above
examples={examples},
type="messages" # Use modern message format for better compatibility
)
# Export functionality
with gr.Row():
export_btn = gr.Button("📥 Export Conversation", variant="secondary", size="sm")
export_file = gr.File(label="Download Conversation", visible=False)
# Connect export functionality
export_btn.click(
export_current_conversation,
outputs=[export_file]
)
# Configuration status (always visible)
with gr.Accordion("📊 Configuration Status", open=not API_KEY_VALID):
gr.Markdown(get_configuration_status())
# Connect access verification
if ACCESS_CODE is not None:
access_btn.click(
verify_access_code,
inputs=[access_input],
outputs=[access_error, chat_section, access_granted]
)
access_input.submit(
verify_access_code,
inputs=[access_input],
outputs=[access_error, chat_section, access_granted]
)
if __name__ == "__main__":
demo.launch()
'''
# Available models - Updated with valid OpenRouter model IDs
MODELS = [
"google/gemini-2.0-flash-001", # Fast, reliable, general tasks
"google/gemma-3-27b-it", # High-performance open model
"anthropic/claude-3.5-haiku", # Complex reasoning and analysis
"openai/gpt-4o-mini-search-preview", # Balanced performance and cost with search
"openai/gpt-4.1-nano", # Lightweight OpenAI model
"nvidia/llama-3.1-nemotron-70b-instruct", # Large open-source model
"mistralai/devstral-small" # Coding-focused model
]
def get_grounding_context(urls):
"""Fetch context from grounding URLs"""
if not urls:
return ""
context_parts = []
for i, url in enumerate(urls, 1):
if url and url.strip():
content = enhanced_fetch_url_content(url.strip())
# Add priority indicators
priority_label = "PRIMARY" if i <= 2 else "SECONDARY"
context_parts.append(f"[{priority_label}] Context from URL {i} ({url}):\n{content}")
if context_parts:
return "\n\n" + "\n\n".join(context_parts) + "\n\n"
return ""
def create_readme(config):
"""Generate README with deployment instructions and proper HF Spaces YAML header"""
# Ensure short_description is a proper string and within HF's 60-character limit
description = config.get('description', '') or 'AI chat interface'
if len(description) > 60:
short_desc = description[:57] + '...' # 57 + 3 = 60 characters total
else:
short_desc = description
return f"""---
title: {config['name']}
emoji: 🤖
colorFrom: blue
colorTo: red
sdk: gradio
sdk_version: 5.38.0
app_file: app.py
pinned: false
license: mit
short_description: "{short_desc}"
---
# {config['name']}
{config['description']}
## Quick Deploy to HuggingFace Spaces
### Step 1: Create the Space
1. Go to https://huggingface.co/spaces
2. Click "Create new Space"
3. Choose a name for your Space
4. Select **Gradio** as the SDK
5. Set visibility (Public/Private)
6. Click "Create Space"
### Step 2: Upload Files
1. In your new Space, click "Files" tab
2. Upload these files from the zip:
- `app.py`
- `requirements.txt`
3. Wait for "Building" to complete
### Step 3: Add API Key
1. Go to Settings (gear icon)
2. Click "Variables and secrets"
3. Click "New secret"
4. Name: `{config['api_key_var']}`
5. Value: Your OpenRouter API key
6. Click "Add"
{f'''### Step 4: Configure Access Control
Your Space is configured with access code protection. Students will need to enter the access code to use the chatbot.
1. Go to Settings (gear icon)
2. Click "Variables and secrets"
3. Click "New secret"
4. Name: `SPACE_ACCESS_CODE`
5. Value: `{config['access_code']}`
6. Click "Add"
**Important**: The access code is now stored securely as an environment variable and is not visible in your app code.
To disable access protection:
1. Go to Settings → Variables and secrets
2. Delete the `SPACE_ACCESS_CODE` secret
3. The Space will rebuild automatically with no access protection
''' if config['access_code'] else ''}
### Step {4 if not config['access_code'] else 5}: Get Your API Key
1. Go to https://openrouter.ai/keys
2. Sign up/login if needed
3. Click "Create Key"
4. Copy the key (starts with `sk-or-`)
### Step {5 if not config['access_code'] else 6}: Test Your Space
- Go back to "App" tab
- Your Space should be running!
- Try the example prompts or ask a question
## Configuration
- **Model**: {config['model']}
- **Temperature**: {config['temperature']}
- **Max Tokens**: {config['max_tokens']}
- **API Key Variable**: {config['api_key_var']}"""
# Add optional configuration items
if config['access_code']:
readme_content += f"""
- **Access Code**: {config['access_code']} (Students need this to access the chatbot)"""
if config.get('enable_dynamic_urls'):
readme_content += """
- **Dynamic URL Fetching**: Enabled (Assistant can fetch URLs mentioned in conversations)"""
readme_content += f"""
## Customization
To modify your Space:
1. Edit `app.py` in your Space
2. Update configuration variables at the top
3. Changes deploy automatically
## Troubleshooting
- **"Please set your {config['api_key_var']}"**: Add the secret in Space settings
- **Error 401**: Invalid API key or no credits
- **Error 429**: Rate limit - wait and try again
- **Build failed**: Check requirements.txt formatting
## More Help
- HuggingFace Spaces: https://huggingface.co/docs/hub/spaces
- OpenRouter Docs: https://openrouter.ai/docs
- Gradio Docs: https://gradio.app/docs
---
Generated on {datetime.now().strftime('%Y-%m-%d %H:%M:%S')} with Chat U/I Helper
"""
return readme_content
def create_requirements():
"""Generate requirements.txt with latest versions"""
return "gradio>=5.38.0\nrequests>=2.32.3\nbeautifulsoup4>=4.12.3\npython-dotenv>=1.0.0"
def generate_zip(name, description, system_prompt, model, api_key_var, temperature, max_tokens, examples_text, access_code_field="", enable_dynamic_urls=False, url1="", url2="", url3="", url4="", url5="", url6="", url7="", url8="", url9="", url10=""):
"""Generate deployable zip file"""
# Process examples
if examples_text and examples_text.strip():
examples_list = [ex.strip() for ex in examples_text.split('\n') if ex.strip()]
examples_python = repr(examples_list) # Convert to Python literal representation
else:
examples_python = repr([
"Hello! How can you help me?",
"Tell me something interesting",
"What can you do?"
])
# Process grounding URLs
grounding_urls = []
for url in [url1, url2, url3, url4, url5, url6, url7, url8, url9, url10]:
if url and url.strip():
grounding_urls.append(url.strip())
# Use the provided system prompt directly
# Create config
config = {
'name': name,
'description': description,
'system_prompt': system_prompt,
'model': model,
'api_key_var': api_key_var,
'temperature': temperature,
'max_tokens': int(max_tokens),
'examples': examples_python,
'grounding_urls': json.dumps(grounding_urls),
'enable_dynamic_urls': enable_dynamic_urls
}
# Generate files
app_content = SPACE_TEMPLATE.format(**config)
# Pass empty access_code to README since user will configure it in HF Spaces
readme_config = config.copy()
readme_config['access_code'] = "" # Always empty since user configures in HF Spaces
readme_content = create_readme(readme_config)
requirements_content = create_requirements()
# Create zip file with clean naming
filename = f"{name.lower().replace(' ', '_').replace('-', '_')}.zip"
# Create zip in memory and save to disk
zip_buffer = io.BytesIO()
with zipfile.ZipFile(zip_buffer, 'w', zipfile.ZIP_DEFLATED) as zip_file:
zip_file.writestr('app.py', app_content)
zip_file.writestr('requirements.txt', requirements_content)
zip_file.writestr('README.md', readme_content)
zip_file.writestr('config.json', json.dumps(config, indent=2))
# Write zip to file
zip_buffer.seek(0)
with open(filename, 'wb') as f:
f.write(zip_buffer.getvalue())
return filename
# Define callback functions outside the interface
def update_sandbox_preview(config_data):
"""Update the sandbox preview with generated content"""
if not config_data:
return "Generate a space configuration to see preview here.", "<div style='text-align: center; padding: 50px; color: #666;'>No preview available</div>"
# Create preview info
preview_text = f"""**Space Configuration:**
- **Name:** {config_data.get('name', 'N/A')}
- **Model:** {config_data.get('model', 'N/A')}
- **Temperature:** {config_data.get('temperature', 'N/A')}
- **Max Tokens:** {config_data.get('max_tokens', 'N/A')}
- **Dynamic URLs:** {'✅ Enabled' if config_data.get('enable_dynamic_urls') else '❌ Disabled'}
**System Prompt Preview:**
> {config_data.get('system_prompt', 'No system prompt configured')[:500]}{'...' if len(config_data.get('system_prompt', '')) > 500 else ''}
**Deployment Package:** `{config_data.get('filename', 'Not generated')}`"""
# Create a basic HTML preview of the chat interface
preview_html = f"""
<div style="border: 1px solid #ddd; border-radius: 8px; padding: 20px; background: white;">
<h3 style="margin-top: 0; color: #333;">{config_data.get('name', 'Chat Interface')}</h3>
<p style="color: #666; margin-bottom: 20px;">{config_data.get('description', 'A customizable AI chat interface')}</p>
<div style="border: 1px solid #ccc; border-radius: 4px; background: white; min-height: 200px; padding: 15px; margin-bottom: 15px;">
<div style="color: #888; text-align: center; padding: 50px 0;">Chat Interface Preview</div>
<div style="background: #f0f8ff; padding: 10px; border-radius: 4px; margin-bottom: 10px; border-left: 3px solid #0066cc;">
<strong>Assistant:</strong> Hello! I'm ready to help you. How can I assist you today?
</div>
</div>
<div style="border: 1px solid #ccc; border-radius: 4px; padding: 10px; background: white;">
<input type="text" placeholder="Type your message here..." style="width: 70%; padding: 8px; border: 1px solid #ddd; border-radius: 4px; margin-right: 10px;">
<button style="padding: 8px 15px; background: #0066cc; color: white; border: none; border-radius: 4px; cursor: pointer;">Send</button>
</div>
<div style="margin-top: 15px; padding: 10px; background: white; border: 1px solid #e0e0e0; border-radius: 4px; font-size: 12px; color: #666;">
<strong>Configuration:</strong> Model: {config_data.get('model', 'N/A')} | Temperature: {config_data.get('temperature', 'N/A')} | Max Tokens: {config_data.get('max_tokens', 'N/A')}
</div>
</div>
"""
return preview_text, preview_html
def on_preview_combined(name, description, system_prompt, model, temperature, max_tokens, examples_text, enable_dynamic_urls, url1="", url2="", url3="", url4="", url5="", url6="", url7="", url8="", url9="", url10=""):
"""Generate configuration and return preview updates"""
if not name or not name.strip():
return (
{},
gr.update(value="**Error:** Please provide a Space Title to preview", visible=True),
gr.update(visible=False),
gr.update(value="Configuration will appear here after preview generation."),
*[gr.update() for _ in range(10)], # 10 URL updates
gr.update(), # preview_add_url_btn
gr.update(), # preview_remove_url_btn
2, # preview_url_count
*[gr.update(visible=False) for _ in range(3)] # 3 example button updates
)
try:
# Use the system prompt directly (template selector already updates it)
if not system_prompt or not system_prompt.strip():
return (
{},
gr.update(value="**Error:** Please provide a System Prompt for the assistant", visible=True),
gr.update(visible=False),
gr.update(value="Configuration will appear here after preview generation."),
*[gr.update() for _ in range(10)], # 10 URL updates
gr.update(), # preview_add_url_btn
gr.update(), # preview_remove_url_btn
2, # preview_url_count
*[gr.update(visible=False) for _ in range(3)] # 3 example button updates
)
final_system_prompt = system_prompt.strip()
# Process examples like the deployment package
if examples_text and examples_text.strip():
examples_list = [ex.strip() for ex in examples_text.split('\n') if ex.strip()]
else:
examples_list = [
"Hello! How can you help me?",
"Tell me something interesting",
"What can you do?"
]
# Create configuration for preview
config_data = {
'name': name,
'description': description,
'system_prompt': final_system_prompt,
'model': model,
'temperature': temperature,
'max_tokens': max_tokens,
'enable_dynamic_urls': enable_dynamic_urls,
'url1': url1,
'url2': url2,
'url3': url3,
'url4': url4,
'url5': url5,
'url6': url6,
'url7': url7,
'url8': url8,
'url9': url9,
'url10': url10,
'examples_text': examples_text,
'examples_list': examples_list, # Processed examples for preview
'preview_ready': True
}
# Generate preview displays with example prompts
examples_preview = "\n".join([f"• {ex}" for ex in examples_list[:3]]) # Show first 3 examples
preview_text = f"""**{name}** is ready to test. Use the example prompts below or type your own message."""
config_display = f"""> **Configuration**:
- **Name:** {name}
- **Description:** {description or 'No description provided'}
- **Model:** {model}
- **Temperature:** {temperature}
- **Max Response Tokens:** {max_tokens}
**System Prompt:**
{final_system_prompt}
**Example Prompts:**
{examples_text if examples_text and examples_text.strip() else 'No example prompts configured'}
"""
# Show success notification
gr.Info(f"✅ Preview generated successfully for '{name}'! Switch to Preview tab.")
# Determine how many URLs are configured
all_urls = [url1, url2, url3, url4, url5, url6, url7, url8, url9, url10]
url_count = 2 # Start with 2 (always visible)
for i, url in enumerate(all_urls[2:], start=3): # Check urls 3-10
if url and url.strip():
url_count = i
else:
break
# Create URL updates for all preview URLs
url_updates = []
for i in range(1, 11): # URLs 1-10
url_value = all_urls[i-1] if i <= len(all_urls) else ""
if i <= 2: # URLs 1-2 are always visible
url_updates.append(gr.update(value=url_value))
else: # URLs 3-10
url_updates.append(gr.update(value=url_value, visible=(i <= url_count)))
# Update button states
secondary_count = url_count - 2 # Number of secondary URLs
if url_count >= 10:
preview_add_btn_update = gr.update(value="Max Secondary URLs (8/8)", interactive=False)
else:
preview_add_btn_update = gr.update(value=f"+ Add Secondary URLs ({secondary_count}/8)", interactive=True)
preview_remove_btn_update = gr.update(visible=(url_count > 2))
# Update example buttons
example_btn_updates = []
for i in range(3):
if i < len(examples_list):
# Add click icon and truncate text nicely
btn_text = f"💬 {examples_list[i][:45]}{'...' if len(examples_list[i]) > 45 else ''}"
example_btn_updates.append(gr.update(value=btn_text, visible=True))
else:
example_btn_updates.append(gr.update(visible=False))
return (
config_data,
gr.update(value=preview_text, visible=True),
gr.update(visible=True),
gr.update(value=config_display),
*url_updates, # Unpack all 10 URL updates
preview_add_btn_update,
preview_remove_btn_update,
url_count,
*example_btn_updates # Add example button updates
)
except Exception as e:
return (
{},
gr.update(value=f"**Error:** {str(e)}", visible=True),
gr.update(visible=False),
gr.update(value="Configuration will appear here after preview generation."),
*[gr.update() for _ in range(10)], # 10 URL updates
gr.update(), # preview_add_url_btn
gr.update(), # preview_remove_url_btn
2, # preview_url_count
*[gr.update(visible=False) for _ in range(3)] # 3 example button updates
)
def update_preview_display(config_data):
"""Update preview display based on config data"""
if not config_data or not config_data.get('preview_ready'):
return (
gr.update(value="**Status:** Configure your space in the Configuration tab and click 'Preview Deployment Package' to see your assistant here.", visible=True),
gr.update(visible=False),
gr.update(value="Configuration will appear here after preview generation.")
)
# Generate example prompts display
examples_list = config_data.get('examples_list', [])
examples_preview = "\n".join([f"• {ex}" for ex in examples_list[:3]]) # Show first 3 examples
preview_text = f"""**{config_data['name']}** is ready to test. Use the example prompts below or type your own message."""
config_display = f"""### Current Configuration
**Space Details:**
- **Name:** {config_data['name']}
- **Description:** {config_data.get('description', 'No description provided')}
**Model Settings:**
- **Model:** {config_data['model']}
- **Temperature:** {config_data['temperature']}
- **Max Response Tokens:** {config_data['max_tokens']}
**Features:**
- **Dynamic URL Fetching:** {'✅ Enabled' if config_data['enable_dynamic_urls'] else '❌ Disabled'}
**System Prompt:**
{config_data['system_prompt']}
**Example Prompts:**
{config_data.get('examples_text', 'No example prompts configured') if config_data.get('examples_text', '').strip() else 'No example prompts configured'}
"""
return (
gr.update(value=preview_text, visible=True),
gr.update(visible=True),
gr.update(value=config_display)
)
def preview_chat_response(message, history, config_data, url1="", url2="", url3="", url4="", url5="", url6="", url7="", url8="", url9="", url10=""):
"""Generate response for preview chat using actual OpenRouter API"""
if not config_data or not message:
return "", history
# Get API key from environment
api_key = os.environ.get("OPENROUTER_API_KEY")
if not api_key:
response = f"""🔑 **API Key Required for Preview**
To test your assistant with real API responses, please:
1. Get your OpenRouter API key from: https://openrouter.ai/keys
2. Set it as an environment variable: `export OPENROUTER_API_KEY=your_key_here`
3. Or add it to your `.env` file: `OPENROUTER_API_KEY=your_key_here`
**Your Configuration:**
- **Name:** {config_data.get('name', 'your assistant')}
- **Model:** {config_data.get('model', 'unknown model')}
- **Temperature:** {config_data.get('temperature', 0.7)}
- **Max Tokens:** {config_data.get('max_tokens', 500)}
**System Prompt Preview:**
{config_data.get('system_prompt', '')[:200]}{'...' if len(config_data.get('system_prompt', '')) > 200 else ''}
Once you set your API key, you'll be able to test real conversations in this preview."""
history.append({"role": "user", "content": message})
history.append({"role": "assistant", "content": response})
return "", history
try:
# Get grounding context from URLs - prioritize config_data URLs, fallback to preview tab URLs
config_urls = [
config_data.get('url1', ''),
config_data.get('url2', ''),
config_data.get('url3', ''),
config_data.get('url4', ''),
config_data.get('url5', ''),
config_data.get('url6', ''),
config_data.get('url7', ''),
config_data.get('url8', ''),
config_data.get('url9', ''),
config_data.get('url10', '')
]
# Use config URLs if available, otherwise use preview tab URLs
grounding_urls = config_urls if any(url for url in config_urls if url) else [url1, url2, url3, url4, url5, url6, url7, url8, url9, url10]
grounding_context = get_cached_grounding_context([url for url in grounding_urls if url and url.strip()])
# If dynamic URLs are enabled, check message for URLs to fetch
dynamic_context = ""
if config_data.get('enable_dynamic_urls'):
urls_in_message = extract_urls_from_text(message)
if urls_in_message:
dynamic_context_parts = []
for url in urls_in_message[:3]: # Increased limit to 3 URLs with enhanced processing
content = enhanced_fetch_url_content(url)
dynamic_context_parts.append(f"\n\nDynamic context from {url}:\n{content}")
if dynamic_context_parts:
dynamic_context = "\n".join(dynamic_context_parts)
# Build enhanced system prompt with all contexts
enhanced_system_prompt = config_data.get('system_prompt', '') + grounding_context + dynamic_context
# Build messages array for the API
messages = [{"role": "system", "content": enhanced_system_prompt}]
# Add conversation history - handle both formats for backwards compatibility
for chat in history:
if isinstance(chat, dict):
# New format: {"role": "user", "content": "..."}
messages.append(chat)
elif isinstance(chat, list) and len(chat) >= 2:
# Legacy format: [user_msg, assistant_msg]
user_msg, assistant_msg = chat[0], chat[1]
if user_msg:
messages.append({"role": "user", "content": user_msg})
if assistant_msg:
messages.append({"role": "assistant", "content": assistant_msg})
# Add current message
messages.append({"role": "user", "content": message})
# Debug: Log the request being sent
request_payload = {
"model": config_data.get('model', 'google/gemini-2.0-flash-001'),
"messages": messages,
"temperature": config_data.get('temperature', 0.7),
"max_tokens": config_data.get('max_tokens', 500),
"tools": None # Explicitly disable tool/function calling
}
# Make API request to OpenRouter
response = requests.post(
url="https://openrouter.ai/api/v1/chat/completions",
headers={
"Authorization": f"Bearer {api_key}",
"Content-Type": "application/json"
},
json=request_payload,
timeout=30
)
if response.status_code == 200:
try:
response_data = response.json()
# Check if response has expected structure
if 'choices' not in response_data or not response_data['choices']:
assistant_response = f"[Preview Debug] No choices in API response. Response: {response_data}"
elif 'message' not in response_data['choices'][0]:
assistant_response = f"[Preview Debug] No message in first choice. Response: {response_data}"
elif 'content' not in response_data['choices'][0]['message']:
assistant_response = f"[Preview Debug] No content in message. Response: {response_data}"
else:
assistant_content = response_data['choices'][0]['message']['content']
# Debug: Check if content is empty
if not assistant_content or assistant_content.strip() == "":
assistant_response = f"[Preview Debug] Empty content from API. Messages sent: {len(messages)} messages, last user message: '{message}', model: {request_payload['model']}"
else:
# Use the content directly - no preview indicator needed
assistant_response = assistant_content
except (KeyError, IndexError, json.JSONDecodeError) as e:
assistant_response = f"[Preview Error] Failed to parse API response: {str(e)}. Raw response: {response.text[:500]}"
else:
assistant_response = f"[Preview Error] API Error: {response.status_code} - {response.text[:500]}"
except Exception as e:
assistant_response = f"[Preview Error] {str(e)}"
# Return in the new messages format for Gradio 5.x
history.append({"role": "user", "content": message})
history.append({"role": "assistant", "content": assistant_response})
return "", history
def clear_preview_chat():
"""Clear preview chat"""
return "", []
def set_example_prompt(example_text):
"""Set example prompt in the text input"""
return example_text
def export_preview_conversation(history, config_data=None):
"""Export preview conversation to markdown"""
if not history:
return gr.update(visible=False)
markdown_content = export_conversation_to_markdown(history, config_data)
# Save to temporary file
import tempfile
with tempfile.NamedTemporaryFile(mode='w', suffix='.md', delete=False) as f:
f.write(markdown_content)
temp_file = f.name
return gr.update(value=temp_file, visible=True)
def on_generate(name, description, system_prompt, model, api_key_var, temperature, max_tokens, examples_text, access_code, enable_dynamic_urls, url1, url2, url3, url4, url5, url6, url7, url8, url9, url10):
if not name or not name.strip():
return gr.update(value="Error: Please provide a Space Title", visible=True), gr.update(visible=False), {}
try:
# Use the system prompt directly (template selector already updates it)
if not system_prompt or not system_prompt.strip():
return gr.update(value="Error: Please provide a System Prompt for the assistant", visible=True), gr.update(visible=False), {}
final_system_prompt = system_prompt.strip()
filename = generate_zip(name, description, final_system_prompt, model, api_key_var, temperature, max_tokens, examples_text, access_code, enable_dynamic_urls, url1, url2, url3, url4, url5, url6, url7, url8, url9, url10)
success_msg = f"""**Deployment package ready!**
**File**: `{filename}`
**What's included:**
- `app.py` - Ready-to-deploy chat interface (Gradio 5.38.0)
- `requirements.txt` - Latest dependencies
- `README.md` - HuggingFace Spaces configuration & instructions
- `config.json` - Configuration backup
**Next steps:**
1. Download the zip file below
2. Go to https://huggingface.co/spaces and create a new Space
3. Upload ALL files from the zip to your Space (including README.md)
4. Set your `{api_key_var}` secret in Space settings
**Your Space will be live in minutes!**"""
# Update sandbox preview
config_data = {
'name': name,
'description': description,
'system_prompt': final_system_prompt,
'model': model,
'temperature': temperature,
'max_tokens': max_tokens,
'enable_dynamic_urls': enable_dynamic_urls,
'filename': filename
}
return gr.update(value=success_msg, visible=True), gr.update(value=filename, visible=True), config_data
except Exception as e:
return gr.update(value=f"Error: {str(e)}", visible=True), gr.update(visible=False), {}
# Global cache for URL content to avoid re-crawling
url_content_cache = {}
def get_cached_grounding_context(urls):
"""Get grounding context with caching to avoid re-crawling same URLs"""
if not urls:
return ""
# Filter valid URLs
valid_urls = [url for url in urls if url and url.strip()]
if not valid_urls:
return ""
# Create cache key from sorted URLs
cache_key = tuple(sorted(valid_urls))
# Check if we already have this content cached
if cache_key in url_content_cache:
return url_content_cache[cache_key]
# If not cached, fetch using simple HTTP requests
grounding_context = get_grounding_context_simple(valid_urls)
# Cache the result
url_content_cache[cache_key] = grounding_context
return grounding_context
def respond(message, chat_history, url1="", url2="", url3="", url4="", url5="", url6="", url7="", url8="", url9="", url10=""):
# Make actual API request to OpenRouter
import os
import requests
# Get API key from environment
api_key = os.environ.get("OPENROUTER_API_KEY")
if not api_key:
response = "Please set your OPENROUTER_API_KEY in the Space settings to use the chat support."
chat_history.append({"role": "user", "content": message})
chat_history.append({"role": "assistant", "content": response})
return "", chat_history
# Get grounding context from URLs using cached approach
grounding_urls = [url1, url2, url3, url4, url5, url6, url7, url8, url9, url10]
grounding_context = get_cached_grounding_context(grounding_urls)
# Build enhanced system prompt with grounding context
base_system_prompt = """You are an expert assistant specializing in Gradio configurations for HuggingFace Spaces. You have deep knowledge of:
- Gradio interface components and layouts
- HuggingFace Spaces configuration (YAML frontmatter, secrets, environment variables)
- Deployment best practices for Gradio apps on HuggingFace
- Space settings, SDK versions, and hardware requirements
- Troubleshooting common Gradio and HuggingFace Spaces issues
- Integration with various APIs and models through Gradio interfaces
Provide specific, technical guidance focused on Gradio implementation details and HuggingFace Spaces deployment. Include code examples when relevant. Keep responses concise and actionable."""
enhanced_system_prompt = base_system_prompt + grounding_context
# Build conversation history for API
messages = [{
"role": "system",
"content": enhanced_system_prompt
}]
# Add conversation history - Support both new messages format and legacy tuple format
for chat in chat_history:
if isinstance(chat, dict):
# New format: {"role": "user", "content": "..."}
messages.append(chat)
elif isinstance(chat, (list, tuple)) and len(chat) >= 2:
# Legacy format: ("user msg", "bot msg")
user_msg, assistant_msg = chat[0], chat[1]
if user_msg:
messages.append({"role": "user", "content": user_msg})
if assistant_msg:
messages.append({"role": "assistant", "content": assistant_msg})
# Add current message
messages.append({"role": "user", "content": message})
try:
# Make API request to OpenRouter
response = requests.post(
url="https://openrouter.ai/api/v1/chat/completions",
headers={
"Authorization": f"Bearer {api_key}",
"Content-Type": "application/json"
},
json={
"model": "google/gemini-2.0-flash-001",
"messages": messages,
"temperature": 0.7,
"max_tokens": 500
}
)
if response.status_code == 200:
assistant_response = response.json()['choices'][0]['message']['content']
else:
assistant_response = f"Error: {response.status_code} - {response.text}"
except Exception as e:
assistant_response = f"Error: {str(e)}"
chat_history.append({"role": "user", "content": message})
chat_history.append({"role": "assistant", "content": assistant_response})
return "", chat_history
def clear_chat():
return "", []
def add_urls(count):
"""Show additional URL fields"""
new_count = min(count + 1, 10)
# Create visibility updates for all URL fields (3-10)
url_updates = []
for i in range(3, 11): # URLs 3-10
if i <= new_count:
url_updates.append(gr.update(visible=True))
else:
url_updates.append(gr.update(visible=False))
# Update button states
secondary_count = new_count - 2 # Number of secondary URLs
if new_count >= 10:
add_btn_update = gr.update(value="Max Secondary URLs (8/8)", interactive=False)
else:
add_btn_update = gr.update(value=f"+ Add Secondary URLs ({secondary_count}/8)")
remove_btn_update = gr.update(visible=True)
return (*url_updates, add_btn_update, remove_btn_update, new_count)
def remove_urls(count):
"""Hide URL fields"""
new_count = max(count - 1, 4)
# Create visibility updates for all URL fields (3-10)
url_updates = []
for i in range(3, 11): # URLs 3-10
if i <= new_count:
url_updates.append(gr.update(visible=True))
else:
url_updates.append(gr.update(visible=False, value=""))
# Update button states
secondary_count = new_count - 2 # Number of secondary URLs
add_btn_update = gr.update(value=f"+ Add Secondary URLs ({secondary_count}/8)", interactive=True)
if new_count <= 4:
remove_btn_update = gr.update(visible=False)
else:
remove_btn_update = gr.update(visible=True)
return (*url_updates, add_btn_update, remove_btn_update, new_count)
def toggle_template(template_choice, current_prompt, cached_custom_prompt):
"""Toggle between different assistant templates"""
# If we're switching away from "None", cache the current custom prompt
if template_choice != "None" and current_prompt and current_prompt.strip():
# Check if the current prompt is not a template prompt
research_prompt = "You are a research aid specializing in academic literature search and analysis. Your expertise spans discovering peer-reviewed sources, assessing research methodologies, synthesizing findings across studies, and delivering properly formatted citations. When responding, anchor claims in specific sources from provided URL contexts, differentiate between direct evidence and interpretive analysis, and note any limitations or contradictory results. Employ clear, accessible language that demystifies complex research, and propose connected research directions when appropriate. Your purpose is to serve as an informed research tool supporting users through initial concept development, exploratory investigation, information collection, and source compilation."
socratic_prompt = "You are a pedagogically-minded academic assistant designed for introductory courses. Your approach follows constructivist learning principles: build on students' prior knowledge, scaffold complex concepts through graduated questioning, and use Socratic dialogue to guide discovery. Provide concise, evidence-based explanations that connect theory to lived experiences. Each response should model critical thinking by acknowledging multiple perspectives, identifying assumptions, and revealing conceptual relationships. Conclude with open-ended questions that promote higher-order thinking—analysis, synthesis, or evaluation—rather than recall."
# Only cache if it's not one of the template prompts
if current_prompt != research_prompt and current_prompt != socratic_prompt:
cached_custom_prompt = current_prompt
if template_choice == "Research Template":
research_prompt = "You are a research aid specializing in academic literature search and analysis. Your expertise spans discovering peer-reviewed sources, assessing research methodologies, synthesizing findings across studies, and delivering properly formatted citations. When responding, anchor claims in specific sources from provided URL contexts, differentiate between direct evidence and interpretive analysis, and note any limitations or contradictory results. Employ clear, accessible language that demystifies complex research, and propose connected research directions when appropriate. Your purpose is to serve as an informed research tool supporting users through initial concept development, exploratory investigation, information collection, and source compilation."
return (
gr.update(value=research_prompt), # Update main system prompt
gr.update(value=True), # Enable dynamic URL fetching for research template
cached_custom_prompt # Return the cached prompt
)
elif template_choice == "Socratic Template":
socratic_prompt = "You are a pedagogically-minded academic assistant designed for introductory courses. Your approach follows constructivist learning principles: build on students' prior knowledge, scaffold complex concepts through graduated questioning, and use Socratic dialogue to guide discovery. Provide concise, evidence-based explanations that connect theory to lived experiences. Each response should model critical thinking by acknowledging multiple perspectives, identifying assumptions, and revealing conceptual relationships. Conclude with open-ended questions that promote higher-order thinking—analysis, synthesis, or evaluation—rather than recall."
return (
gr.update(value=socratic_prompt), # Update main system prompt
gr.update(value=False), # Socratic template doesn't need dynamic URLs by default
cached_custom_prompt # Return the cached prompt
)
else: # "None" or any other value
# Restore the cached custom prompt if we have one
prompt_value = cached_custom_prompt if cached_custom_prompt else ""
return (
gr.update(value=prompt_value), # Restore cached prompt or clear
gr.update(value=False), # Disable dynamic URL setting
cached_custom_prompt # Return the cached prompt
)
# Create Gradio interface with proper tab structure and fixed configuration
with gr.Blocks(
title="Chat U/I Helper",
css="""
/* Custom CSS to fix styling issues */
.gradio-container {
max-width: 1200px !important;
margin: 0 auto;
}
/* Fix tab styling */
.tab-nav {
border-bottom: 1px solid #e0e0e0;
}
/* Fix button styling */
.btn {
border-radius: 6px;
}
/* Fix chat interface styling */
.chat-interface {
border-radius: 8px;
border: 1px solid #e0e0e0;
}
/* Hide gradio footer to avoid manifest issues */
.gradio-footer {
display: none !important;
}
/* Fix accordion styling */
.accordion {
border: 1px solid #e0e0e0;
border-radius: 6px;
}
""",
theme="default",
head="""
<style>
/* Additional head styles to prevent manifest issues */
.gradio-app {
background: #ffffff;
}
</style>
""",
js="""
function() {
// Prevent manifest.json requests and other common errors
if (typeof window !== 'undefined') {
// Override fetch to handle manifest.json requests
const originalFetch = window.fetch;
window.fetch = function(url, options) {
// Handle both string URLs and URL objects
const urlString = typeof url === 'string' ? url : url.toString();
if (urlString.includes('manifest.json')) {
return Promise.resolve(new Response('{}', {
status: 200,
headers: { 'Content-Type': 'application/json' }
}));
}
// Handle favicon requests
if (urlString.includes('favicon.ico')) {
return Promise.resolve(new Response('', { status: 204 }));
}
return originalFetch.apply(this, arguments);
};
// Prevent postMessage origin errors
window.addEventListener('message', function(event) {
try {
if (event.origin && event.origin !== window.location.origin) {
event.stopImmediatePropagation();
return false;
}
} catch (e) {
// Silently ignore origin check errors
}
}, true);
// Prevent console errors from missing resources
window.addEventListener('error', function(e) {
if (e.target && e.target.src) {
const src = e.target.src;
if (src.includes('manifest.json') || src.includes('favicon.ico')) {
e.preventDefault();
return false;
}
}
}, true);
// Override console.error to filter out known harmless errors
const originalConsoleError = console.error;
console.error = function(...args) {
const message = args.join(' ');
if (message.includes('manifest.json') ||
message.includes('favicon.ico') ||
message.includes('postMessage') ||
message.includes('target origin')) {
return; // Suppress these specific errors
}
originalConsoleError.apply(console, arguments);
};
}
}
"""
) as demo:
# Global state for cross-tab functionality
sandbox_state = gr.State({})
preview_config_state = gr.State({})
# Global status components that will be defined later
preview_status = None
preview_chat_section = None
config_display = None
with gr.Tabs():
with gr.Tab("Configuration"):
gr.Markdown("# Spaces Configuration")
gr.Markdown("Convert custom assistants from HuggingChat into chat interfaces with HuggingFace Spaces. Configure and download everything needed to deploy a simple HF space using Gradio.")
with gr.Column():
name = gr.Textbox(
label="Space Title",
placeholder="My Course Helper",
value="My Custom Space"
)
description = gr.Textbox(
label="Space Description",
placeholder="A customizable AI chat interface for...",
lines=2,
value="",
max_lines=2,
max_length=57
)
model = gr.Dropdown(
label="Model",
choices=MODELS,
value=MODELS[0],
info="Choose based on the context and purposes of your space"
)
api_key_var = gr.Textbox(
label="API Key Configuration (Required)",
value="OPENROUTER_API_KEY",
info="Set this secret in HuggingFace Space Settings → Variables and secrets with your OpenRouter API key",
interactive=False
)
access_code = gr.Textbox(
label="Space Access Code (Optional)",
value="SPACE_ACCESS_CODE",
info="Set this secret in HuggingFace Space Settings → Variables and secrets to require an access code.",
interactive=False
)
with gr.Accordion("Assistant Configuration", open=True):
gr.Markdown("Define the system prompt and assistant settings. You can use pre-configured templates or custom fields.")
# Template selection - moved before system prompt
gr.Markdown("**Choose a Template:** Start with a pre-configured assistant personality or create your own custom prompt. Templates provide tested prompts for common educational use cases.")
with gr.Row():
template_selector = gr.Radio(
label="Assistant Template",
choices=["None", "Research Template", "Socratic Template"],
value="None",
info="Select a template to auto-fill the system prompt, or choose 'None' for custom"
)
# Main system prompt field - now after template selector
system_prompt = gr.Textbox(
label="System Prompt",
placeholder="You are a helpful assistant that...",
lines=4,
value="",
info="Define the assistant's role, purpose, and behavior. This will be auto-filled if you select a template."
)
examples_text = gr.Textbox(
label="Example Prompts (one per line)",
placeholder="Can you analyze this research paper: https://example.com/paper.pdf\nWhat are the latest findings on climate change adaptation?\nHelp me fact-check claims about renewable energy efficiency",
lines=3,
info="These will appear as clickable examples in the chat interface"
)
enable_dynamic_urls = gr.Checkbox(
label="Enable Dynamic URL Fetching",
value=True, # Enabled by default
info="Allow the assistant to fetch additional URLs mentioned in conversations"
)
with gr.Accordion("URL Grounding", open=True):
gr.Markdown("Add URLs to provide context. Content will be fetched and added to the system prompt. You can add up to 10 URLs total (2 primary + 8 secondary).")
# Primary URLs section
gr.Markdown("### 🎯 Primary URLs (Always Processed)")
gr.Markdown("These URLs are processed first and given highest priority for context.")
url1 = gr.Textbox(
label="Primary URL 1",
placeholder="https://syllabus.edu/course (most important source)",
info="Main reference document, syllabus, or primary source"
)
url2 = gr.Textbox(
label="Primary URL 2",
placeholder="https://textbook.com/chapter (core material)",
info="Secondary reference, textbook chapter, or key resource"
)
# Secondary URLs section
gr.Markdown("### 📚 Secondary URLs (Additional Context)")
gr.Markdown("Additional sources for supplementary context and enhanced responses.")
url3 = gr.Textbox(
label="Secondary URL 1",
placeholder="https://example.com/supplementary",
info="Additional reference or supplementary material",
visible=True
)
url4 = gr.Textbox(
label="Secondary URL 2",
placeholder="https://example.com/resources",
info="Extra context or supporting documentation",
visible=True
)
url5 = gr.Textbox(
label="Secondary URL 3",
placeholder="https://example.com/guidelines",
info="Additional guidelines or reference material",
visible=False
)
url6 = gr.Textbox(
label="Secondary URL 4",
placeholder="https://example.com/examples",
info="Examples, case studies, or additional sources",
visible=False
)
url7 = gr.Textbox(
label="Secondary URL 5",
placeholder="https://example.com/research",
info="Research papers or academic sources",
visible=False
)
url8 = gr.Textbox(
label="Secondary URL 6",
placeholder="https://example.com/documentation",
info="Technical documentation or specifications",
visible=False
)
url9 = gr.Textbox(
label="Secondary URL 7",
placeholder="https://example.com/articles",
info="Articles, blog posts, or news sources",
visible=False
)
url10 = gr.Textbox(
label="Secondary URL 8",
placeholder="https://example.com/misc",
info="Miscellaneous sources or background material",
visible=False
)
# URL management buttons
with gr.Row():
add_url_btn = gr.Button("+ Add Secondary URLs (2/8)", size="sm")
remove_url_btn = gr.Button("- Remove Secondary URLs", size="sm", visible=True)
url_count = gr.State(4) # Track number of visible URLs
with gr.Accordion("Advanced Settings", open=False):
with gr.Row():
temperature = gr.Slider(
label="Temperature",
minimum=0,
maximum=2,
value=0.7,
step=0.1,
info="Higher = more creative, Lower = more focused"
)
max_tokens = gr.Slider(
label="Max Response Tokens",
minimum=50,
maximum=4096,
value=750,
step=50
)
with gr.Row():
preview_btn = gr.Button("Preview Deployment Package", variant="secondary")
generate_btn = gr.Button("Generate Deployment Package", variant="primary")
status = gr.Markdown(visible=False)
download_file = gr.File(label="Download your zip package", visible=False)
# State variable to cache custom system prompt
custom_prompt_cache = gr.State("")
# Connect the template selector
template_selector.change(
toggle_template,
inputs=[template_selector, system_prompt, custom_prompt_cache],
outputs=[system_prompt, enable_dynamic_urls, custom_prompt_cache]
)
# Web search checkbox is now just for enabling/disabling the feature
# No additional UI elements needed since we rely on model capabilities
# Connect the URL management buttons
add_url_btn.click(
add_urls,
inputs=[url_count],
outputs=[url3, url4, url5, url6, url7, url8, url9, url10, add_url_btn, remove_url_btn, url_count]
)
remove_url_btn.click(
remove_urls,
inputs=[url_count],
outputs=[url3, url4, url5, url6, url7, url8, url9, url10, add_url_btn, remove_url_btn, url_count]
)
# Connect the generate button
generate_btn.click(
on_generate,
inputs=[name, description, system_prompt, model, api_key_var, temperature, max_tokens, examples_text, access_code, enable_dynamic_urls, url1, url2, url3, url4, url5, url6, url7, url8, url9, url10],
outputs=[status, download_file, sandbox_state]
)
with gr.Tab("Preview"):
gr.Markdown("# Sandbox Preview")
gr.Markdown("Test your assistant before deployment.")
with gr.Column():
# Preview status - assign to global variable
preview_status_comp = gr.Markdown("**Status:** Configure your space in the Configuration tab and click 'Preview Deployment Package' to see your assistant here.", visible=True)
# Simulated chat interface for preview using ChatInterface
with gr.Column(visible=False) as preview_chat_section_comp:
preview_chatbot = gr.Chatbot(
value=[],
label="Preview Chat Interface",
height=400,
type="messages"
)
# Example prompt buttons
with gr.Row():
preview_example_btn1 = gr.Button("", visible=False, size="sm", variant="secondary")
preview_example_btn2 = gr.Button("", visible=False, size="sm", variant="secondary")
preview_example_btn3 = gr.Button("", visible=False, size="sm", variant="secondary")
preview_msg = gr.Textbox(
label="Test your assistant",
placeholder="Type a message to test your assistant...",
lines=2
)
# URL context fields for preview testing
with gr.Accordion("Test URL Context (Optional)", open=False):
gr.Markdown("Test URL context grounding in the preview. Uses same priority system: 2 primary + 8 secondary URLs.")
# Primary URLs for preview testing
gr.Markdown("**🎯 Primary URLs**")
with gr.Row():
preview_url1 = gr.Textbox(
label="Primary URL 1",
placeholder="https://syllabus.edu/course",
scale=1
)
preview_url2 = gr.Textbox(
label="Primary URL 2",
placeholder="https://textbook.com/chapter",
scale=1
)
# Secondary URLs for preview testing
gr.Markdown("**📚 Secondary URLs**")
with gr.Row():
preview_url3 = gr.Textbox(
label="Secondary URL 1",
placeholder="https://example.com/supplementary",
scale=1,
visible=True
)
preview_url4 = gr.Textbox(
label="Secondary URL 2",
placeholder="https://example.com/resources",
scale=1,
visible=True
)
with gr.Row():
preview_url5 = gr.Textbox(
label="Secondary URL 3",
placeholder="https://example.com/guidelines",
scale=1,
visible=False
)
preview_url6 = gr.Textbox(
label="Secondary URL 4",
placeholder="https://example.com/examples",
scale=1,
visible=False
)
with gr.Row():
preview_url7 = gr.Textbox(
label="Secondary URL 5",
placeholder="https://example.com/research",
scale=1,
visible=False
)
preview_url8 = gr.Textbox(
label="Secondary URL 6",
placeholder="https://example.com/documentation",
scale=1,
visible=False
)
with gr.Row():
preview_url9 = gr.Textbox(
label="Secondary URL 7",
placeholder="https://example.com/articles",
scale=1,
visible=False
)
preview_url10 = gr.Textbox(
label="Secondary URL 8",
placeholder="https://example.com/misc",
scale=1,
visible=False
)
# URL management for preview
with gr.Row():
preview_add_url_btn = gr.Button("+ Add Secondary URLs (2/8)", size="sm")
preview_remove_url_btn = gr.Button("- Remove Secondary URLs", size="sm", visible=True)
preview_url_count = gr.State(4)
with gr.Row():
preview_send = gr.Button("Send", variant="primary")
preview_clear = gr.Button("Clear")
preview_export_btn = gr.Button("Export Conversation", variant="secondary")
# Export functionality
export_file = gr.File(label="Download Conversation", visible=False)
# Configuration display - assign to global variable
config_display_comp = gr.Markdown("Configuration will appear here after preview generation.")
# Connect preview chat functionality
preview_send.click(
preview_chat_response,
inputs=[preview_msg, preview_chatbot, preview_config_state, preview_url1, preview_url2, preview_url3, preview_url4, preview_url5, preview_url6, preview_url7, preview_url8, preview_url9, preview_url10],
outputs=[preview_msg, preview_chatbot]
)
preview_msg.submit(
preview_chat_response,
inputs=[preview_msg, preview_chatbot, preview_config_state, preview_url1, preview_url2, preview_url3, preview_url4, preview_url5, preview_url6, preview_url7, preview_url8, preview_url9, preview_url10],
outputs=[preview_msg, preview_chatbot]
)
preview_clear.click(
clear_preview_chat,
outputs=[preview_msg, preview_chatbot]
)
preview_export_btn.click(
export_preview_conversation,
inputs=[preview_chatbot],
outputs=[export_file]
)
# Connect preview URL management buttons
preview_add_url_btn.click(
add_urls,
inputs=[preview_url_count],
outputs=[preview_url3, preview_url4, preview_url5, preview_url6, preview_url7, preview_url8, preview_url9, preview_url10, preview_add_url_btn, preview_remove_url_btn, preview_url_count]
)
preview_remove_url_btn.click(
remove_urls,
inputs=[preview_url_count],
outputs=[preview_url3, preview_url4, preview_url5, preview_url6, preview_url7, preview_url8, preview_url9, preview_url10, preview_add_url_btn, preview_remove_url_btn, preview_url_count]
)
# Connect example buttons to populate text input
# Need to get the example text from the state
def get_example_text(config_data, index):
if config_data and config_data.get('examples_list'):
examples = config_data['examples_list']
if index < len(examples):
return examples[index]
return ""
preview_example_btn1.click(
lambda config_data: get_example_text(config_data, 0),
inputs=[preview_config_state],
outputs=[preview_msg]
)
preview_example_btn2.click(
lambda config_data: get_example_text(config_data, 1),
inputs=[preview_config_state],
outputs=[preview_msg]
)
preview_example_btn3.click(
lambda config_data: get_example_text(config_data, 2),
inputs=[preview_config_state],
outputs=[preview_msg]
)
with gr.Tab("Support"):
create_support_docs()
# Connect cross-tab functionality after all components are defined
preview_btn.click(
on_preview_combined,
inputs=[name, description, system_prompt, model, temperature, max_tokens, examples_text, enable_dynamic_urls, url1, url2, url3, url4, url5, url6, url7, url8, url9, url10],
outputs=[preview_config_state, preview_status_comp, preview_chat_section_comp, config_display_comp, preview_url1, preview_url2, preview_url3, preview_url4, preview_url5, preview_url6, preview_url7, preview_url8, preview_url9, preview_url10, preview_add_url_btn, preview_remove_url_btn, preview_url_count, preview_example_btn1, preview_example_btn2, preview_example_btn3]
)
if __name__ == "__main__":
# Use default Gradio launch settings for HuggingFace Spaces compatibility
demo.launch(share=True)