import gradio as gr
#import leafmap
import plotly.graph_objects as go

EXAMPLE_QUERY="Hello"
 # build the UI in gradio
app = gr.Blocks()

#generic_map = leafmap.Map()


fig = go.Figure(go.Scattermapbox(
            #customdata=("Kobe"),
            lat=[34.689999],
            lon=[135.195557],
            mode='markers',
            marker=go.scattermapbox.Marker(
                size=6
            ),
            hoverinfo="text",
            hovertemplate='<b>Name</b>: %{customdata[0]}<br><b>Price</b>: $%{customdata[1]}'
        ))

fig.update_layout(
    mapbox_style="open-street-map",
    hovermode='closest',
    mapbox=dict(
        bearing=0,
        center=go.layout.mapbox.Center(
            lat=34.68,
            lon=-135.19
        ),
        pitch=0,
        zoom=9
    ),
)

with app:
    gr.Markdown("## Generate Recommendation")
    with gr.Tabs():
        with gr.TabItem("Generate with map"):
            with gr.Row():
                with gr.Column():
                    text_input_map = gr.Textbox(
                        EXAMPLE_QUERY, label="Weather query", lines=4
                    )

                    radio_map = gr.Radio(
                        value="Kobe",
                        choices=["Kobe", "Tokyo"],
                        label="Location",
                    )

                    query_validation_text = gr.Textbox(
                        label="Query Input", lines=2
                    )
                    # ideally we want to print logs to the app too
                    # logs = gr.Textbox(label="Logs")
                    # app.load(read_logs, None, logs, every=1)
                with gr.Column():
                    # place where the map will appear
                    gr.Plot(fig),
                    #map,
                    # place where the suggested trip will appear
                    itinerary_output = gr.Textbox(
                        value="Your recommendation will appear here",
                        label="Recommendation suggestion",
                        lines=3,
                    )
                
            map_button = gr.Button("Generate")
        # with gr.TabItem("Generate without map"):
        #     with gr.Row():
        #         with gr.Column():
        #             text_input_no_map = gr.Textbox(
        #                 value=EXAMPLE_QUERY, label="Travel query", lines=3
        #             )

        #             radio_no_map = gr.Radio(
        #                 value="gpt-3.5-turbo",
        #                 choices=["gpt-3.5-turbo", "gpt-4", "models/text-bison-001"],
        #                 label="Model choices",
        #             )

        #             query_validation_no_map = gr.Textbox(
        #                 label="Query validation information", lines=2
        #             )
        #         with gr.Column():
        #             text_output_no_map = gr.Textbox(
        #                 value="Your itinerary will appear here",
        #                 label="Itinerary suggestion",
        #                 lines=3,
        #             )
        #     text_button = gr.Button("Generate")

    # map_button.click(
    #     generic_map,
    #     inputs=[text_input_map, radio_map],
    #     outputs=[map_output, itinerary_output, query_validation_text],
    # )
    # text_button.click(
    #     generic_map,
    #     inputs=[text_input_no_map, radio_no_map],
    #     outputs=[text_output_no_map, query_validation_no_map],
    # )
    #app.load(map)

app.launch()