import React from 'react'
import PropTypes from 'prop-types'
import { Modal, Button, Icon, Column, Text } from '../ui'

export class MessageDialog extends React.Component {
  static propTypes = {
    open: PropTypes.bool,
    title: PropTypes.string.isRequired,
    message: PropTypes.string.isRequired,
    onDismiss: PropTypes.func
  }

  render() {
    return (
      <Modal open={this.props.open} onClose={this.props.onDismiss} closeOnDimmerClick={false}>
        <Column>
          <Column.Item>
            <Text>{this.props.title}</Text>
          </Column.Item>
          <Column.Item>
            <Text>{this.props.message}</Text>
          </Column.Item>
          <Column.Item>
            <Button onClick={this.props.onDismiss}>
              <Icon name='checkmark' /> OK
            </Button>
          </Column.Item>
        </Column>
      </Modal>
    )
  }
}