ui/sidebar.py

"""
Sidebar with Gemini AI chat
"""
import gradio as gr
from chat.gemini import chat_with_gemini, clear_chat
from config.settings import GEMINI_API_KEY

def create_sidebar():
    """Create the AI chat sidebar"""
    
    with gr.Column(elem_classes="sidebar"):
        gr.Markdown("""
        ## 🤖 Gemini AI Assistant
        
        Ask me anything about web scraping, automation, or get help with using this tool!
        """)
        
        if not GEMINI_API_KEY:
            gr.Markdown("""
            ⚠️ **Setup Required**: Add your Gemini API key to Hugging Face secrets:
            1. Go to your Space Settings
            2. Add a new secret named `GEMINI_API_KEY`
            3. Get your API key from [Google AI Studio](https://makersuite.google.com/app/apikey)
            """)
        
        chatbot = gr.Chatbot(
            value=[],
            elem_classes="chat-container",
            bubble_full_width=False,
            avatar_images=(None, "🤖")
        )
        
        msg = gr.Textbox(
            label="Message",
            placeholder="Ask me about web scraping, CSS selectors, or any feature...",
            lines=2
        )
        
        with gr.Row():
            submit = gr.Button("Send", variant="primary", scale=1)
            clear = gr.Button("Clear", variant="secondary", scale=1)
        
        # Example prompts
        gr.Examples(
            examples=[
                "How do I extract all links from a webpage?",
                "What's the CSS selector for the first paragraph?",
                "How can I handle dynamic content that loads with JavaScript?",
                "Explain the difference between persistent and non-persistent browser",
                "How do I bypass CORS when making API requests?",
                "What's the best way to extract data from a table?",
                "How can I automate form filling and submission?",
                "Help me understand the accessibility audit results"
            ],
            inputs=msg,
            label="Example Questions"
        )
        
        # Chat event handlers
        msg.submit(chat_with_gemini, [msg, chatbot], [msg, chatbot])
        msg.submit(lambda: "", None, msg)  # Clear input
        submit.click(chat_with_gemini, [msg, chatbot], [msg, chatbot])
        submit.click(lambda: "", None, msg)  # Clear input
        clear.click(clear_chat, None, [msg, chatbot])