Colorize output

app.py

@@ -1,21 +1,18 @@
-from enum import Enum
-import io
 from datetime import datetime, timezone
 
 import gradio as gr
 import pandas as pd
 
-from src.about import TITLE, INTRODUCTION_TEXT
+from src.about import INTRODUCTION_TEXT, TITLE
 from src.display.css_html_js import custom_css
+from src.leaderboard.columns import DisplayColumns, RequiredInputColumns
 from src.leaderboard.input import load_csv_from_github
 from src.leaderboard.output import format_output_df
-from src.leaderboard.columns import DisplayColumns
-
 
 LEADERBOARD_GITHUB_URL = "https://github.com/upgini/mle-bench/blob/main/rankings/low/tabular/overall_ranks.csv"
 
 
-def download_leaderboard() -> pd.DataFrame:
+def load_leaderboard() -> pd.DataFrame:
     """Download the remote leaderboard CSV from GitHub (handles Git LFS).
 
     Returns a processed DataFrame ready for display.
@@ -35,7 +32,7 @@ def download_leaderboard() -> pd.DataFrame:
 
 def refresh_leaderboard():
     """Fetch the leaderboard and build the status message for the UI."""
-    df = download_leaderboard()
+    df = apply_styling(load_leaderboard())
     status = (
         f"Showing data from [GitHub]({LEADERBOARD_GITHUB_URL}). "
         f"Last refreshed: {datetime.now(timezone.utc):%Y-%m-%d %H:%M UTC}."
@@ -43,20 +40,45 @@ def refresh_leaderboard():
     return df, status
 
 
+def apply_styling(df: pd.DataFrame):
+    """Apply styling to the leaderboard table."""
+
+    display_df = df[DisplayColumns.values()]
+
+    style = display_df.style.background_gradient(
+        subset=[DisplayColumns.NORMALIZED_SCORE],
+        high=0.5,
+        low=0.0,
+        cmap="Greens",
+        gmap=df[RequiredInputColumns.MEAN_NORMALIZED_SCORE],
+    ).background_gradient(
+        subset=[DisplayColumns.ANY_MEDAL_SCORE],
+        high=1.2,
+        low=0.0,
+        cmap="Oranges",
+        gmap=df[RequiredInputColumns.MEAN_MEDAL_PCT],
+    )
+
+    return style
+
+
 def create_app():
     """Create and configure the Gradio app without launching it."""
     with gr.Blocks(title="Upgini MLE-Bench Leaderboard", css=custom_css) as demo:
         gr.HTML(TITLE)
         gr.Markdown(INTRODUCTION_TEXT)
 
+        # style = apply_styling(load_leaderboard())
         leaderboard_table = gr.DataFrame(
             value=pd.DataFrame(columns=DisplayColumns.values()),
             wrap=True,
             interactive=False,
             type="pandas",
+            datatype="markdown",
             label="Leaderboard",
             elem_id="leaderboard-table",
         )
+
         status_text = gr.Markdown()
         refresh_button = gr.Button("Refresh leaderboard", variant="primary")
 

src/display/css_html_js.py

@@ -33,7 +33,7 @@ custom_css = """
     background: none;
     border: none;
 }
- 
+
 #search-bar {
     padding: 0px;
 }
@@ -77,7 +77,7 @@ custom_css = """
 #filter_type label > .wrap{
     width: 103px;
 }
-#filter_type label > .wrap .wrap-inner{  
+#filter_type label > .wrap .wrap-inner{
     padding: 2px;
 }
 #filter_type label > .wrap .wrap-inner input{
@@ -94,6 +94,25 @@ custom_css = """
 #box-filter > .form{
     border: 0
 }
+
+/* Support for HTML rendering in DataFrame cells */
+#leaderboard-table table td {
+    white-space: normal !important;
+}
+
+#leaderboard-table table td div {
+    display: inline-block;
+}
+
+/* Ensure markdown links are clickable */
+#leaderboard-table table td a {
+    color: #0066cc;
+    text-decoration: underline;
+}
+
+#leaderboard-table table td a:hover {
+    color: #004499;
+}
 """
 
 get_window_url_params = """

src/display/formatting.py

@@ -8,3 +8,9 @@ def styled_warning(warn):
 
 def styled_message(message):
     return f"<p style='color: green; font-size: 20px; text-align: center;'>{message}</p>"
+
+
+def markdown_link(text: str | None, url: str | None) -> str:
+    if text is None or url is None:
+        return text
+    return f"[{text}]({url})"

src/leaderboard/output.py

@@ -12,17 +12,28 @@ def format_output_df(df: pd.DataFrame) -> pd.DataFrame:
     # Create a new DataFrame with the display columns
     result_df = pd.DataFrame()
     result_df[DisplayColumns.EXPERIMENT_NAME] = df[RequiredInputColumns.EXPERIMENT_ID]
-    result_df[DisplayColumns.AGENT] = df[RequiredInputColumns.AGENT]
+
+    # Format Agent column as Markdown (ensure it's displayed properly)
+    result_df[DisplayColumns.AGENT] = df[RequiredInputColumns.AGENT].astype(str)
+
+    # Format LLM(s) used with HuggingFace links
     result_df[DisplayColumns.LLM_USED] = df[RequiredInputColumns.LLM_USED]
+
     result_df[DisplayColumns.NORMALIZED_SCORE] = (
         df[RequiredInputColumns.MEAN_NORMALIZED_SCORE].round(3).astype(str)
         + " ± "
         + df[RequiredInputColumns.STD_NORMALIZED_SCORE].round(3).astype(str)
     )
+
+    # Keep the numeric mean_normalized_score for gradient calculation
+    result_df[RequiredInputColumns.MEAN_NORMALIZED_SCORE] = df[RequiredInputColumns.MEAN_NORMALIZED_SCORE]
+    result_df[RequiredInputColumns.MEAN_MEDAL_PCT] = df[RequiredInputColumns.MEAN_MEDAL_PCT]
+
     result_df[DisplayColumns.ANY_MEDAL_SCORE] = (
         (df[RequiredInputColumns.MEAN_MEDAL_PCT] * 100).round(1).astype(str)
         + " ± "
         + (df[RequiredInputColumns.SEM_MEDAL_PCT] * 100).round(1).astype(str)
     )
+
     result_df[DisplayColumns.DATE] = df[RequiredInputColumns.DATE]
-    return result_df[DisplayColumns.values()]
+    return result_df

tests/test_leaderboard.py

@@ -4,7 +4,7 @@ import pandas as pd
 import pytest
 import requests
 
-from app import download_leaderboard, refresh_leaderboard
+from app import load_leaderboard, refresh_leaderboard
 from src.leaderboard.columns import DisplayColumns
 
 
@@ -49,7 +49,7 @@ class TestDownloadLeaderboard:
         mock_download.return_value = sample_csv_data
 
         # Execute
-        df = download_leaderboard()
+        df = load_leaderboard()
 
         # Assertions
         assert isinstance(df, pd.DataFrame)
@@ -62,7 +62,7 @@ class TestDownloadLeaderboard:
         """Test that numeric columns are properly formatted as mean ± std."""
         mock_download.return_value = sample_csv_data
 
-        df = download_leaderboard()
+        df = load_leaderboard()
 
         # Check that scores are formatted as strings with mean ± std
         # df is sorted by score descending: exp_003 (0.912), exp_001 (0.854), exp_002 (0.789)
@@ -77,7 +77,7 @@ class TestDownloadLeaderboard:
         """Test that medal percentages are converted from decimal to percentage and formatted."""
         mock_download.return_value = sample_csv_data
 
-        df = download_leaderboard()
+        df = load_leaderboard()
 
         # Check percentage conversion and formatting (0.876543 * 100 = 87.6543, rounded to 87.7)
         # df is sorted by score descending: exp_003 (92.3), exp_001 (87.7), exp_002 (76.5)
@@ -90,7 +90,7 @@ class TestDownloadLeaderboard:
         """Test that dates are properly formatted."""
         mock_download.return_value = sample_csv_data
 
-        df = download_leaderboard()
+        df = load_leaderboard()
 
         # Check date formatting - df sorted by score descending
         # exp_003 (2024-02-01), exp_001 (2024-01-15), exp_002 (2024-01-20)
@@ -103,7 +103,7 @@ class TestDownloadLeaderboard:
         """Test that df is sorted by mean_normalized_score descending."""
         mock_download.return_value = sample_csv_data
 
-        df = download_leaderboard()
+        df = load_leaderboard()
 
         # Check sorting (highest score first)
         # Extract numeric scores from formatted strings for comparison
@@ -117,7 +117,7 @@ class TestDownloadLeaderboard:
         """Test that extra columns are filtered out."""
         mock_download.return_value = sample_csv_with_extra_columns
 
-        df = download_leaderboard()
+        df = load_leaderboard()
 
         # Check that df is created correctly (extra columns should be filtered)
         assert len(df) == 2
@@ -131,7 +131,7 @@ class TestDownloadLeaderboard:
         mock_download.return_value = sample_csv_missing_columns
 
         with pytest.raises(ValueError, match="Leaderboard is missing expected columns"):
-            download_leaderboard()
+            load_leaderboard()
 
     @patch("src.leaderboard.input.download_github_file_content")
     def test_http_error(self, mock_download):
@@ -139,7 +139,7 @@ class TestDownloadLeaderboard:
         mock_download.side_effect = requests.HTTPError("404 Not Found")
 
         with pytest.raises(requests.HTTPError):
-            download_leaderboard()
+            load_leaderboard()
 
     @patch("src.leaderboard.input.download_github_file_content")
     def test_network_error(self, mock_download):
@@ -147,7 +147,7 @@ class TestDownloadLeaderboard:
         mock_download.side_effect = requests.ConnectionError("Connection failed")
 
         with pytest.raises(requests.ConnectionError):
-            download_leaderboard()
+            load_leaderboard()
 
     @patch("src.leaderboard.input.download_github_file_content")
     def test_timeout_handling(self, mock_download):
@@ -159,7 +159,7 @@ class TestDownloadLeaderboard:
         )
         mock_download.return_value = csv_data
 
-        download_leaderboard()
+        load_leaderboard()
 
         # Verify timeout was passed to download_github_file_content
         mock_download.assert_called_once()
@@ -176,7 +176,7 @@ class TestDownloadLeaderboard:
         )
         mock_download.return_value = csv_data
 
-        df = download_leaderboard()
+        df = load_leaderboard()
 
         assert isinstance(df, pd.DataFrame)
         assert len(df) == 0
@@ -193,7 +193,7 @@ class TestDownloadLeaderboard:
         )
         mock_download.return_value = csv_with_invalid_date
 
-        df = download_leaderboard()
+        df = load_leaderboard()
 
         # Invalid dates should become NaT and then "nan" string
         # Find rows by Experiment Name since order may vary
@@ -208,7 +208,7 @@ class TestDownloadLeaderboard:
         # The utility function handles LFS internally, so we just return the content
         mock_download.return_value = sample_csv_data
 
-        df = download_leaderboard()
+        df = load_leaderboard()
 
         # Should successfully download via download_url
         assert isinstance(df, pd.DataFrame)
@@ -222,7 +222,7 @@ class TestDownloadLeaderboard:
         # The utility function handles download_url internally, so we just return the content
         mock_download.return_value = sample_csv_data
 
-        df = download_leaderboard()
+        df = load_leaderboard()
 
         assert isinstance(df, pd.DataFrame)
         assert len(df) == 3