From 1cafe2b45a087ade52f097aa7a7661520c2a2a85 Mon Sep 17 00:00:00 2001
From: Daniel Gradman-Svendsen <daniel@dasv.dk>
Date: Wed, 29 Jul 2026 14:45:31 +0200
Subject: [PATCH] Build jobs queue UI for issue #8

---
 importarr/main.py              | 96 +++++++++++++++++++++++++++++-----
 importarr/state.py             |  9 ++++
 importarr/static/importarr.css |  2 +-
 importarr/templates/index.html | 19 ++++---
 tests/test_queue_controls.py   | 31 +++++++++++
 5 files changed, 136 insertions(+), 21 deletions(-)

diff --git a/importarr/main.py b/importarr/main.py
index be89765..289b36b 100644
--- a/importarr/main.py
+++ b/importarr/main.py
@@ -37,6 +37,10 @@ class QueueControlRequest(BaseModel):
     mode: str
 
 
+class QueueItemActionRequest(BaseModel):
+    action: str
+
+
 def require_write_auth(authorization: Annotated[str | None, Header()] = None) -> None:
     if not settings.auth_token:
         return
@@ -173,6 +177,25 @@ def history() -> list[dict[str, object]]:
     return state.list_history()
 
 
+@app.post("/api/queue-items/{item_id}/action")
+def queue_item_action(item_id: int, payload: QueueItemActionRequest, _: None = Depends(require_write_auth)) -> dict[str, object]:
+    item = state.get_queue_item(item_id)
+    if item is None:
+        raise HTTPException(status_code=404, detail="queue item not found")
+    if payload.action == "retry":
+        retry_state = "manual_batch" if item["source_type"] == "manual" else "ready"
+        state.mark_queue_item(item["source_type"], item["source_id"], retry_state, "retry requested")
+    elif payload.action == "ignore":
+        state.mark_queue_item(item["source_type"], item["source_id"], "skipped", "ignored by user")
+    elif payload.action == "remove":
+        state.delete_queue_item(item_id)
+        return {"status": "removed", "id": item_id}
+    else:
+        raise HTTPException(status_code=400, detail="action must be retry, ignore, or remove")
+    updated = state.get_queue_item(item_id)
+    return {"status": "updated", "item": serialize_queue_item(updated or item)}
+
+
 @app.get("/api/jobs")
 async def jobs() -> dict[str, object]:
     return await preview()
@@ -183,7 +206,7 @@ async def preview() -> dict[str, object]:
     if queue_accepting_new_jobs():
         await sync_queue()
     jobs = queue_jobs()
-    return {"sab_status": "ok", "jobs": jobs, "would_import": sum(1 for row in jobs if row["state"] in {"ready", "manual_batch"}), "control": control_status()}
+    return {"sab_status": "ok", "jobs": jobs, "groups": group_jobs(jobs), "would_import": sum(1 for row in jobs if row["state"] in {"ready", "manual_batch"}), "control": control_status()}
 
 
 async def sync_queue() -> None:
@@ -209,19 +232,64 @@ async def sync_queue() -> None:
 
 
 def queue_jobs() -> list[dict[str, object]]:
-    return [
-        {
-            "name": item["name"],
-            "state": item["state"],
-            "reason": item["reason"],
-            "relative_path": item["relative_path"],
-            "storage": item["source_path"],
-            "size": item["size"],
-            "source_type": item["source_type"],
-        }
-        for item in state.list_queue_items()
-        if item["source_type"] != "system"
-    ]
+    return [serialize_queue_item(item) for item in state.list_queue_items(active_only=False) if item["source_type"] != "system"]
+
+
+def serialize_queue_item(item: dict[str, object]) -> dict[str, object]:
+    state_name = str(item["state"])
+    source_type = str(item["source_type"])
+    return {
+        "id": item["id"],
+        "name": item["name"],
+        "state": state_name,
+        "group": job_group(state_name, source_type),
+        "reason": item["reason"],
+        "relative_path": item["relative_path"],
+        "storage": item["source_path"],
+        "size": item["size"],
+        "source_type": source_type,
+        "source_id": item["source_id"],
+        "job_id": item["job_id"],
+        "batch_id": item["batch_id"],
+        "first_seen_at": item["first_seen_at"],
+        "updated_at": item["updated_at"],
+        "completed_at": item["completed_at"],
+        "sab_status": state_name if source_type == "sab" else None,
+        "sab_category": settings.sab_category if source_type == "sab" else None,
+        "can_run_now": state_name in {"ready", "manual_batch", "failed"},
+        "can_retry": state_name in {"failed", "skipped"},
+        "can_ignore": state_name not in {"imported", "skipped"},
+        "can_remove": True,
+    }
+
+
+def job_group(state_name: str, source_type: str) -> str:
+    if source_type == "manual":
+        return "manual_batch"
+    if state_name == "ready":
+        return "ready"
+    if state_name in {"importing", "copying"}:
+        return "importing"
+    if state_name == "failed":
+        return "failed"
+    if state_name == "skipped":
+        return "ignored_category"
+    if state_name == "imported":
+        return "completed"
+    return "sab_processing"
+
+
+def group_jobs(jobs: list[dict[str, object]]) -> list[dict[str, object]]:
+    labels = {
+        "sab_processing": "SAB processing",
+        "ready": "Ready",
+        "importing": "Importing",
+        "failed": "Failed",
+        "ignored_category": "Ignored category",
+        "manual_batch": "Manual batch",
+        "completed": "Completed",
+    }
+    return [{"key": key, "label": label, "jobs": [job for job in jobs if job["group"] == key]} for key, label in labels.items()]
 
 
 def manual_batch_jobs() -> list[dict[str, object]]:
diff --git a/importarr/state.py b/importarr/state.py
index d5c6270..f6f598f 100644
--- a/importarr/state.py
+++ b/importarr/state.py
@@ -141,6 +141,15 @@ class State:
         )
         self.conn.commit()
 
+    def delete_queue_item(self, item_id: int) -> bool:
+        cursor = self.conn.execute("delete from import_queue_items where id = ?", (item_id,))
+        self.conn.commit()
+        return cursor.rowcount > 0
+
+    def get_queue_item(self, item_id: int) -> dict[str, Any] | None:
+        row = self.conn.execute("select * from import_queue_items where id = ?", (item_id,)).fetchone()
+        return dict(row) if row else None
+
     def remove_missing_manual_items(self, batch_id: int, source_ids: set[str]) -> None:
         rows = self.conn.execute("select source_id from import_queue_items where source_type='manual' and batch_id=?", (batch_id,)).fetchall()
         for row in rows:
diff --git a/importarr/static/importarr.css b/importarr/static/importarr.css
index f42c6a8..2a4e44e 100644
--- a/importarr/static/importarr.css
+++ b/importarr/static/importarr.css
@@ -1 +1 @@
-body{font-family:system-ui,sans-serif;margin:0;background:#111827;color:#e5e7eb}header,main{max-width:1100px;margin:auto;padding:1rem}.topbar{display:flex;justify-content:space-between;gap:1rem;align-items:center;background:#0f172a}.build{text-align:right}.build strong{font-size:1.2rem}.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(12rem,1fr));gap:1rem}.cards article,.panel{background:#1f2937;border-radius:.75rem;padding:1rem;margin-top:1rem}strong{display:block;font-size:2rem}span,small,dd{color:#9ca3af}table{width:100%;border-collapse:collapse;background:#1f2937;margin-top:1rem}th,td{padding:.6rem;border-bottom:1px solid #374151;text-align:left}input,button{padding:.6rem;border-radius:.4rem;border:1px solid #374151}button{background:#38bdf8;color:#082f49;font-weight:700}.danger{background:#f87171;color:#450a0a}.controls{display:flex;gap:.5rem;flex-wrap:wrap}.inline-form{display:flex;gap:.5rem;flex-wrap:wrap}.inline-form input[name=path]{min-width:min(100%,28rem);flex:1}.info{display:grid;grid-template-columns:10rem 1fr;gap:.4rem 1rem}.info dt{font-weight:700}.info dd{margin:0;overflow-wrap:anywhere}.state{background:#0f172a;border:1px solid #374151;border-radius:999px;padding:.15rem .5rem}
+body{font-family:system-ui,sans-serif;margin:0;background:#111827;color:#e5e7eb}header,main{max-width:1100px;margin:auto;padding:1rem}.topbar{display:flex;justify-content:space-between;gap:1rem;align-items:center;background:#0f172a}.build{text-align:right}.build strong{font-size:1.2rem}.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(12rem,1fr));gap:1rem}.cards article,.panel{background:#1f2937;border-radius:.75rem;padding:1rem;margin-top:1rem}strong{display:block;font-size:2rem}span,small,dd{color:#9ca3af}table{width:100%;border-collapse:collapse;background:#1f2937;margin-top:1rem}th,td{padding:.6rem;border-bottom:1px solid #374151;text-align:left;vertical-align:top}input,button{padding:.6rem;border-radius:.4rem;border:1px solid #374151}button{background:#38bdf8;color:#082f49;font-weight:700;cursor:pointer}.danger{background:#f87171;color:#450a0a}.warn{background:#fbbf24;color:#451a03}.controls,.row-actions{display:flex;gap:.5rem;flex-wrap:wrap}.inline-form{display:flex;gap:.5rem;flex-wrap:wrap}.inline-form input[name=path]{min-width:min(100%,28rem);flex:1}.info{display:grid;grid-template-columns:10rem 1fr;gap:.4rem 1rem}.info dt{font-weight:700}.info dd{margin:0;overflow-wrap:anywhere}.state{background:#0f172a;border:1px solid #374151;border-radius:999px;padding:.15rem .5rem;display:inline-block}.section-title{display:flex;align-items:center;justify-content:space-between;gap:1rem}.job-group{margin-top:1.25rem}.job-group h3{display:flex;gap:.5rem;align-items:center}.job-group h3 span{font-size:.9rem;border:1px solid #374151;border-radius:999px;padding:.1rem .45rem}.file-name{font-size:1rem}.row-actions button{padding:.35rem .5rem}td small{display:block;overflow-wrap:anywhere}
diff --git a/importarr/templates/index.html b/importarr/templates/index.html
index a3899fd..4076bd6 100644
--- a/importarr/templates/index.html
+++ b/importarr/templates/index.html
@@ -58,17 +58,24 @@
       {% for batch in batches %}<tr><td>{{ batch.id }}</td><td>{{ batch.status }}</td><td>{{ batch.path }}</td></tr>{% endfor %}
       </tbody></table>
     </section>
-    <section>
-      <h2>Jobs</h2><button id="force-run" type="button">Force run now</button><div id="jobs">Loading…</div>
+    <section class="panel">
+      <div class="section-title"><h2>Jobs and queue</h2><button id="force-run" type="button">Force run now</button></div>
+      <p>Rows are grouped by processing state. Failed and skipped rows can be retried; ignore and remove actions only update Importarr's queue.</p>
+      <div id="jobs">Loading…</div>
     </section>
   </main>
   <script>
-  async function refresh(){ const r=await fetch('/api/jobs'); const d=await r.json(); document.title=d.jobs.length?`📥 ${d.jobs.length} jobs - Importarr`:'📥 - idle · Importarr'; document.getElementById('jobs').innerHTML='<table><tr><th>Name</th><th>State</th><th>Context</th></tr>'+d.jobs.map(j=>`<tr><td>${j.name||''}</td><td><span class="state">${j.state}</span></td><td><small>${j.relative_path||j.storage||j.reason||''}</small></td></tr>`).join('')+'</table>'; if(d.control){ document.getElementById('queue-mode').textContent=d.control.queue_mode; document.getElementById('current-job').textContent=d.control.current||'idle'; } }
-  document.querySelectorAll('[data-control]').forEach(button=>button.addEventListener('click', async()=>{ await fetch(`/api/control/${button.dataset.control}`,{method:'POST'}); await refresh(); }));
+  const esc=value=>String(value??'').replace(/[&<>"']/g,ch=>({'&':'&amp;','<':'&lt;','>':'&gt;','"':'&quot;',"'":'&#39;'}[ch]));
+  async function postJson(url, body){ const response=await fetch(url,{method:'POST',headers:{'content-type':'application/json'},body:body?JSON.stringify(body):undefined}); if(!response.ok){ const error=await response.json().catch(()=>({detail:response.statusText})); alert(error.detail||'Request failed'); } return response; }
+  function actionButtons(j){ const buttons=[]; if(j.can_retry) buttons.push(`<button type="button" data-action="retry" data-id="${j.id}">Retry</button>`); if(j.can_ignore) buttons.push(`<button type="button" data-action="ignore" data-id="${j.id}" class="warn">Ignore</button>`); if(j.can_remove) buttons.push(`<button type="button" data-action="remove" data-id="${j.id}" class="danger">Remove</button>`); return buttons.join(' '); }
+  function renderJobs(data){ const groups=(data.groups||[]).filter(group=>group.jobs.length); if(!groups.length) return '<p>No queue items.</p>'; return groups.map(group=>`<section class="job-group"><h3>${esc(group.label)} <span>${group.jobs.length}</span></h3><table><thead><tr><th>File</th><th>Release / folder context</th><th>Readiness</th><th>SAB</th><th>Actions</th></tr></thead><tbody>${group.jobs.map(j=>`<tr><td><strong class="file-name">${esc(j.name)}</strong><small>${esc(j.source_type)}${j.batch_id?' · batch '+esc(j.batch_id):''}</small></td><td><small>${esc(j.relative_path||j.storage||j.source_id)}</small></td><td><span class="state">${esc(j.state)}</span><small>${esc(j.reason||'')}</small></td><td><small>${esc(j.sab_status||'—')}${j.sab_category?' · '+esc(j.sab_category):''}</small></td><td class="row-actions">${actionButtons(j)}</td></tr>`).join('')}</tbody></table></section>`).join(''); }
+  async function refresh(){ const r=await fetch('/api/jobs'); const d=await r.json(); document.title=d.jobs.length?`📥 ${d.jobs.length} jobs - Importarr`:'📥 - idle · Importarr'; document.getElementById('jobs').innerHTML=renderJobs(d); if(d.control){ document.getElementById('queue-mode').textContent=d.control.queue_mode; document.getElementById('current-job').textContent=d.control.current||'idle'; } }
+  document.getElementById('jobs').addEventListener('click', async e=>{ const button=e.target.closest('button[data-action]'); if(!button)return; const action=button.dataset.action; const destructive=['ignore','remove'].includes(action); if(destructive&&!confirm(`${action} this Importarr queue item?`)) return; await postJson(`/api/queue-items/${button.dataset.id}/action`,{action}); await refresh(); });
+  document.querySelectorAll('[data-control]').forEach(button=>button.addEventListener('click', async()=>{ if(button.dataset.control==='cancel-current'&&!confirm('Cancel the current import job?')) return; await postJson(`/api/control/${button.dataset.control}`); await refresh(); }));
   document.getElementById('browse-batch').addEventListener('click',()=>document.getElementById('batch-picker').click());
   document.getElementById('batch-picker').addEventListener('change',e=>{ const f=e.target.files[0]; if(!f)return; const top=(f.webkitRelativePath||'').split('/')[0]; if(top) document.querySelector('#batch-form [name="path"]').value=top; });
-  document.getElementById('batch-form').addEventListener('submit', async e=>{ e.preventDefault(); await fetch('/api/manual-batches',{method:'POST',headers:{'content-type':'application/json'},body:JSON.stringify({path:e.target.path.value})}); location.reload(); });
-  document.getElementById('force-run').addEventListener('click', async()=>{ await fetch('/api/import/run-now',{method:'POST',headers:{'content-type':'application/json'},body:JSON.stringify({force:true})}); await refresh(); });
+  document.getElementById('batch-form').addEventListener('submit', async e=>{ e.preventDefault(); const response=await postJson('/api/manual-batches',{path:e.target.path.value}); if(response.ok) location.reload(); });
+  document.getElementById('force-run').addEventListener('click', async()=>{ await postJson('/api/import/run-now',{force:true}); await refresh(); });
   refresh(); setInterval(refresh, 10000);
   </script>
 </body>
diff --git a/tests/test_queue_controls.py b/tests/test_queue_controls.py
index 0ecc26e..6d8097f 100644
--- a/tests/test_queue_controls.py
+++ b/tests/test_queue_controls.py
@@ -42,6 +42,37 @@ def test_start_reenables_manual_queue_sync(tmp_path, monkeypatch):
     assert len(main.state.list_queue_items()) == 1
 
 
+def test_queue_jobs_include_groups_and_manual_context(tmp_path, monkeypatch):
+    main, download, _movies, _tv = configure_main(tmp_path, monkeypatch)
+    batch = download / "Release" / "Season 1"
+    batch.mkdir(parents=True)
+    (batch / "Episode.mkv").write_bytes(b"episode")
+    main.state.add_manual_batch(batch.parent)
+
+    main.sync_manual_queue()
+    jobs = main.queue_jobs()
+
+    assert jobs[0]["group"] == "manual_batch"
+    assert jobs[0]["relative_path"] == "Release/Season 1/Episode.mkv"
+    assert jobs[0]["can_run_now"] is True
+
+
+def test_queue_item_retry_ignore_and_remove_actions(tmp_path, monkeypatch):
+    main, _download, _movies, _tv = configure_main(tmp_path, monkeypatch)
+    row = main.state.upsert_queue_item(source_type="sab", source_id="job-1", name="Release", state="failed", reason="ImportError")
+
+    retried = main.queue_item_action(row["id"], main.QueueItemActionRequest(action="retry"))
+    assert retried["item"]["state"] == "ready"
+    assert retried["item"]["reason"] == "retry requested"
+
+    ignored = main.queue_item_action(row["id"], main.QueueItemActionRequest(action="ignore"))
+    assert ignored["item"]["state"] == "skipped"
+
+    removed = main.queue_item_action(row["id"], main.QueueItemActionRequest(action="remove"))
+    assert removed == {"status": "removed", "id": row["id"]}
+    assert main.state.get_queue_item(row["id"]) is None
+
+
 def test_cancel_current_stops_before_next_manual_item(tmp_path, monkeypatch):
     main, download, movies, tv = configure_main(tmp_path, monkeypatch)
     batch = download / "Release"