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

62 lines
1.3 KiB
JavaScript
Raw Normal View History

import React from 'react'
import PropTypes from 'prop-types'
2020-02-17 17:50:29 +00:00
import { injectIntl, defineMessages } from 'react-intl'
2020-02-29 15:42:47 +00:00
import Button from './button'
import Text from './text'
class LoadMore extends React.PureComponent {
2020-04-28 06:33:58 +01:00
handleClick = (e) => {
2020-05-02 07:25:55 +01:00
this.props.onClick(e)
}
render() {
2020-04-28 06:33:58 +01:00
const {
disabled,
visible,
intl,
} = this.props
if (!visible || disabled) return null
return (
<div className={[_s.d, _s.py15, _s.px10].join(' ')}>
2020-04-17 06:35:46 +01:00
<Button
2020-04-23 07:13:29 +01:00
isBlock
2020-04-17 06:35:46 +01:00
radiusSmall
backgroundColor='tertiary'
color='primary'
disabled={disabled || !visible}
2020-04-28 06:33:58 +01:00
style={{
visibility: visible ? 'visible' : 'hidden',
}}
2020-04-17 06:35:46 +01:00
onClick={this.handleClick}
aria-label={intl.formatMessage(messages.load_more)}
>
<Text color='inherit' align='center' weight='medium' className={_s.py5}>
2020-04-28 06:33:58 +01:00
{intl.formatMessage(messages.load_more)}
</Text>
2020-04-17 06:35:46 +01:00
</Button>
</div>
2020-02-17 17:50:29 +00:00
)
}
}
const messages = defineMessages({
load_more: { id: 'status.load_more', defaultMessage: 'Load more' },
})
LoadMore.propTypes = {
onClick: PropTypes.func,
disabled: PropTypes.bool,
visible: PropTypes.bool,
intl: PropTypes.object.isRequired,
}
LoadMore.defaultProps = {
visible: true,
}
export default injectIntl(LoadMore)