From 7c6ea6bf51e80094d037328d72cabca5c7477462 Mon Sep 17 00:00:00 2001
From: James Barford-Evans <james.barford-evans@arm.com>
Date: Tue, 14 Oct 2025 14:32:49 +0100
Subject: [PATCH 1/2] Job completion progress in the timeline

---
 site/frontend/src/pages/status_new/page.vue | 31 +++++++++++++++++++++
 1 file changed, 31 insertions(+)

diff --git a/site/frontend/src/pages/status_new/page.vue b/site/frontend/src/pages/status_new/page.vue
index 7572fafbb..118fbb171 100644
--- a/site/frontend/src/pages/status_new/page.vue
+++ b/site/frontend/src/pages/status_new/page.vue
@@ -13,6 +13,7 @@ import {useExpandedStore} from "../../utils/expansion";
 import {
   BenchmarkRequest,
   BenchmarkRequestStatus,
+  BenchmarkJob,
   CollectorConfig,
   StatusResponse,
 } from "./data";
@@ -122,6 +123,32 @@ function PullRequestLink({request}: {request: BenchmarkRequest}) {
   );
 }
 
+// This works off the assumption that all of the collectors are working on the
+// same request.
+function getJobCompletion(
+  req: BenchmarkRequest,
+  collectors: CollectorConfig[]
+) {
+  const sampleJob = collectors?.[0]?.jobs?.[0];
+  if (!sampleJob) return "";
+  if (sampleJob.requestTag !== req.tag) return "";
+
+  const allJobs: BenchmarkJob[] = [];
+  for (const collector of collectors) {
+    allJobs.push(...collector.jobs);
+  }
+  const completed = allJobs.reduce((acc, job) => {
+    if (job.status === "Failed" || job.status === "Success") {
+      acc += 1;
+    }
+    return acc;
+  }, 0);
+  if (allJobs.length) {
+    return `${completed} / ${allJobs.length}`;
+  }
+  return "";
+}
+
 const {toggleExpanded: toggleExpandedErrors, isExpanded: hasExpandedErrors} =
   useExpandedStore();
 
@@ -143,6 +170,7 @@ loadStatusData(loading);
               <th>Kind</th>
               <th>Tag</th>
               <th>Status</th>
+              <th>Jobs Complete</th>
               <th>Completed At</th>
               <th>Duration</th>
               <th>Errors</th>
@@ -162,6 +190,9 @@ loadStatusData(loading);
                     req.status === "Completed" && req.hasPendingJobs ? "*" : ""
                   }}
                 </td>
+                <td>
+                  {{ getJobCompletion(req, data.collectors) }}
+                </td>
                 <td>
                   {{ formatISODate(req.completedAt) }}
                   <span v-if="req.endEstimated">(est.)</span>

From c0a6c87abb154d1c06dc3e61b9927260732b2c94 Mon Sep 17 00:00:00 2001
From: James Barford-Evans <james.barford-evans@arm.com>
Date: Wed, 15 Oct 2025 09:06:56 +0100
Subject: [PATCH 2/2] PR Feedback; change check for job progress & small
 refactor for job completion

---
 .../src/pages/status_new/collector.vue        |  6 ++---
 site/frontend/src/pages/status_new/data.ts    |  4 +++
 site/frontend/src/pages/status_new/page.vue   | 25 +++++++------------
 3 files changed, 15 insertions(+), 20 deletions(-)

diff --git a/site/frontend/src/pages/status_new/collector.vue b/site/frontend/src/pages/status_new/collector.vue
index 34c8b90c0..bc15c298a 100644
--- a/site/frontend/src/pages/status_new/collector.vue
+++ b/site/frontend/src/pages/status_new/collector.vue
@@ -2,7 +2,7 @@
 import {h, ref, Ref} from "vue";
 import {parseISO, differenceInHours} from "date-fns";
 import {formatISODate, shortenTag} from "../../utils/formatting";
-import {CollectorConfig, BenchmarkJobStatus} from "./data";
+import {CollectorConfig, BenchmarkJobStatus, isJobComplete} from "./data";
 
 const props = defineProps<{
   collector: CollectorConfig;
@@ -56,9 +56,7 @@ function ActiveStatus({collector}: {collector: CollectorConfig}) {
         statusText = "Offline";
         statusClass = "offline";
       } else {
-        const allJobsComplete = collector.jobs.every(
-          (job) => job.status === "Failed" || job.status === "Success"
-        );
+        const allJobsComplete = collector.jobs.every(isJobComplete);
         if (allJobsComplete) {
           statusText = "Waiting";
           statusClass = "waiting";
diff --git a/site/frontend/src/pages/status_new/data.ts b/site/frontend/src/pages/status_new/data.ts
index 1ef129c9f..7b6d07055 100644
--- a/site/frontend/src/pages/status_new/data.ts
+++ b/site/frontend/src/pages/status_new/data.ts
@@ -42,3 +42,7 @@ export type StatusResponse = {
   requests: BenchmarkRequest[];
   collectors: CollectorConfig[];
 };
+
+export function isJobComplete(job: BenchmarkJob): boolean {
+  return job.status === "Failed" || job.status === "Success";
+}
diff --git a/site/frontend/src/pages/status_new/page.vue b/site/frontend/src/pages/status_new/page.vue
index 118fbb171..38fb34948 100644
--- a/site/frontend/src/pages/status_new/page.vue
+++ b/site/frontend/src/pages/status_new/page.vue
@@ -13,9 +13,9 @@ import {useExpandedStore} from "../../utils/expansion";
 import {
   BenchmarkRequest,
   BenchmarkRequestStatus,
-  BenchmarkJob,
   CollectorConfig,
   StatusResponse,
+  isJobComplete,
 } from "./data";
 import Collector from "./collector.vue";
 
@@ -123,30 +123,23 @@ function PullRequestLink({request}: {request: BenchmarkRequest}) {
   );
 }
 
-// This works off the assumption that all of the collectors are working on the
-// same request.
 function getJobCompletion(
   req: BenchmarkRequest,
   collectors: CollectorConfig[]
 ) {
-  const sampleJob = collectors?.[0]?.jobs?.[0];
-  if (!sampleJob) return "";
-  if (sampleJob.requestTag !== req.tag) return "";
-
-  const allJobs: BenchmarkJob[] = [];
-  for (const collector of collectors) {
-    allJobs.push(...collector.jobs);
+  const jobs = collectors
+    .flatMap((c) => c.jobs)
+    .filter((j) => j.requestTag === req.tag);
+  if (jobs.length === 0) {
+    return "";
   }
-  const completed = allJobs.reduce((acc, job) => {
-    if (job.status === "Failed" || job.status === "Success") {
+  const completed = jobs.reduce((acc, job) => {
+    if (isJobComplete(job)) {
       acc += 1;
     }
     return acc;
   }, 0);
-  if (allJobs.length) {
-    return `${completed} / ${allJobs.length}`;
-  }
-  return "";
+  return `${completed} / ${jobs.length}`;
 }
 
 const {toggleExpanded: toggleExpandedErrors, isExpanded: hasExpandedErrors} =