Run Card

1"use client";
2 
3import * as React from "react";
4import {
5  Ban,
6  CheckCircle2,
7  Clock,
8  Loader2,
9  UserCheck,
10  XCircle,
11  type LucideIcon,
12} from "lucide-react";
13 
14import { cn } from "@/lib/utils";
15import {
16  FileThumbnail,
17  type FileThumbnailProps,
18} from "@/components/ui/file-thumbnail";
19 
20// Run lifecycle, mirroring Retab's backend `RunLifecycleKind`
21// (pending/running/completed/error/awaiting_review/cancelled). `queued` is a
22// generic pre-execution alias for `pending`; `failed` renders the backend's
23// `error` state under a clearer label.
24export type RunStatus =
25  | "queued"
26  | "pending"
27  | "running"
28  | "awaiting_review"
29  | "completed"
30  | "failed"
31  | "cancelled";
32 
33const RUN_STATUS: Record<
34  RunStatus,
35  { label: string; icon: LucideIcon; tone: string; spin?: boolean }
36> = {
37  queued: { label: "Queued", icon: Clock, tone: "text-muted-foreground" },
38  pending: { label: "Pending", icon: Clock, tone: "text-muted-foreground" },
39  running: {
40    label: "Running",
41    icon: Loader2,
42    tone: "text-amber-600 dark:text-amber-500",
43    spin: true,
44  },
45  awaiting_review: {
46    label: "Awaiting review",
47    icon: UserCheck,
48    tone: "text-yellow-600 dark:text-yellow-500",
49  },
50  completed: {
51    label: "Completed",
52    icon: CheckCircle2,
53    tone: "text-emerald-600 dark:text-emerald-500",
54  },
55  failed: {
56    label: "Failed",
57    icon: XCircle,
58    tone: "text-red-600 dark:text-red-500",
59  },
60  cancelled: {
61    label: "Cancelled",
62    icon: Ban,
63    tone: "text-orange-600 dark:text-orange-500",
64  },
65};
66 
67export interface RunCardProps
68  extends Pick<
69    FileThumbnailProps,
70    | "previewContent"
71    | "previewImageUrl"
72    | "previewAspectRatio"
73    | "previewClassName"
74    | "state"
75  > {
76  file: NonNullable<FileThumbnailProps["file"]>;
77  /**
78   * Replaces the single `FileThumbnail` with custom media in the same framed,
79   * status-pilled slot — e.g. a bundle of per-subdocument thumbnails. The frame
80   * still honors `previewAspectRatio`.
81   */
82  media?: React.ReactNode;
83  /** Lifecycle of the run — shown as a pill over the thumbnail. */
84  status?: RunStatus;
85  /** Heading line; defaults to the file name. */
86  title?: React.ReactNode;
87  /** Right-aligned metadata in the heading (e.g. the run kind or a timestamp). */
88  meta?: React.ReactNode;
89  /** The run's result, rendered in the card body. */
90  children?: React.ReactNode;
91  /** Makes the whole card a button. */
92  onClick?: () => void;
93  className?: string;
94}
95 
96/**
97// … truncated