trigger.dev/apps/webapp/app/components/runs/v3/BulkAction.tsx at 137bb5240a7d44339e7ecaae0bc1d534cacdcffb · triggerdotdev/trigger.dev · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
import { ArrowPathIcon, CheckCircleIcon, NoSymbolIcon } from "@heroicons/react/20/solid";
import type { BulkActionStatus, BulkActionType } from "@trigger.dev/database";
import assertNever from "assert-never";
import { Spinner } from "~/components/primitives/Spinner";
import { cn } from "~/utils/cn";

export function BulkActionTypeCombo({
  type,
  className,
  iconClassName,
  labelClassName,
}: {
  type: BulkActionType;
  className?: string;
  iconClassName?: string;
  labelClassName?: string;
}) {
  return (
    <span className={cn("flex items-center gap-1", className)}>
      <BulkActionIcon type={type} className={cn("h-4 w-4", iconClassName)} />
      <BulkActionLabel type={type} className={labelClassName} />
    </span>
  );
}

export function BulkActionLabel({ type, className }: { type: BulkActionType; className?: string }) {
  return <span className={cn("text-text-dimmed", className)}>{bulkActionTitle(type)}</span>;
}

export function BulkActionIcon({ type, className }: { type: BulkActionType; className: string }) {
  switch (type) {
    case "REPLAY":
      return <ArrowPathIcon className={cn(bulkActionClassName(type), className)} />;
    case "CANCEL":
      return <NoSymbolIcon className={cn(bulkActionClassName(type), className)} />;
    default: {
      assertNever(type);
    }
  }
}

export function bulkActionClassName(type: BulkActionType): string {
  switch (type) {
    case "REPLAY":
      return "text-indigo-500";
    case "CANCEL":
      return "text-rose-500";
    default: {
      assertNever(type);
    }
  }
}

export function bulkActionTitle(type: BulkActionType): string {
  switch (type) {
    case "REPLAY":
      return "Replay";
    case "CANCEL":
      return "Cancel";
    default: {
      assertNever(type);
    }
  }
}

export function bulkActionVerb(type: BulkActionType): string {
  switch (type) {
    case "REPLAY":
      return "Replaying";
    case "CANCEL":
      return "Canceling";
    default: {
      assertNever(type);
    }
  }
}

export function BulkActionStatusCombo({
  status,
  className,
  iconClassName,
  labelClassName,
}: {
  status: BulkActionStatus;
  className?: string;
  iconClassName?: string;
  labelClassName?: string;
}) {
  return (
    <span className={cn("flex items-center gap-1", className)}>
      <BulkActionStatusIcon status={status} className={cn("h-4 w-4", iconClassName)} />
      <BulkActionStatusLabel status={status} className={labelClassName} />
    </span>
  );
}

export function BulkActionStatusIcon({
  status,
  className,
}: {
  status: BulkActionStatus;
  className: string;
}) {
  switch (status) {
    case "PENDING":
      return <Spinner className={cn("text-pending", className)} />;
    case "COMPLETED":
      return <CheckCircleIcon className={cn("text-success", className)} />;
    case "ABORTED":
      return <NoSymbolIcon className={cn("text-error", className)} />;
    default: {
      assertNever(status);
    }
  }
}

export function BulkActionStatusLabel({
  status,
  className,
}: {
  status: BulkActionStatus;
  className?: string;
}) {
  switch (status) {
    case "PENDING":
      return <span className={cn("text-pending", className)}>In progress</span>;
    case "COMPLETED":
      return <span className={cn("text-success", className)}>Completed</span>;
    case "ABORTED":
      return <span className={cn("text-error", className)}>Aborted</span>;
    default: {
      assertNever(status);
    }
  }
}