import { LucideIcon } from 'lucide-react';
import Tooltip from '../Tooltip';

interface ActionButtonProps {
  icon: LucideIcon;
  label: string;
  onClick: () => void;
  color: string;
  disabled?: boolean;
  actionText?: string;
}

export default function ActionButton({ icon: Icon, label, onClick, color, disabled, actionText }: ActionButtonProps) {
  const button = (
    <button
      onClick={onClick}
      disabled={disabled}
      className={`flex items-center justify-center space-x-2 bg-${color}-900/30
        hover:bg-${color}-800/50 border-2 border-${color}-500/50 rounded-lg p-4
        transition-all duration-300 transform hover:scale-105 w-full
        ${disabled ? 'opacity-50 cursor-not-allowed' : ''}`}
    >
      <Icon className="w-6 h-6" />
      <span>{label}</span>
    </button>
  );

  if (!actionText) {
    return button;
  }

  return (
    <Tooltip content={actionText}>
      {button}
    </Tooltip>
  );
}