Tyler
84 lines
3.0 KiB
TypeScript
84 lines
3.0 KiB
TypeScript
import { Badge } from "@/components/ui/badge";
|
|
import { ClaimStateBadge } from "@/components/ui/claim-state-badge";
|
|
import type { ClaimState, ClaimStatus, RemittanceStatus } from "@/types";
|
|
import { CLAIM_STATES } 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" },
|
|
};
|
|
|
|
/**
|
|
* Generic status badge: delegates to `ClaimStateBadge` when the value is one
|
|
* of the seven canonical `ClaimState` values from the reconciliation model,
|
|
* otherwise falls back to a plain Badge with the legacy color. This is the
|
|
* single entry point that pages should use; it lets the live API's 7-state
|
|
* `state` field drive the visual while still tolerating legacy `status`
|
|
* strings like "draft" / "pending" that aren't part of the new model.
|
|
*/
|
|
export function StatusBadge({
|
|
status,
|
|
className,
|
|
}: {
|
|
status: string;
|
|
className?: string;
|
|
}) {
|
|
if (CLAIM_STATES.includes(status as ClaimState)) {
|
|
return (
|
|
<ClaimStateBadge state={status as ClaimState} className={className} />
|
|
);
|
|
}
|
|
return (
|
|
<Badge
|
|
variant="outline"
|
|
className={cn(
|
|
"uppercase tracking-wider text-[10px]",
|
|
"bg-muted text-muted-foreground border-border",
|
|
className,
|
|
)}
|
|
>
|
|
{status}
|
|
</Badge>
|
|
);
|
|
}
|
|
|
|
export function ClaimStatusBadge({ status }: { status: ClaimStatus }) {
|
|
// Forward to the canonical 7-state primitive when possible; fall back to
|
|
// the legacy dot+label for the three non-ClaimState values (draft,
|
|
// accepted, pending).
|
|
if (CLAIM_STATES.includes(status as ClaimState)) {
|
|
return <ClaimStateBadge state={status as ClaimState} />;
|
|
}
|
|
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 }) {
|
|
if (CLAIM_STATES.includes(status as ClaimState)) {
|
|
return <ClaimStateBadge state={status as ClaimState} />;
|
|
}
|
|
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>
|
|
);
|
|
}
|