import gradio as gr
from ask import askQuestion

# abd="#f9fafe"
# abd="6469ff"

pinecone_key=os.environ['PINECONE_KEY']

def getBrains():
    pinecone.init(api_key=pinecone_key,
                  environment="us-west4-gcp")
    active_indexes = pinecone.list_indexes()
    print(active_indexes)
    return gr.update(choices=active_indexes)


bg_color = "#c5dde0"
s_color = "#1d2230"
mycss = """
    .gradio-container {{background-color: {bgcolor}}}
    #title {{margin-top:33%;margin-bottom:25px;display:flex;justify-content:center;align-items:center}}
    #title h1 {{font-weight:900;color:{scolor}}}
    #advanced {{font-weight:600;background-color:#ffffff}}
    #secondrow {{padding:0 6%;gap:30px}}    


    #name {{background-color: {bgcolor};border-style:none;border-width:0;box-shadow:none;padding-left:0;padding-right:0}}
    #name .svelte-1gfkn6j {{background-color:{bgcolor};color:{scolor};font-size:18px}}
    

    #question {{background-color: {bgcolor};border-style:none; !important;box-shadow:none !important;padding-left:0;padding-right:0}}
    #question span {{background-color:{bgcolor};color:{scolor};font-size:18px}}

    #output {{background-color: {bgcolor};border-style:none;border-width:0;box-shadow:none}}
    #output span {{background-color:{bgcolor};color:{scolor};font-size:18px}}

    #temp span {{background-color:#ffffff;color:{scolor}}}
    #temp input {{accent-color:{scolor}}}
    #tokens span {{background-color:#ffffff;color:{scolor}}}
    #tokens input {{accent-color:{scolor}}}

    #button {{background-color:{scolor};color:#ffffff;margin-top:29px}}
"""
formatted_css = mycss.format(bgcolor=bg_color, scolor=s_color)


def handleSubmit(brain_name, question, temperature, maxTokens):
    print(brain_name)
    if (brain_name == "" and question == ""):
        return "Please select Brain Name & Enter Question"
    if (brain_name == ""):
        return "Please select Brain Name"
    if (question == ""):
        return "Please Enter Question"
    return askQuestion(brain_name, question, temperature, maxTokens)


with gr.Blocks(theme=gr.themes.Soft(), css=formatted_css) as block_demo:
    with gr.Row(elem_id="first"):

        with gr.Column():
            gr.Markdown(
                """
            # Ask Brain!
            """, elem_id="title")

    with gr.Row(elem_id="secondrow"):

        with gr.Column(scale=1,  elem_id="inputsCol"):

            brain_name = gr.Dropdown(
                label="Brain Name", choices=None, elem_id="name", multiselect=False, interactive=True)
            question = gr.Textbox(
                label="Question", lines=2, elem_id="question")

            with gr.Accordion(label="Advanced Options", open=False, elem_id="advanced") as a:
                temperature = gr.Slider(
                    minimum=0.1, maximum=1.0, step=0.1, value=0.5, label="Temperature", elem_id="temp")
                maxTokens = gr.Slider(minimum=200, maximum=2000,
                                      step=100, value=1000, label="Max Tokens", elem_id="tokens")

            submit_button = gr.Button(label="Submit", elem_id="button")

        with gr.Column(scale=1, elem_id="outputCol",):
            output_text = gr.TextArea(
                label="Brain Output", lines=14, elem_id="output").style(show_copy_button=True)

    submit_button.click(
        handleSubmit, [brain_name, question, temperature, maxTokens], output_text)

    block_demo.load(getBrains, [], brain_name)

block_demo.launch(show_api=False)