import { useState } from 'react'
import { Button, Modal } from 'antd'

export default function AppButtonModal({
  open = false,
  buttonText = 'Open Modal',
  onOk,
  onCancel,
  children,
  ...props
}: any) {
  const [isModalOpen, setIsModalOpen] = useState(open)

  const showModal = () => {
    setIsModalOpen(true)
  }

  const handleOk = async () => {
    if (onOk) onOk()
    setIsModalOpen(false)
  }

  const handleCancel = async () => {
    if (onCancel) onCancel()
    setIsModalOpen(false)
  }

  return (
    <>
      <Button type="primary" onClick={showModal}>
        {buttonText}
      </Button>
      <Modal open={isModalOpen} onOk={handleOk} onCancel={handleCancel} {...props}>
        {children}
      </Modal>
    </>
  )
}
