gab-social/app/javascript/gabsocial/components/column_indicator.js

51 lines
1.2 KiB
JavaScript
Raw Normal View History

import React from 'react'
import PropTypes from 'prop-types'
2020-02-14 00:40:04 +00:00
import { defineMessages, injectIntl } from 'react-intl'
import Icon from './icon'
2020-02-29 15:42:47 +00:00
import Text from './text'
2020-02-14 00:40:04 +00:00
class ColumnIndicator extends React.PureComponent {
2020-02-14 00:40:04 +00:00
render() {
const { type, message, intl } = this.props
2020-04-28 06:33:58 +01:00
const title = type !== 'error' && !message ? intl.formatMessage(messages[type]) : message
2020-02-14 00:40:04 +00:00
return (
<div className={[_s.d, _s.w100PC, _s.jcCenter, _s.aiCenter, _s.py15].join(' ')}>
<Icon id={type} size='30px' />
2020-02-14 00:40:04 +00:00
{
type !== 'loading' &&
2020-02-29 15:42:47 +00:00
<Text
align='center'
size='medium'
2020-03-11 23:56:18 +00:00
className={_s.mt10}
2020-02-29 15:42:47 +00:00
>
2020-02-14 00:40:04 +00:00
{title}
2020-02-29 15:42:47 +00:00
</Text>
2020-02-14 00:40:04 +00:00
}
</div>
)
}
}
const messages = defineMessages({
loading: { id: 'loading_indicator.label', defaultMessage: 'Loading..' },
missing: { id: 'missing_indicator.sublabel', defaultMessage: 'This resource could not be found.' },
})
ColumnIndicator.propTypes = {
intl: PropTypes.object.isRequired,
type: PropTypes.oneOf([
'loading',
'missing',
'error',
]),
message: PropTypes.oneOfType([
PropTypes.string,
PropTypes.object,
]),
}
export default injectIntl(ColumnIndicator)