farmcontrol-ui/src/components/Dashboard/Finance/Payments/CancelPayment.jsx

import { useState, useContext } from 'react'
import PropTypes from 'prop-types'
import { ApiServerContext } from '../../context/ApiServerContext'
import { message } from 'antd'
import MessageDialogView from '../../common/MessageDialogView.jsx'

const CancelPayment = ({ onOk, objectData }) => {
  const [cancelLoading, setCancelLoading] = useState(false)
  const { sendObjectFunction } = useContext(ApiServerContext)

  const handleCancel = async () => {
    setCancelLoading(true)
    try {
      const result = await sendObjectFunction(
        objectData._id,
        'Payment',
        'cancel'
      )
      if (result) {
        message.success('Payment cancelled successfully')
        onOk(result)
      }
    } catch (error) {
      console.error('Error cancelling payment:', error)
    } finally {
      setCancelLoading(false)
    }
  }

  return (
    <MessageDialogView
      title={'Are you sure you want to cancel this payment?'}
      description={`Cancelling payment ${objectData?.name || objectData?._reference || objectData?._id} will update its status to cancelled.`}
      onOk={handleCancel}
      okText='Cancel'
      okLoading={cancelLoading}
    />
  )
}

CancelPayment.propTypes = {
  onOk: PropTypes.func.isRequired,
  objectData: PropTypes.object
}

export default CancelPayment