"use client"

import { Badge } from "@/components/ui/badge"
import { cn } from "@/lib/utils"

interface UserStatusBadgeProps {
  active: boolean
}

export function UserStatusBadge({ active }: UserStatusBadgeProps) {
  return (
    <Badge
      variant="outline"
      className={cn(
        active
          ? "bg-emerald-500/10 text-emerald-600 dark:text-emerald-400 border-emerald-500/20"
          : "bg-zinc-500/10 text-zinc-600 dark:text-zinc-400 border-zinc-500/20"
      )}
    >
      <span className={cn("mr-1.5 h-1.5 w-1.5 rounded-full", {
        "bg-emerald-500": active,
        "bg-zinc-500": !active,
      })} />
      {active ? "Active" : "Inactive"}
    </Badge>
  )
}