import gradio as gr
import table_load as tl
import comm


css="""
#col-container {max-width: 700px; margin-left: auto; margin-right: auto;}
"""

title = """
<div style="text-align: center;max-width: 700px;">
    <h1>Analyze your CSV</h1>
    <p style="text-align: center;">Please specify OpenAI Key before use</p>
</div>
"""


with gr.Blocks(css=css) as demo:
    with gr.Column(elem_id="col-container"):
        gr.HTML(title)
    with gr.Column():
            openai_key = gr.Textbox(label="You OpenAI API key", type="password")
            raw_table = gr.File(label="Load a table file (xls or csv)", file_types=['.csv, xlsx, xls'], type="file")
            with gr.Row():
                langchain_status = gr.Textbox(label="Status", placeholder="", interactive=False)
                load_table = gr.Button("Load table to langchain")

    chatbot = gr.Chatbot([], elem_id="chatbot").style(height=350)
    with gr.Column(scale=0.85):
        question = gr.Textbox(show_label=False, placeholder="Type your question and hit Enter").style(container=False)
    with gr.Column(scale=0.15, min_width=0):
        clr_btn = gr.Button("Clear History")
        
        
    load_table.click(tl.load_file, None, langchain_status, queue=False)    
    load_table.click(tl.table_loader, inputs=[raw_table, openai_key], outputs=[langchain_status], queue=False)
   
    question.submit(comm.respond, [question, chatbot], [question, chatbot])
    clr_btn.click(lambda: None, None, chatbot, queue=False)
    
demo.launch()