From 947a1a778eacf27a9abddec4c602cbc223ad3ec1 Mon Sep 17 00:00:00 2001
From: Deeman <hendriknote@gmail.com>
Date: Wed, 25 Feb 2026 12:53:36 +0100
Subject: [PATCH] feat(pipeline): extractions tab template

- Filterable extraction run history table (extractor + status dropdowns,
  HTMX live filter via 'change' trigger)
- Status badges with stale row highlighting (amber background)
- 'Mark Failed' button for stuck 'running' rows (with confirm dialog)
- 'Run All Extractors' trigger button
- Pagination via hx-vals

Subtask 3 of 6

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 .../admin/partials/pipeline_extractions.html  | 135 ++++++++++++++++++
 1 file changed, 135 insertions(+)
 create mode 100644 web/src/padelnomics/admin/templates/admin/partials/pipeline_extractions.html

diff --git a/web/src/padelnomics/admin/templates/admin/partials/pipeline_extractions.html b/web/src/padelnomics/admin/templates/admin/partials/pipeline_extractions.html
new file mode 100644
index 0000000..de54678
--- /dev/null
+++ b/web/src/padelnomics/admin/templates/admin/partials/pipeline_extractions.html
@@ -0,0 +1,135 @@
+<!-- Pipeline Extractions Tab: filterable run history + mark-stale + trigger -->
+
+<!-- Filter bar + trigger button -->
+<div class="card mb-4" style="padding:0.875rem 1.25rem">
+  <div class="flex items-center justify-between gap-3 flex-wrap">
+    <form id="extraction-filters"
+          hx-get="{{ url_for('pipeline.pipeline_extractions') }}"
+          hx-target="#pipeline-tab-content"
+          hx-swap="innerHTML"
+          hx-trigger="change"
+          class="flex gap-3 items-end flex-wrap">
+      <div>
+        <label class="form-label">Extractor</label>
+        <select name="extractor" class="form-input" style="min-width:180px">
+          <option value="" {% if not extractor_filter %}selected{% endif %}>All extractors</option>
+          {% for name in extractors %}
+          <option value="{{ name }}" {% if extractor_filter == name %}selected{% endif %}>{{ name }}</option>
+          {% endfor %}
+        </select>
+      </div>
+      <div>
+        <label class="form-label">Status</label>
+        <select name="status" class="form-input">
+          <option value="" {% if not status_filter %}selected{% endif %}>All statuses</option>
+          <option value="success" {% if status_filter == 'success' %}selected{% endif %}>Success</option>
+          <option value="failed"  {% if status_filter == 'failed' %}selected{% endif %}>Failed</option>
+          <option value="running" {% if status_filter == 'running' %}selected{% endif %}>Running</option>
+        </select>
+      </div>
+    </form>
+
+    <form method="post" action="{{ url_for('pipeline.pipeline_trigger_extract') }}" class="m-0">
+      <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
+      <button type="button" class="btn-outline btn-sm"
+              onclick="confirmAction('Enqueue a full extraction run? This will run all extractors in the background.', this.closest('form'))">
+        Run All Extractors
+      </button>
+    </form>
+  </div>
+</div>
+
+<!-- Run history -->
+<div class="card">
+  <div class="flex justify-between items-center mb-3">
+    <p class="text-sm text-slate">
+      Showing {{ runs | length }} of {{ total }} run{{ 's' if total != 1 }}
+      {% if extractor_filter or status_filter %} (filtered){% endif %}
+    </p>
+    {% if total_pages > 1 %}
+    <div class="flex gap-2 items-center">
+      {% if page > 1 %}
+      <button class="btn-outline btn-sm"
+              hx-get="{{ url_for('pipeline.pipeline_extractions') }}"
+              hx-vals='{"page": "{{ page - 1 }}", "extractor": "{{ extractor_filter }}", "status": "{{ status_filter }}"}'
+              hx-target="#pipeline-tab-content" hx-swap="innerHTML">← Prev</button>
+      {% endif %}
+      <span class="text-xs text-slate">{{ page }} / {{ total_pages }}</span>
+      {% if page < total_pages %}
+      <button class="btn-outline btn-sm"
+              hx-get="{{ url_for('pipeline.pipeline_extractions') }}"
+              hx-vals='{"page": "{{ page + 1 }}", "extractor": "{{ extractor_filter }}", "status": "{{ status_filter }}"}'
+              hx-target="#pipeline-tab-content" hx-swap="innerHTML">Next →</button>
+      {% endif %}
+    </div>
+    {% endif %}
+  </div>
+
+  {% if runs %}
+  <div style="overflow-x:auto">
+    <table class="table">
+      <thead>
+        <tr>
+          <th style="width:60px">#</th>
+          <th>Extractor</th>
+          <th>Started</th>
+          <th>Duration</th>
+          <th>Status</th>
+          <th style="text-align:right">Files</th>
+          <th style="text-align:right">Size</th>
+          <th>Error</th>
+          <th></th>
+        </tr>
+      </thead>
+      <tbody>
+        {% for run in runs %}
+        <tr{% if run.is_stale %} style="background:#FFFBEB"{% endif %}>
+          <td class="mono text-xs text-slate">#{{ run.run_id }}</td>
+          <td class="text-sm font-medium">{{ run.extractor }}</td>
+          <td class="mono text-xs">{{ run.started_at[:16].replace('T', ' ') if run.started_at else '—' }}</td>
+          <td class="mono text-xs text-slate">{{ run.duration or '—' }}</td>
+          <td>
+            {% if run.is_stale %}
+            <span class="badge-warning">stale</span>
+            {% elif run.status == 'success' %}
+            <span class="badge-success">success</span>
+            {% elif run.status == 'failed' %}
+            <span class="badge-danger">failed</span>
+            {% else %}
+            <span class="badge" style="background:#EFF6FF;color:#1D4ED8">{{ run.status }}</span>
+            {% endif %}
+          </td>
+          <td class="text-right text-xs">{{ run.files_written or 0 }}</td>
+          <td class="text-right mono text-xs">{{ run.bytes_label }}</td>
+          <td style="max-width:200px">
+            {% if run.error_message %}
+            <span class="text-xs text-danger mono" style="word-break:break-all" title="{{ run.error_message }}">
+              {{ run.error_message[:60] }}{% if run.error_message|length > 60 %}…{% endif %}
+            </span>
+            {% endif %}
+          </td>
+          <td>
+            {% if run.status == 'running' %}
+            <form method="post"
+                  action="{{ url_for('pipeline.pipeline_mark_stale', run_id=run.run_id) }}"
+                  class="m-0">
+              <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
+              <button type="button" class="btn-danger btn-sm"
+                      style="padding:2px 8px;font-size:11px"
+                      onclick="confirmAction('Mark run #{{ run.run_id }} as failed? Only do this if the process is definitely dead.', this.closest('form'))">
+                Mark Failed
+              </button>
+            </form>
+            {% endif %}
+          </td>
+        </tr>
+        {% endfor %}
+      </tbody>
+    </table>
+  </div>
+  {% else %}
+  <p class="text-sm text-slate text-center" style="padding:2rem 0">
+    No extraction runs found{% if extractor_filter or status_filter %} matching the current filters{% endif %}.
+  </p>
+  {% endif %}
+</div>