Files
cyclone/src/components/StatusBadge.tsx
T

39 lines
1.5 KiB
TypeScript

import { Badge } from "@/components/ui/badge";
import type { ClaimStatus, RemittanceStatus } from "@/types";
import { cn } from "@/lib/utils";
const claimStyles: Record<ClaimStatus, { dot: string; label: string }> = {
draft: { dot: "bg-muted-foreground", label: "Draft" },
submitted: { dot: "bg-[hsl(var(--accent))]", label: "Submitted" },
accepted: { dot: "bg-[hsl(var(--success))]", label: "Accepted" },
denied: { dot: "bg-destructive", label: "Denied" },
paid: { dot: "bg-[hsl(var(--success))]", label: "Paid" },
pending: { dot: "bg-[hsl(var(--warning))]", label: "Pending" },
};
const remitStyles: Record<RemittanceStatus, { dot: string; label: string }> = {
received: { dot: "bg-[hsl(var(--accent))]", label: "Received" },
posted: { dot: "bg-[hsl(var(--warning))]", label: "Posted" },
reconciled: { dot: "bg-[hsl(var(--success))]", label: "Reconciled" },
};
export function ClaimStatusBadge({ status }: { status: ClaimStatus }) {
const s = claimStyles[status];
return (
<Badge variant="outline" className="bg-transparent border-border/60">
<span className={cn("h-1.5 w-1.5 rounded-full", s.dot)} />
<span className="font-normal">{s.label}</span>
</Badge>
);
}
export function RemitStatusBadge({ status }: { status: RemittanceStatus }) {
const s = remitStyles[status];
return (
<Badge variant="outline" className="bg-transparent border-border/60">
<span className={cn("h-1.5 w-1.5 rounded-full", s.dot)} />
<span className="font-normal">{s.label}</span>
</Badge>
);
}