import gradio as gr
import plotly.graph_objects as go
import plotly.io as pio
import numpy as np
from src.dataloading import get_leaderboard_models_cached, get_leaderboard_datasets

pio.renderers.default = "iframe"

def create_heatmap(selected_models, selected_dataset):
    # Return nothing if no inputs are provided
    if not selected_models or not selected_dataset:
        return None

    # Generate a random symmetric similarity matrix
    size = len(selected_models)
    similarities = np.random.rand(size, size)
    similarities = (similarities + similarities.T) / 2
    similarities = np.round(similarities, 2)

    # Create a heatmap trace using go.Heatmap; we set x and y to the model names.
    fig = go.Figure(data=go.Heatmap(
        z=similarities,
        x=selected_models,
        y=selected_models,
        colorscale="Viridis",
        zmin=0, zmax=1,
        text=similarities,
        hoverinfo="text"
    ))

    # Update layout: add title, axis titles, set fixed dimensions and margins
    fig.update_layout(
        title=f"Similarity Matrix for {selected_dataset}",
        xaxis_title="Models",
        yaxis_title="Models",
        width=800,
        height=800,
        margin=dict(l=100, r=100, t=100, b=100)
    )
    return fig

def validate_inputs(selected_models, selected_dataset):
    if not selected_models:
        raise gr.Error("Please select at least one model!")
    if not selected_dataset:
        raise gr.Error("Please select a dataset!")

with gr.Blocks(title="LLM Similarity Analyzer") as demo:
    gr.Markdown("## Model Similarity Comparison Tool")
    
    with gr.Row():
        dataset_dropdown = gr.Dropdown(
            choices=get_leaderboard_datasets(),
            label="Select Dataset",
            filterable=True,
            interactive=True,
            info="Leaderboard benchmark datasets"
        )
        model_dropdown = gr.Dropdown(
            choices=get_leaderboard_models_cached(),
            label="Select Models",
            multiselect=True,
            filterable=True,
            allow_custom_value=False,
            info="Search and select multiple models"
        )
    
    generate_btn = gr.Button("Generate Heatmap", variant="primary")
    # Initialize the Plot component without a figure (it will be updated)
    heatmap = gr.Plot(label="Similarity Heatmap", visible=True)
    
    # First validate inputs, then create the heatmap; note that we use a single output.
    generate_btn.click(
        fn=validate_inputs,
        inputs=[model_dropdown, dataset_dropdown],
        queue=False
    ).then(
        fn=create_heatmap,
        inputs=[model_dropdown, dataset_dropdown],
        outputs=heatmap
    )
    
    # Clear button to reset selections and clear the plot
    clear_btn = gr.Button("Clear Selection")
    clear_btn.click(
        lambda: [None, None, None],
        outputs=[model_dropdown, dataset_dropdown, heatmap]
    )

if __name__ == "__main__":
    demo.launch(ssr_mode=False)