diff options
author | Eugen Rochko <eugen@zeonfederated.com> | 2018-04-10 17:12:10 +0200 |
---|---|---|
committer | GitHub <noreply@github.com> | 2018-04-10 17:12:10 +0200 |
commit | 45c9f16f714dd6de15391b5e2ae2bf0d30ef20fb (patch) | |
tree | 316d2a4cc2cec8fe5c5cbb15b17d0a00c9066b05 /app/javascript/mastodon/components/load_gap.js | |
parent | 49bbef1202f483d4e8abc43d00d12551bb25f80f (diff) |
Improve load gap styling in web UI (#7100)
Diffstat (limited to 'app/javascript/mastodon/components/load_gap.js')
-rw-r--r-- | app/javascript/mastodon/components/load_gap.js | 33 |
1 files changed, 33 insertions, 0 deletions
diff --git a/app/javascript/mastodon/components/load_gap.js b/app/javascript/mastodon/components/load_gap.js new file mode 100644 index 000000000..012303ae1 --- /dev/null +++ b/app/javascript/mastodon/components/load_gap.js @@ -0,0 +1,33 @@ +import React from 'react'; +import PropTypes from 'prop-types'; +import { injectIntl, defineMessages } from 'react-intl'; + +const messages = defineMessages({ + load_more: { id: 'status.load_more', defaultMessage: 'Load more' }, +}); + +@injectIntl +export default class LoadGap extends React.PureComponent { + + static propTypes = { + disabled: PropTypes.bool, + maxId: PropTypes.string, + onClick: PropTypes.func.isRequired, + intl: PropTypes.object.isRequired, + }; + + handleClick = () => { + this.props.onClick(this.props.maxId); + } + + render () { + const { disabled, intl } = this.props; + + return ( + <button className='load-more load-gap' disabled={disabled} onClick={this.handleClick} aria-label={intl.formatMessage(messages.load_more)}> + <i className='fa fa-ellipsis-h' /> + </button> + ); + } + +} |