import type { ButtonHTMLAttributes, ReactNode } from "react";
import DisabledActionTooltip from "./DisabledActionTooltip";

export type ButtonProps = ButtonHTMLAttributes<HTMLButtonElement> & {
  variant?: "primary" | "secondary" | "ghost" | "danger";
  disabledReason?: ReactNode;
};

export default function Button({ variant = "secondary", className = "", disabledReason, disabled, ...props }: ButtonProps) {
  const button = <button className={`btn btn-${variant} ${className}`} disabled={disabled || Boolean(disabledReason)} {...props} />;
  return <DisabledActionTooltip reason={disabledReason}>{button}</DisabledActionTooltip>;
}