"use client"

import type { ReactNode } from "react"
import { Tooltip, TooltipContent, TooltipTrigger } from "@/components/ui/tooltip"
import { cn } from "@/lib/utils"

type PolicyDisabledTooltipProps = {
  reason?: string | null
  children: ReactNode
  className?: string
}

export function PolicyDisabledTooltip({
  reason,
  children,
  className,
}: PolicyDisabledTooltipProps) {
  if (!reason) return <>{children}</>

  return (
    <Tooltip>
      <TooltipTrigger asChild>
        <span className={cn("inline-flex cursor-not-allowed", className)}>{children}</span>
      </TooltipTrigger>
      <TooltipContent side="top" className="max-w-[20rem] text-center">
        {reason}
      </TooltipContent>
    </Tooltip>
  )
}