Browse Source

Fix invisible load more button (#4962)

* Fix behavior while the button is invisible
e.g. pointer cursor, couldn't open contextmenu
* Avoid rendering the button to remove blank space if no more items are available or no items are rendered
theme_witches
unarist 5 years ago committed by Eugen Rochko
parent
commit
6c81f9d6e5
  1. 2
      app/javascript/mastodon/components/load_more.js
  2. 2
      app/javascript/mastodon/components/scrollable_list.js

2
app/javascript/mastodon/components/load_more.js

@ -17,7 +17,7 @@ export default class LoadMore extends React.PureComponent { @@ -17,7 +17,7 @@ export default class LoadMore extends React.PureComponent {
const { visible } = this.props;
return (
<button className='load-more' disabled={!visible} style={{ opacity: visible ? 1 : 0 }} onClick={this.props.onClick}>
<button className='load-more' disabled={!visible} style={{ visibility: visible ? 'visible' : 'hidden' }} onClick={this.props.onClick}>
<FormattedMessage id='status.load_more' defaultMessage='Load more' />
</button>
);

2
app/javascript/mastodon/components/scrollable_list.js

@ -167,7 +167,7 @@ export default class ScrollableList extends PureComponent { @@ -167,7 +167,7 @@ export default class ScrollableList extends PureComponent {
const { children, scrollKey, trackScroll, shouldUpdateScroll, isLoading, hasMore, prepend, emptyMessage } = this.props;
const childrenCount = React.Children.count(children);
const loadMore = <LoadMore visible={!isLoading && childrenCount > 0 && hasMore} onClick={this.handleLoadMore} />;
const loadMore = (hasMore && childrenCount > 0) ? <LoadMore visible={!isLoading} onClick={this.handleLoadMore} /> : null;
let scrollableArea = null;
if (isLoading || childrenCount > 0 || !emptyMessage) {

Loading…
Cancel
Save