import Link from 'next/link'

import { FaPencilAlt } from 'react-icons/fa'
import { FaRegTrashCan, FaReceipt } from 'react-icons/fa6'

interface Props {
  paymentId: string
  onDownloadReport: (paymentId: string) => void
  onDelete: (paymentId: string) => void
}

export const ActionButtons = ({
  paymentId,
  onDownloadReport,
  onDelete,
}: Props) => {
  const handleDelete = () => onDelete(paymentId)

  const handleDownloadReport = () => onDownloadReport(paymentId)

  return (
    <div className="flex space-x-3 justify-center">
      <button
        className="text-gray-600 hover:underline flex items-center space-x-1 text-nowrap"
        onClick={handleDownloadReport}>
        <FaReceipt />
        <span>Generar Comprobante</span>
      </button>
      <Link
        href={`/payments/${paymentId}/edit`}
        className="text-blue-600 hover:underline flex items-center space-x-1">
        <FaPencilAlt />
        <span>Editar</span>
      </Link>
      <button
        className="text-red-600 hover:underline flex items-center space-x-1"
        onClick={handleDelete}>
        <FaRegTrashCan />
        <span>Eliminar</span>
      </button>
    </div>
  )
}