Add Dynamic Column Sizes (#61)

content.py

@@ -264,7 +264,6 @@ nav.svelte-ti537g.svelte-ti537g {
 /*------ Global tooltip styles ------*/
 .tooltip-icon {
     display: inline-block;
-    margin-left: 6px;
     cursor: help;
     position: relative;
 }
@@ -543,4 +542,8 @@ span.wrap[tabindex="0"][role="button"][data-editable="false"] {
 .divider-line {
     opacity: 40%;
 }
+#leaderboard-accordion table {
+    width: auto !important;
+    margin-right: auto !important;
+}
 """

leaderboard_transformer.py

@@ -254,35 +254,8 @@ class DataTransformer:
 
         df_view = df_sorted.copy()
 
-        # 3. Combine "Agent" and "Submitter" into a single HTML-formatted column
-        #    We do this *before* defining the final column list.
-        if 'Agent' in df_view.columns and 'Submitter' in df_view.columns:
-            #preserve just agent name for scatterplot hover
-            df_view['agent_for_hover'] = df_view['Agent']
-            
-            def combine_agent_submitter(row):
-                agent = row['Agent']
-                submitter = row['Submitter']
-
-                # Check if submitter exists and is not empty
-                if pd.notna(submitter) and submitter.strip() != '':
-                    # Create a two-line HTML string with styled submitter text
-                    return (
-                        f"<div>{agent}<br>"
-                        f"<span style='font-size: 0.9em; color: #667876;'>{submitter}</span>"
-                        f"</div>"
-                    )
-                else:
-                    # If no submitter, just return the agent name
-                    return agent
-
-            # Apply the function to create the new combined 'Agent' column
-            df_view['Agent'] = df_view.apply(combine_agent_submitter, axis=1)
-            # The 'Submitter' column is no longer needed
-            df_view = df_view.drop(columns=['Submitter'])
-
-        # 4. Build the List of Columns to Display
-        base_cols = ["id","Agent","LLM Base", "agent_for_hover"]
+        # --- 3. Add Columns for Agent Openness and Tooling ---
+        base_cols = ["id","Agent","Submitter","LLM Base"]
         new_cols = ["Openness", "Agent Tooling"]
         ending_cols = ["Logs"]
 
@@ -342,7 +315,7 @@ class DataTransformer:
                     data=df_view,
                     x=primary_cost_col,
                     y=primary_score_col,
-                    agent_col="agent_for_hover",
+                    agent_col="Agent",
                     name=primary_metric
                 )
                 # Use a consistent key for easy retrieval later
@@ -363,7 +336,7 @@ def _plot_scatter_plotly(
         data: pd.DataFrame,
         x: Optional[str],
         y: str,
-        agent_col: str = 'agent_for_hover',
+        agent_col: str = 'Agent',
         name: Optional[str] = None
 ) -> go.Figure:
 

ui_components.py

@@ -458,13 +458,13 @@ def create_leaderboard_display(
     all_cols.insert(0, all_cols.pop(all_cols.index('Pareto')))
     df_view = df_view[all_cols]
     # Drop internally used columns that are not needed in the display
-    columns_to_drop = ['id', 'agent_for_hover', 'Openness', 'Agent Tooling']
+    columns_to_drop = ['id', 'Openness', 'Agent Tooling']
     df_view = df_view.drop(columns=columns_to_drop, errors='ignore')
 
     df_headers = df_view.columns.tolist()
     df_datatypes = []
     for col in df_headers:
-        if col in ["Logs", "Agent"] or "Cost" in col or "Score" in col:
+        if col == "Logs" or "Cost" in col or "Score" in col:
             df_datatypes.append("markdown")
         elif col in ["Icon","LLM Base"]:
             df_datatypes.append("html")
@@ -477,6 +477,17 @@ def create_leaderboard_display(
     }
     # 2. Create the final list of headers for display.
     df_view = df_view.rename(columns=header_rename_map)
+    # Dynamically set widths for the DataFrame columns
+    fixed_start_widths = [40, 40, 200, 100, 200]
+    num_score_cost_cols = 0
+    remaining_headers = df_headers[len(fixed_start_widths):]
+    for col in remaining_headers:
+        if "Score" in col or "Cost" in col:
+            num_score_cost_cols += 1
+    dynamic_widths = [80] * num_score_cost_cols
+    fixed_end_widths = [80, 40]
+    # 5. Combine all the lists to create the final, fully dynamic list.
+    final_column_widths = fixed_start_widths + dynamic_widths + fixed_end_widths
 
     plot_component = gr.Plot(
         value=scatter_plot,
@@ -491,7 +502,7 @@ def create_leaderboard_display(
             datatype=df_datatypes,
             interactive=False,
             wrap=True,
-            column_widths=[40, 40, 200, 200],
+            column_widths=final_column_widths,
             elem_classes=["wrap-header-df"]
         )
         legend_markdown = create_legend_markdown(category_name)
@@ -649,7 +660,7 @@ def create_benchmark_details_display(
                 datatype=df_datatypes,
                 interactive=False,
                 wrap=True,
-                column_widths=[40, 40, 200, 150, 175, 85],
+                column_widths=[40, 40, 200, 150, 175, 85, 100, 100, 40],
                 elem_classes=["wrap-header-df"]
             )
             legend_markdown = create_legend_markdown(benchmark_name)