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

const OperButton = (props) => <Button type="link" size="small" {...props} >{props.children}</Button>

const ConfirmButton = (props) => {
  const { onClick, color = 'red', title, content, children, ...leftProps } = props

  const handleClick = () => {
    Modal.confirm({
      title,
      content,
      onOk: onClick,
    })
  }
  
  return (
    <Button
      type="link"
      size="small"
      style={{ color }}
      {...leftProps}
      onClick={handleClick}
    >{children}</Button>
  )
}

OperButton.Confirm = ConfirmButton

export default OperButton
