import PropTypes from 'prop-types'
import { Modal, Button, Space, Typography } from 'antd'
import { getModelByName } from '../../../database/ObjectModels'
import BinIcon from '../../Icons/BinIcon'

const { Text } = Typography

const DeleteObjectModal = ({ open, onOk, onCancel, loading, objectType }) => {
  const model = getModelByName(objectType)
  return (
    <Modal
      open={open}
      title={
        <Space size={'middle'}>
          <BinIcon />
          {`Confirm Delete ${model.label}`}
        </Space>
      }
      onOk={onOk}
      onCancel={onCancel}
      okText='Delete'
      cancelText='Cancel'
      okType='danger'
      closable={false}
      centered
      maskClosable={false}
      footer={[
        <Button key='cancel' onClick={onCancel} disabled={loading}>
          Cancel
        </Button>,
        <Button
          key='delete'
          type='primary'
          danger
          onClick={onOk}
          loading={loading}
          disabled={loading}
        >
          Delete
        </Button>
      ]}
    >
      <Text>
        Are you sure you want to delete this {model.label.toLowerCase()}?
      </Text>
    </Modal>
  )
}

DeleteObjectModal.propTypes = {
  open: PropTypes.bool.isRequired,
  onOk: PropTypes.func.isRequired,
  onCancel: PropTypes.func.isRequired,
  loading: PropTypes.bool,
  objectType: PropTypes.string.isRequired
}

export default DeleteObjectModal