import pandas as pd
import gradio as gr
from ui.leaderboard import render_leader_board, render_info_html, render_citation
from ui.evaluation import render_eval_info
from ui.submission import render_submission_page
import os
from utils import load_leaderboard, custom_css
from huggingface_hub import snapshot_download
import gradio as gr
import os
import json

REPO_ID = os.getenv('REPO_ID')

DB_ERR_PATH = './data/data/eers.csv'
DB_ACC_PATH = './data/data/accuracy.csv'
DB_F1_PATH = './data/data/f1.csv'

CITATIONS_PATH = f'./data/data/model_citations.json'
LICENSES_PATH = f'./data/data/model_licenses.json'
PARAMS_PATH = f'./data/data/model_parameter_count.json'

if not os.path.exists('./data/data'):
    snapshot_download(repo_id=REPO_ID, 
                      repo_type="dataset", local_dir='./data/data')

with open(CITATIONS_PATH, 'r') as f:
    model_citations = json.load(f)

with open(LICENSES_PATH, 'r') as f:
    model_licenses = json.load(f)

with open(PARAMS_PATH, 'r') as f:
    model_params = json.load(f)


# Load leaderboard data
leaderboard_df_err = load_leaderboard(DB_ERR_PATH)
leaderboard_df_f1 = load_leaderboard(DB_F1_PATH)
leaderboard_df_acc = load_leaderboard(DB_ACC_PATH)



def create_ui():
    # with gr.Blocks(theme=gr.themes.Soft(text_size=gr.themes.sizes.text_md)) as demo:
    with gr.Blocks(theme=gr.themes.Soft(text_size=gr.themes.sizes.text_md)) as demo:

        gr.Image(f'./data/data/df_arena.jpg', interactive=False, 
                 show_fullscreen_button=False, show_share_button=False, show_label=False)
        
        with gr.Tabs():
            with gr.Tab("🏆 Leaderboard"):
                with gr.Column():
                    render_info_html()
                    render_leader_board(leaderboard_df_err, model_citations, model_licenses, model_params, True) 
                    gr.HTML("<div style='text-align:center; font-style:italic;'>Table: EER (%)</div>") 
                    gr.Markdown("<br>")  # add spacing
                    render_leader_board(leaderboard_df_acc, model_citations, model_licenses, model_params, False)  
                    gr.HTML("<div style='text-align:center; font-style:italic;'>Table: Accuracy (%)</div>")
                    gr.Markdown("<br>")  # add spacing                      
                    render_leader_board(leaderboard_df_f1, model_citations, model_licenses, model_params, False)  
                    gr.HTML("<div style='text-align:center; font-style:italic;'>Table: F1 scores</div>")
                    gr.Markdown("<br>")  # add spacing
                    render_citation()

            with gr.Tab("📊 Compute your scores"):
                render_eval_info()  

            with gr.Tab("📤 Submit your own system !"):
                render_submission_page() 
 
    return demo

# Launch the app
# create_ui().launch(share=True)

if __name__ == "__main__":
    demo = create_ui()
    demo.launch()