Full pipeline flow through web interface with live updates

API:
  POST /api/tasks/{id}/run — sets task to in_progress immediately,
    launches subprocess with error handling and logging.
  GET /api/tasks/{id}/running — checks pipelines table for active run.
  Fixed --db flag position in subprocess command.

TaskDetail (live pipeline):
  - Run button starts pipeline, auto-starts 3s polling
  - Pipeline cards update in real-time as agent_logs appear
  - Pulsing blue dot on header while in_progress
  - Spinner on run button during execution
  - Auto-stops polling when status changes from in_progress
  - Cleanup on component unmount (no leaked timers)

ProjectView (run from list):
  - [>] button on each pending task row
  - Confirm dialog before starting
  - Pulsing blue dot for in_progress tasks
  - Click task row → /task/:id with live view

Dashboard (live statuses):
  - Pulsing blue dot next to active task count
  - Auto-poll every 5s when any project has active tasks
  - Stops polling when no active tasks

5 new API tests (running endpoint, run sets status, not found).
141 tests total, all passing. Frontend builds clean.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
johnfrum1234 2026-03-15 15:29:05 +02:00
parent ab693d3c4d
commit db1729730f
5 changed files with 145 additions and 33 deletions

View file

@ -31,7 +31,23 @@ async function load() {
}
}
onMounted(load)
let dashPollTimer: ReturnType<typeof setInterval> | null = null
onMounted(async () => {
await load()
// Poll if there are running tasks
checkAndPoll()
})
function checkAndPoll() {
const hasRunning = projects.value.some(p => p.active_tasks > 0)
if (hasRunning && !dashPollTimer) {
dashPollTimer = setInterval(load, 5000)
} else if (!hasRunning && dashPollTimer) {
clearInterval(dashPollTimer)
dashPollTimer = null
}
}
const costMap = computed(() => {
const m: Record<string, number> = {}
@ -115,7 +131,10 @@ async function runBootstrap() {
</div>
<div class="flex gap-4 text-xs">
<span class="text-gray-500">{{ p.total_tasks }} tasks</span>
<span v-if="p.active_tasks" class="text-blue-400">{{ p.active_tasks }} active</span>
<span v-if="p.active_tasks" class="text-blue-400">
<span class="inline-block w-1.5 h-1.5 bg-blue-500 rounded-full animate-pulse mr-0.5"></span>
{{ p.active_tasks }} active
</span>
<span v-if="p.review_tasks" class="text-yellow-400">{{ p.review_tasks }} awaiting review</span>
<span v-if="p.blocked_tasks" class="text-red-400">{{ p.blocked_tasks }} blocked</span>
<span v-if="p.done_tasks" class="text-green-500">{{ p.done_tasks }} done</span>