Lemma Status Flow

1"use client"
2 
3import * as React from "react"
4import {
5  Check,
6  Circle,
7  Loader2,
8} from "lucide-react"
9import { Skeleton } from "@/components/lemma/ui/skeleton"
10import {
11  Tooltip,
12  TooltipContent,
13  TooltipProvider,
14  TooltipTrigger,
15} from "@/components/lemma/ui/tooltip"
16import { useFunctionRun, useUpdateRecord } from "lemma-sdk/react"
17import type { LemmaClient } from "lemma-sdk"
18import { cn } from "@/components/lemma/lib/utils"
19import { enumPillClasses, type EnumColorMap } from "./status-flow-enum-utils"
20import {
21  statusFlowRadiusClassName,
22  type LemmaStatusFlowAppearance,
23  type LemmaStatusFlowDensity,
24  type LemmaStatusFlowRadius,
25} from "./status-flow-style-utils"
26 
27export type { LemmaStatusFlowAppearance, LemmaStatusFlowDensity, LemmaStatusFlowRadius } from "./status-flow-style-utils"
28export type { EnumColorMap } from "./status-flow-enum-utils"
29 
30export type LemmaStatusFlowMode = "interactive" | "readonly" | "tracker"
31 
32export interface StatusTransition {
33  from: string
34  to: string
35  label?: string
36  icon?: React.ComponentType<{ className?: string }>
37  functionName?: string
38}
39 
40export interface LemmaStatusFlowProps {
41  client: LemmaClient
42  podId?: string
43  tableName?: string
44  recordId?: string
45  enabled?: boolean
46 
47  currentStatus: string
48  statuses: string[]
49  statusField?: string
50  transitions?: StatusTransition[]
51  onTransition?: (from: string, to: string) => void
52  actionMode?: "direct" | "function"
53  enumColorMap?: EnumColorMap
54  mode?: LemmaStatusFlowMode
55  showConnectors?: boolean
56  statusLabels?: Record<string, React.ReactNode>
57  statusDescriptions?: Record<string, React.ReactNode>
58 
59  orientation?: "horizontal" | "vertical"
60  appearance?: LemmaStatusFlowAppearance
61  density?: LemmaStatusFlowDensity
62  radius?: LemmaStatusFlowRadius
63  className?: string
64}
65 
66type StatusNodeState = "past" | "current" | "future"
67 
68export function LemmaStatusFlow({
69  client,
70  podId,
71  tableName,
72  recordId,
73  enabled = true,
74  currentStatus,
75  statuses,
76  statusField = "status",
77  transitions,
78  onTransition,
79  actionMode = "direct",
80  enumColorMap,
81  mode = "interactive",
82  showConnectors = true,
83  statusLabels,
84  statusDescriptions,
85  orientation = "horizontal",
86  appearance = "default",
87  density = "comfortable",
88  radius = "lg",
89  className,
90}: LemmaStatusFlowProps) {
91  const [localStatus, setLocalStatus] = React.useState(currentStatus)
92  const [transitioning, setTransitioning] = React.useState<string | null>(null)
93 
94// … truncated