52 lines
1.5 KiB
JavaScript
52 lines
1.5 KiB
JavaScript
import React from 'react'
|
|
import PropTypes from 'prop-types'
|
|
import { Modal, Button, Column, Row, Text, Icon } from 'ui'
|
|
import { sizeInfo } from 'ui/style'
|
|
|
|
export class MessageModal extends React.Component {
|
|
static propTypes = {
|
|
open: PropTypes.bool,
|
|
icon: PropTypes.string.isRequired,
|
|
message: PropTypes.string.isRequired,
|
|
detail: PropTypes.string,
|
|
onDismiss: PropTypes.func
|
|
}
|
|
|
|
render() {
|
|
const { onDismiss, open, icon, message, detail } = this.props
|
|
|
|
return (
|
|
<Modal open={open} width={400} onCancel={onDismiss}>
|
|
<Row>
|
|
<Row.Item>
|
|
<Icon name={icon} size={150} />
|
|
</Row.Item>
|
|
<Row.Item grow>
|
|
<Column height='100%'>
|
|
<Column.Item height={15} />
|
|
<Column.Item grow>
|
|
<Text width='100%' align='center'>{message}</Text>
|
|
</Column.Item>
|
|
<Column.Item>
|
|
<Text width='100%' align='center' tone='dimmed' size='small'>{detail}</Text>
|
|
</Column.Item>
|
|
<Column.Item height={15} />
|
|
<Column.Item height={sizeInfo.buttonHeight}>
|
|
<Row>
|
|
<Row.Item grow />
|
|
<Row.Item>
|
|
<Button onClick={onDismiss}>OK</Button>
|
|
</Row.Item>
|
|
<Row.Item grow />
|
|
</Row>
|
|
</Column.Item>
|
|
<Column.Item height={15} />
|
|
</Column>
|
|
</Row.Item>
|
|
<Row.Item width={10} />
|
|
</Row>
|
|
</Modal>
|
|
)
|
|
}
|
|
}
|