import * as React from "react";
import { Badge, type BadgeProps } from "@/components/ui/badge";
import { cn } from "@/lib/utils";

export type StatusIndicator = "success" | "warning" | "danger" | "muted";

const indicatorClass: Record<StatusIndicator, string> = {
  success: "bg-emerald-500",
  warning: "bg-amber-500",
  danger: "bg-destructive",
  muted: "bg-muted-foreground",
};

export type StatusBadgeProps = BadgeProps & {
  /** Leading status dot (e.g. green for Active). */
  indicator?: StatusIndicator | null;
};

/** shadcn Badge with an optional leading status dot. */
export function StatusBadge({
  indicator = null,
  className,
  children,
  ...props
}: StatusBadgeProps) {
  return (
    <Badge className={cn(className)} {...props}>
      {indicator ? (
        <span
          className={cn("size-1.5 shrink-0 rounded-full", indicatorClass[indicator])}
          aria-hidden
        />
      ) : null}
      {children}
    </Badge>
  );
}