import gradio as gr
import requests
import json
import logging

logging.basicConfig(level=logging.DEBUG)

API_URL = "https://sendthat.cc"
HISTORY_INDEX = "history"

def search_document(query, k):
    try:
        url = f"{API_URL}/search/{HISTORY_INDEX}"
        payload = {"text": query, "k": k}
        headers = {"Content-Type": "application/json"}
        response = requests.post(url, json=payload, headers=headers)
        response.raise_for_status()
        return response.json(), "", k
    except requests.exceptions.RequestException as e:
        logging.error(f"Error in search: {e}")
        return {"error": str(e)}, query, k

def qa_document(question, k):
    try:
        url = f"{API_URL}/qa/{HISTORY_INDEX}"
        payload = {"text": question, "k": k}
        headers = {"Content-Type": "application/json"}
        response = requests.post(url, json=payload, headers=headers)
        response.raise_for_status()
        return response.json(), "", k
    except requests.exceptions.RequestException as e:
        logging.error(f"Error in QA: {e}")
        return {"error": str(e)}, question, k

# Custom CSS for modern appearance
custom_css = """
.gradio-container {
    background-color: #f5f5f5;
}
.input-box, .output-box, .gr-box {
    border-radius: 8px !important;
    border-color: #d1d1d1 !important;
}
.input-box {
    background-color: #e6f2ff !important;
}
.gr-button {
    background-color: #4a90e2 !important;
    color: white !important;
}
.gr-button:hover {
    background-color: #3a7bc8 !important;
}
.gr-form {
    border-color: #d1d1d1 !important;
    background-color: white !important;
}
"""

with gr.Blocks(css=custom_css) as demo:
    gr.Markdown("# History Document Search and Question Answering System")
    
    with gr.Tab("Search"):
        search_input = gr.Textbox(label="Search Query")
        search_k = gr.Slider(1, 10, 5, step=1, label="Number of Results")
        search_button = gr.Button("Search")
        search_output = gr.JSON(label="Search Results")
        
    with gr.Tab("Question Answering"):
        qa_input = gr.Textbox(label="Question")
        qa_k = gr.Slider(1, 10, 5, step=1, label="Number of Contexts to Consider")
        qa_button = gr.Button("Ask Question")
        qa_output = gr.JSON(label="Answer")
    
    search_button.click(search_document, 
                        inputs=[search_input, search_k], 
                        outputs=[search_output, search_input, search_k])
    qa_button.click(qa_document, 
                    inputs=[qa_input, qa_k], 
                    outputs=[qa_output, qa_input, qa_k])

demo.launch()