import { clsx } from "@/lib/cx";

export type Position = "Yea" | "Nay" | "Present" | "Not Voting" | string;

const POSITION_COLOR: Record<string, string> = {

  yea: "var(--dk-yea)",

  nay: "var(--dk-nay)",

  present: "var(--dk-ash)",

  "not voting": "var(--dk-ash-2)",

};

export function positionColor(position: Position): string {

  return POSITION_COLOR[(position || "").toLowerCase()] ?? "var(--dk-ash)";

}

export function PositionTag({

  position,

  className,

}: {

  position: Position;

  className?: string;

}) {

  const color = positionColor(position);

  return (

    <span

      className={clsx("pill", className)}

      style={{

        color,

        borderColor: `color-mix(in srgb, ${color} 40%, transparent)`,

      }}

    >

      {position || "-"}

    </span>

  );

}