Files
windmill/frontend/src/lib/components/JobStatus.svelte
wendrul 203264b871 feat: warn when jobs spent a long time waiting in queue (#3856)
* Store jobs that waited for too long

* Add warnings as badges for long waited jobs

* Separate into self_wait_time and aggregate

Change the UI accordingly

* Prepare sqlx

* Update backend/windmill-queue/src/jobs.rs

Co-authored-by: ellipsis-dev[bot] <65095814+ellipsis-dev[bot]@users.noreply.github.com>

* Fix incorrect query

* Prepare sqlx

* Move insert to pull + UI fixes

Insert as soon as the job is pulled and therefore started.
Add a badge on the lfow timeline to show the self wait time

* Move to after the pull in the worker

Move the logic to after the pull in the worker in the case its not a
noop

* Remove weird line

* Remove unnecessary async

---------

Co-authored-by: ellipsis-dev[bot] <65095814+ellipsis-dev[bot]@users.noreply.github.com>
Co-authored-by: Ruben Fiszel <ruben@windmill.dev>
2024-06-03 16:05:15 +02:00

50 lines
2.0 KiB
Svelte

<script lang="ts">
import { displayDate } from '$lib/utils'
import type { CompletedJob, QueuedJob } from '$lib/gen'
import Badge from './common/badge/Badge.svelte'
import { forLater } from '$lib/forLater'
import DurationMs from './DurationMs.svelte'
import { Calendar, CheckCircle2, Circle, Clock, XCircle } from 'lucide-svelte'
import NoWorkerWithTagWarning from './runs/NoWorkerWithTagWarning.svelte'
const SMALL_ICON_SIZE = 12
export let job: QueuedJob | CompletedJob | undefined
</script>
{#if job && 'success' in job && job.success}
<div class="flex flex-row flex-wrap gap-y-1 mb-1 gap-x-2">
<Badge large color="green" icon={{ icon: CheckCircle2, position: 'left' }}>
Success {job.is_skipped ? '(Skipped)' : ''}
</Badge>
<DurationMs duration_ms={job.duration_ms} self_wait_time_ms={job?.self_wait_time_ms} aggregate_wait_time_ms={job?.aggregate_wait_time_ms} />
</div>
{:else if job && 'success' in job}
<div class="flex flex-row flex-wrap gap-y-1 mb-1 gap-x-2">
<Badge large color="red" icon={{ icon: XCircle, position: 'left' }}>Failed</Badge>
<DurationMs duration_ms={job.duration_ms} self_wait_time_ms={job?.self_wait_time_ms} aggregate_wait_time_ms={job?.aggregate_wait_time_ms} />
</div>
{:else if job && 'running' in job && job.running}
<div>
<Badge large color="yellow" icon={{ icon: Clock, position: 'left' }}>
Running
{#if job.flow_status}
({job.flow_status?.step + 1 ?? ''} of {job.raw_flow?.modules?.length ?? '?'})
{/if}
</Badge>
</div>
{:else if job && 'running' in job && 'scheduled_for' in job && job.scheduled_for && forLater(job.scheduled_for)}
<div>
<Badge color="blue" icon={{ icon: Calendar, position: 'left' }}>
Scheduled for {displayDate(job.scheduled_for)}
</Badge>
</div>
{:else if job && 'running' in job}
<div class="flex flex-row gap-1 items-center">
<Badge color="orange" icon={{ icon: Clock, position: 'left' }}>Queued</Badge>
<NoWorkerWithTagWarning tag={job.tag} />
</div>
{:else}
<Circle size={SMALL_ICON_SIZE} class="text-gray-200" />
{/if}