Prefill date selectors on leadership page with earliest/latest dates

app/routes/leaderboard.py

@@ -1,6 +1,8 @@
 from flask import Blueprint, render_template
 from app.auth import login_required
-from app.db import query
+from app.db import query, query_one
+from app import SYDNEY_TZ
+from datetime import timezone
 
 bp = Blueprint("leaderboard", __name__)
 
@@ -54,4 +56,25 @@ def index():
     # Sort by % lost (descending)
     ranked.sort(key=lambda x: x["pct_lost"], reverse=True)
 
-    return render_template("leaderboard.html", ranked=ranked)
+    # Get earliest and latest check-in dates for date pickers
+    date_range = query_one("""
+        SELECT
+            MIN(c.checked_in_at) AS earliest,
+            MAX(c.checked_in_at) AS latest
+        FROM checkins c
+        JOIN users u ON u.id = c.user_id
+        WHERE u.is_private = FALSE
+    """)
+    earliest = ""
+    latest = ""
+    if date_range and date_range["earliest"]:
+        e = date_range["earliest"]
+        l = date_range["latest"]
+        if e.tzinfo is None:
+            e = e.replace(tzinfo=timezone.utc)
+        if l.tzinfo is None:
+            l = l.replace(tzinfo=timezone.utc)
+        earliest = e.astimezone(SYDNEY_TZ).strftime("%Y-%m-%d")
+        latest = l.astimezone(SYDNEY_TZ).strftime("%Y-%m-%d")
+
+    return render_template("leaderboard.html", ranked=ranked, earliest=earliest, latest=latest)

app/static/css/style.css

@@ -979,6 +979,25 @@ tr:hover td {
     td {
         padding: 0.5rem 0.65rem;
     }
+
+    .chart-filters {
+        flex-direction: column;
+        gap: 0.75rem;
+    }
+
+    .chart-filters .filter-group {
+        width: 100%;
+    }
+
+    .filter-group input[type="date"] {
+        width: 100%;
+        padding: 0.65rem 0.9rem;
+        font-size: 0.9rem;
+    }
+
+    .filter-group-people {
+        min-width: unset;
+    }
 }
 
 @media (max-width: 480px) {

app/templates/leaderboard.html

@@ -17,11 +17,11 @@
     <div class="chart-filters">
         <div class="filter-group">
             <label for="filterStart">From</label>
-            <input type="date" id="filterStart" class="form-input">
+            <input type="date" id="filterStart" class="form-input" value="{{ earliest }}">
         </div>
         <div class="filter-group">
             <label for="filterEnd">To</label>
-            <input type="date" id="filterEnd" class="form-input">
+            <input type="date" id="filterEnd" class="form-input" value="{{ latest }}">
         </div>
         <div class="filter-group filter-group-people">
             <label>People</label>