Pipeline view groups phases by dependency depth with DAG visualization. Phase detail panel with Tiptap rich content editor and auto-save. Code review tab with diff viewer and comment threads (dummy data). Centralized live updates hook replaces scattered subscription boilerplate. Extract agent output parsing into shared utility. Inbox detail panel, account cards, and agent action components.
37 lines
1.2 KiB
TypeScript
37 lines
1.2 KiB
TypeScript
import { Badge } from "@/components/ui/badge";
|
|
import { cn } from "@/lib/utils";
|
|
|
|
const statusStyles: Record<string, string> = {
|
|
// Initiative statuses
|
|
active: "bg-blue-100 text-blue-800 hover:bg-blue-100/80 border-blue-200",
|
|
completed: "bg-green-100 text-green-800 hover:bg-green-100/80 border-green-200",
|
|
archived: "bg-gray-100 text-gray-800 hover:bg-gray-100/80 border-gray-200",
|
|
|
|
// Phase statuses
|
|
pending: "bg-gray-100 text-gray-800 hover:bg-gray-100/80 border-gray-200",
|
|
approved: "bg-amber-100 text-amber-800 hover:bg-amber-100/80 border-amber-200",
|
|
in_progress: "bg-blue-100 text-blue-800 hover:bg-blue-100/80 border-blue-200",
|
|
blocked: "bg-red-100 text-red-800 hover:bg-red-100/80 border-red-200",
|
|
};
|
|
|
|
const defaultStyle = "bg-gray-100 text-gray-800 hover:bg-gray-100/80 border-gray-200";
|
|
|
|
function formatStatusText(status: string): string {
|
|
return status.replace(/_/g, " ").toUpperCase();
|
|
}
|
|
|
|
interface StatusBadgeProps {
|
|
status: string;
|
|
className?: string;
|
|
}
|
|
|
|
export function StatusBadge({ status, className }: StatusBadgeProps) {
|
|
const style = statusStyles[status] ?? defaultStyle;
|
|
|
|
return (
|
|
<Badge className={cn(style, className)}>
|
|
{formatStatusText(status)}
|
|
</Badge>
|
|
);
|
|
}
|