import gradio as gr

css = """
.plugin-accordion button span:first-child {
    font-size: 1.25rem !important;
}
"""

with gr.Blocks(css=css) as pipeline_builder:
  gr.Markdown("# 🚰 Impact Framework Pipeline Builder")
  gr.Markdown("Visually construct your Impact Framework manifest file pipeline with this helpful interface.")

  gr.Markdown("## Plugin Selector")
  plugin_selector = gr.Dropdown(["Watt-Time","CO2.js","TDP Finder","Cloud Metadata"], label="Plugin",value="Cloud Metadata",interactive=True,info="Plugins available on the Impact Framework Registry")

  with gr.Accordion("Chosen Plugin",open=True,elem_classes=["plugin-accordion"]):
    gr.Markdown("## Cloud Metadata")
    with gr.Row(variant="panel"):
      plugin_input_1 = gr.Dropdown(["AWS","GCP","Azure","Other"], label="Cloud Vendor", info="Where is your data hosted?",interactive=True,value="AWS")
      plugin_input_2 = gr.Dropdown(["C5 Metal","d3.xlarge","m5.large"], label="Cloud Instance", info="Wnat cloud instance is your server using?",interactive=True,value="m5.large")
    with gr.Row():
      plugin_input_finder_btn = gr.Button("Help me find my inputs")

  with gr.Accordion("Find your cloud metadata inputs",open=True,elem_classes=["plugin-accordion"]):

    plugin_input_finder_url = gr.Textbox(placeholder="https://[your_website.com]", label="Your website URL", info="If you are measuring energy based on a hosted website, enter the URL")
    gr.Markdown("### <center>- OR -</center> ")

    plugin_input_finder_host = gr.Dropdown(["AWS","GCP","Azure","Other"], label="Cloud Vendor", info="Where is your data hosted?",interactive=True,value="AWS")
    plugin_input_finder_servers = gr.Dropdown(["uswest-3","a1.xl"], label="Select an Instance", info="Your instance is the machine type your website is being run with",interactive=True,value="uswest-3")
    with gr.Row():
      plugin_input_finder_geolocate = gr.Button("Find My Location")

  with gr.Accordion("Sample plugin outputs",open=True,elem_classes=["plugin-accordion"]):

    gr.Markdown("### Plugin Output Format")

    gr.Markdown("#### CPU/TDP")
    with gr.Row(variant="panel"):
      gr.Textbox(value=270,label="Amount")
      gr.Textbox(value="Watts",label="Units")
      gr.Textbox(value="CPU/GPU Heat Dissipation",label="ℹ️")

    gr.Markdown("#### Memory")
    with gr.Row(variant="panel"):
      gr.Textbox(value=432,label="Amount")
      gr.Textbox(value="GB",label="Units")

    gr.Markdown("#### Processor")
    with gr.Row(variant="panel"):
      gr.Textbox(value="Intel XEON 830C",label="type")

    gr.Markdown("#### VCPUs")
    with gr.Row(variant="panel"):
      gr.Textbox(value="64 / 64",label="used / available")


  gr.Button("Submit Plugin",variant="primary")



    #btn = gr.Button("Run")
    #btn.click(fn=update, inputs=inp, outputs=out)

pipeline_builder.launch()