import { cn } from "@/lib/utils"
import type { ServerStatus } from "@/lib/data"

export function StatusDot({ status, pulse }: { status: ServerStatus; pulse?: boolean }) {
  return (
    <span
      className={cn(
        "inline-block size-2 rounded-full shrink-0",
        status === "online"   && "bg-[var(--status-online)]",
        status === "offline"  && "bg-[var(--status-offline)]",
        status === "degraded" && "bg-[var(--status-degraded)]",
        pulse && status === "online" && "animate-pulse",
      )}
    />
  )
}