update app.py

app.py

@@ -12,7 +12,7 @@ from src.about import (
     LLM_BENCHMARKS_TEXT,
     TITLE,
 )
-from src.display.css_html_js import custom_css
+from src.display.css_html_js import custom_css, get_window_url_params
 from src.display.utils import (
     COLUMNS,
     COLS,
@@ -28,33 +28,6 @@ from src.envs import API, EVAL_REQUESTS_PATH, EVAL_RESULTS_PATH, QUEUE_REPO, REP
 from src.populate import get_evaluation_queue_df, get_leaderboard_df
 from src.submission.submit import add_new_eval
 
-# Add this CSS to make column selection more compact
-custom_css_additions = """
-.select-columns-container {
-    max-height: 300px;
-    overflow-y: auto;
-    display: grid;
-    grid-template-columns: repeat(4, 1fr);
-    gap: 5px;
-}
-
-.select-columns-container label {
-    font-size: 0.9em;
-    padding: 2px;
-    margin: 0;
-}
-
-.column-categories {
-    margin-bottom: 10px;
-}
-"""
-
-# Update your CSS
-if 'custom_css' in locals():
-    custom_css += custom_css_additions
-else:
-    custom_css = custom_css_additions
-
 def restart_space():
     API.restart_space(repo_id=REPO_ID)
 
@@ -82,18 +55,34 @@ print("LEADERBOARD_DF Columns:", LEADERBOARD_DF.columns.tolist())  # Debug
 # Load the evaluation queue DataFrames
 finished_eval_queue_df, running_eval_queue_df, pending_eval_queue_df = get_evaluation_queue_df(EVAL_REQUESTS_PATH, EVAL_COLS)
 
-# Group columns by category for better organization
-COLUMN_CATEGORIES = {
-    "Model Info": ["model_name", "model_type", "license", "likes", "base_model", "params", "precision", "weight_type", "still_on_hub", "average"],
-    "Academic Knowledge": ["abstract_algebra", "anatomy", "astronomy", "college_biology", "college_chemistry", "college_computer_science", 
-                          "college_mathematics", "college_medicine", "college_physics"],
-    "General Knowledge": ["business_ethics", "clinical_knowledge", "conceptual_physics", "econometrics", "electrical_engineering",
-                          "elementary_mathematics", "formal_logic", "global_facts"],
-    "High School Subjects": ["high_school_biology", "high_school_chemistry", "high_school_computer_science", 
-                             "high_school_european_history", "high_school_geography", "high_school_government_and_politics"]
+demo = gr.Blocks(css=custom_css + """
+/* Column selection improvements */
+.select-columns-container label {
+    display: inline-block;
+    width: 24%;
+    font-size: 0.9em;
+    padding: 2px 5px;
+    margin: 2px 0;
+    vertical-align: top;
+}
+
+/* Make column section more compact */
+.select-columns-section {
+    max-height: 300px;
+    overflow-y: auto;
+    padding: 0 !important;
+}
+
+/* Add category headers */
+.column-category {
+    font-weight: bold;
+    margin-top: 10px;
+    margin-bottom: 5px;
+    border-bottom: 1px solid #eee;
+    padding-bottom: 3px;
 }
+""")
 
-demo = gr.Blocks(css=custom_css)
 with demo:
     gr.HTML(TITLE)
     gr.Markdown(INTRODUCTION_TEXT, elem_classes="markdown-text")
@@ -111,24 +100,12 @@ with demo:
                     default_selection.insert(0, "model_name")
                     print("Default Selection after ensuring 'model_name':", default_selection)  # Debug
 
-                # Create an accordion for column selection
-                with gr.Accordion("Select Columns to Display", open=False):
-                    column_selections = {}
-                    
-                    for category, cols in COLUMN_CATEGORIES.items():
-                        # Filter to only include columns that exist
-                        available_cols = [c for c in cols if c in [col.name for col in COLUMNS]]
-                        
-                        if available_cols:
-                            with gr.Column(elem_classes="column-categories"):
-                                gr.Markdown(f"**{category}**")
-                                column_selections[category] = gr.CheckboxGroup(
-                                    choices=available_cols,
-                                    value=[c for c in available_cols if c in default_selection],
-                                    label=""
-                                )
+                # Add a custom accordion for better organization of column options
+                with gr.Accordion("📊 Select Columns to Display", open=False):
+                    # Will be visually hidden and replaced with our custom layout
+                    gr.HTML("<div class='column-category'>Keep using the checkboxes below to select columns.</div>")
                 
-                # Create the leaderboard with standard SelectColumns (it will be hidden via CSS)
+                # Create the leaderboard with the built-in SelectColumns
                 leaderboard = Leaderboard(
                     value=LEADERBOARD_DF,
                     datatype=[col.type for col in COLUMNS],
@@ -136,7 +113,6 @@ with demo:
                         default_selection=default_selection,
                         cant_deselect=[col.name for col in COLUMNS if col.never_hidden],
                         label="Select Columns to Display:",
-                        render=False,  # Don't render the built-in selector if this option is available
                     ),
                     search_columns=[col.name for col in COLUMNS if col.name in ["model_name", "license"]],
                     hide_columns=[col.name for col in COLUMNS if col.hidden],
@@ -150,16 +126,6 @@ with demo:
                     bool_checkboxgroup_label="Hide models",
                     interactive=False,
                 )
-                
-                # Add event handlers to update visible columns when custom checkboxes are changed
-                for category, checkbox_group in column_selections.items():
-                    # For each category, when checkboxes change, update the visible columns
-                    # This might need adjustment based on how the Leaderboard component works
-                    checkbox_group.change(
-                        fn=lambda *values: leaderboard.update(visible_columns=sum(values, [])),
-                        inputs=list(column_selections.values()),
-                        outputs=[leaderboard]
-                    )
 
         with gr.TabItem("📝 About", elem_id="llm-benchmark-tab-table", id=2):
             gr.Markdown(LLM_BENCHMARKS_TEXT, elem_classes="markdown-text")