import { Button } from '@/components/ui/button';
import { Trash2 } from 'lucide-react';
import { Tooltip } from '@/components/ui/tooltip';

interface RemoveTrackButtonProps {
  onRemove: () => void;
  className?: string;
  disabled?: boolean;
}

export function RemoveTrackButton({
  onRemove,
  className,
  disabled,
}: RemoveTrackButtonProps) {
  return (
    <Tooltip content={<p>Retirer de la playlist</p>}>
      <Button
        variant="ghost"
        size="icon"
        className={className}
        onClick={(e) => {
          e.stopPropagation();
          onRemove();
        }}
        disabled={disabled}
        aria-label="Retirer le titre de la playlist"
      >
        <Trash2 className="h-4 w-4 text-muted-foreground hover:text-destructive" />
      </Button>
    </Tooltip>
  );
}
