@@ -9,11 +9,13 @@ import { BeakerIcon, BookOpenIcon, CheckIcon } from "@heroicons/react/24/solid";
9
9
import { useLocation } from "@remix-run/react" ;
10
10
import { formatDuration , formatDurationMilliseconds } from "@trigger.dev/core/v3" ;
11
11
import { useCallback , useRef } from "react" ;
12
+ import { Badge } from "~/components/primitives/Badge" ;
12
13
import { Button , LinkButton } from "~/components/primitives/Buttons" ;
13
14
import { Checkbox } from "~/components/primitives/Checkbox" ;
14
15
import { Dialog , DialogTrigger } from "~/components/primitives/Dialog" ;
15
16
import { Header3 } from "~/components/primitives/Headers" ;
16
17
import { useSelectedItems } from "~/components/primitives/SelectedItemsProvider" ;
18
+ import { SimpleTooltip } from "~/components/primitives/Tooltip" ;
17
19
import { useEnvironments } from "~/hooks/useEnvironments" ;
18
20
import { useFeatures } from "~/hooks/useFeatures" ;
19
21
import { useOrganization } from "~/hooks/useOrganizations" ;
@@ -39,9 +41,12 @@ import {
39
41
import { CancelRunDialog } from "./CancelRunDialog" ;
40
42
import { LiveTimer } from "./LiveTimer" ;
41
43
import { ReplayRunDialog } from "./ReplayRunDialog" ;
42
- import { TaskRunStatusCombo } from "./TaskRunStatus" ;
43
44
import { RunTag } from "./RunTag" ;
44
- import { Badge } from "~/components/primitives/Badge" ;
45
+ import {
46
+ descriptionForTaskRunStatus ,
47
+ filterableTaskRunStatuses ,
48
+ TaskRunStatusCombo ,
49
+ } from "./TaskRunStatus" ;
45
50
46
51
type RunsTableProps = {
47
52
total : number ;
@@ -126,7 +131,27 @@ export function TaskRunsTable({
126
131
< TableHeaderCell > Env</ TableHeaderCell >
127
132
< TableHeaderCell > Task</ TableHeaderCell >
128
133
< TableHeaderCell > Version</ TableHeaderCell >
129
- < TableHeaderCell > Status</ TableHeaderCell >
134
+ < TableHeaderCell
135
+ tooltip = {
136
+ < div className = "flex flex-col divide-y divide-grid-dimmed" >
137
+ { filterableTaskRunStatuses . map ( ( status ) => (
138
+ < div
139
+ key = { status }
140
+ className = "grid grid-cols-[8rem_1fr] gap-x-2 py-2 first:pt-1 last:pb-1"
141
+ >
142
+ < div className = "mb-0.5 flex items-center gap-1.5 whitespace-nowrap" >
143
+ < TaskRunStatusCombo status = { status } />
144
+ </ div >
145
+ < Paragraph variant = "extra-small" className = "!text-wrap text-text-dimmed" >
146
+ { descriptionForTaskRunStatus ( status ) }
147
+ </ Paragraph >
148
+ </ div >
149
+ ) ) }
150
+ </ div >
151
+ }
152
+ >
153
+ Status
154
+ </ TableHeaderCell >
130
155
< TableHeaderCell > Started</ TableHeaderCell >
131
156
< TableHeaderCell
132
157
colSpan = { 3 }
@@ -287,7 +312,11 @@ export function TaskRunsTable({
287
312
</ TableCell >
288
313
< TableCell to = { path } > { run . version ?? "–" } </ TableCell >
289
314
< TableCell to = { path } >
290
- < TaskRunStatusCombo status = { run . status } />
315
+ < SimpleTooltip
316
+ content = { descriptionForTaskRunStatus ( run . status ) }
317
+ disableHoverableContent
318
+ button = { < TaskRunStatusCombo status = { run . status } /> }
319
+ />
291
320
</ TableCell >
292
321
< TableCell to = { path } >
293
322
{ run . startedAt ? < DateTime date = { run . startedAt } /> : "–" }
0 commit comments