stats: allow selection of all or single branch in by-version graph

asu/main.py

@@ -67,6 +67,7 @@ def index(request: Request):
         name="overview.html",
         context=dict(
             versions=app.versions,
+            branches=reversed(settings.branches),
             defaults=settings.allow_defaults,
             version=__version__,
             server_stats=settings.server_stats,

asu/templates/overview.html

@@ -77,7 +77,14 @@ <h2>Builds per Day (last 30 days)</h2>
                         <canvas id="buildsChart" width="600" height="300"></canvas>
                     </div>
                     <div class="grid-item">
-                        <h2>Weekly build counts by branch (last 6 months)</h2>
+                        <h2>Weekly build counts by branch (last 6 months)
+                            <select name="branchName" id="branchName" onchange="loadVersions()">
+                                <option value="">All</option>
+                                {% for branch in branches %}
+                                <option value="{{ branch }}">{{ branch }}</option>
+                                {%- endfor -%}
+                            </select>
+                        </h2>
                         <canvas id="versionChart" width="600" height="300"></canvas>
                     </div>
                     {% endif %}
@@ -114,6 +121,11 @@ <h2>Weekly build counts by branch (last 6 months)</h2>
                 const response = await fetch(`/api/v1/${chartSource}`);
                 const data = await response.json();
 
+                const oldChart = Chart.getChart(canvas);
+                if (oldChart !== undefined) {
+                    oldChart.destroy();
+                }
+
                 const countChart = new Chart(document.getElementById(canvas), {
                     type: "line",
                     data: {
@@ -142,13 +154,16 @@ <h2>Weekly build counts by branch (last 6 months)</h2>
             }
 
             loadChart("builds-per-day", "buildsChart");
-            loadChart("builds-by-version", "versionChart");
 
-            /* We could add a dropdown with branch values, then show the
-               per-version values just for that branch like this:
+            function loadVersions() {
+                let branch = document.getElementById("branchName").value;
+                if (branch != "") {
+                    branch = `?branch=${branch}`;
+                }
+                loadChart(`builds-by-version${branch}`, "versionChart");
+            }
 
-               loadChart("builds-by-version?branch=24.10", "versionChart");
-            */
+            loadVersions();
         </script>
 {% endif %}
 

tests/test_stats.py

@@ -165,3 +165,10 @@ def test_stats_builds_by_version(client, redis_server: FakeStrictRedis):
     assert "datasets" in data
     assert len(data["datasets"]) == 1
     assert len(data["datasets"][0]["data"]) == 26
+
+    response = client.get("/api/v1/builds-by-version?branch=1.2")
+    assert response.status_code == 200
+
+    data = response.json()
+    assert len(data["labels"]) == 26
+    assert len(data["datasets"][0]["data"]) == 26