/** Clean a raw field key into a display label: "client_id" → "Client" */
export function cleanLabel(key: string): string {
  return key
    .replace(/_id$/, "")
    .replace(/_/g, " ")
    .replace(/\b\w/g, (c) => c.toUpperCase());
}

interface FieldLabelProps {
  field: string;
  required?: boolean;
}

export function FieldLabel({ field, required }: FieldLabelProps) {
  return (
    <span class="font-mono text-[var(--z-font-sm)]" style={{ color: "var(--z-muted)" }}>
      {cleanLabel(field)}
      {required && <span class="text-red-400"> *</span>}
    </span>
  );
}
