diff options
author | ThibG <thib@sitedethib.com> | 2018-12-12 22:32:44 +0100 |
---|---|---|
committer | Eugen Rochko <eugen@zeonfederated.com> | 2018-12-12 22:32:44 +0100 |
commit | 55abff8af75b9a8ab541ec68a3603c77e1339e23 (patch) | |
tree | 12b444cf1bf96b2f3bcbfe8d5f3738c37f9bfb85 /app/javascript/mastodon/components/scrollable_list.js | |
parent | b048926e678e5b642cb1e939f629236e77944523 (diff) |
Various fixes to scrollable lists and media gallery (#9501)
* Always use the scrollable class for the ScrollList component Fixes #9499 as well as empty timelines' scrollbar “blinking” between loading state and empty state. * Do not display empty message when the list is known to have more elements Fixes #9500 * Fix LoadMore usage in account media gallery (Even though that codepath is probably never actually used…) * Make account media gallery more consistent with account timeline Fixes #9498 Display “load more” more consistently, add a loading indicator on first load. * Fix “load more” button when no data has been fetched
Diffstat (limited to 'app/javascript/mastodon/components/scrollable_list.js')
-rw-r--r-- | app/javascript/mastodon/components/scrollable_list.js | 11 |
1 files changed, 4 insertions, 7 deletions
diff --git a/app/javascript/mastodon/components/scrollable_list.js b/app/javascript/mastodon/components/scrollable_list.js index ab4e7d59c..774c8835d 100644 --- a/app/javascript/mastodon/components/scrollable_list.js +++ b/app/javascript/mastodon/components/scrollable_list.js @@ -30,7 +30,6 @@ export default class ScrollableList extends PureComponent { hasMore: PropTypes.bool, prepend: PropTypes.node, alwaysPrepend: PropTypes.bool, - alwaysShowScrollbar: PropTypes.bool, emptyMessage: PropTypes.node, children: PropTypes.node, }; @@ -206,11 +205,11 @@ export default class ScrollableList extends PureComponent { } render () { - const { children, scrollKey, trackScroll, shouldUpdateScroll, showLoading, isLoading, hasMore, prepend, alwaysPrepend, alwaysShowScrollbar, emptyMessage, onLoadMore } = this.props; + const { children, scrollKey, trackScroll, shouldUpdateScroll, showLoading, isLoading, hasMore, prepend, alwaysPrepend, emptyMessage, onLoadMore } = this.props; const { fullscreen } = this.state; const childrenCount = React.Children.count(children); - const loadMore = (hasMore && childrenCount > 0 && onLoadMore) ? <LoadMore visible={!isLoading} onClick={this.handleLoadMore} /> : null; + const loadMore = (hasMore && onLoadMore) ? <LoadMore visible={!isLoading} onClick={this.handleLoadMore} /> : null; let scrollableArea = null; if (showLoading) { @@ -225,7 +224,7 @@ export default class ScrollableList extends PureComponent { </div> </div> ); - } else if (isLoading || childrenCount > 0 || !emptyMessage) { + } else if (isLoading || childrenCount > 0 || hasMore || !emptyMessage) { scrollableArea = ( <div className={classNames('scrollable', { fullscreen })} ref={this.setRef} onMouseMove={this.handleMouseMove}> <div role='feed' className='item-list'> @@ -249,10 +248,8 @@ export default class ScrollableList extends PureComponent { </div> ); } else { - const scrollable = alwaysShowScrollbar; - scrollableArea = ( - <div className={classNames({ scrollable, fullscreen })} ref={this.setRef} style={{ flex: '1 1 auto', display: 'flex', flexDirection: 'column' }}> + <div className={classNames('scrollable scrollable--flex', { fullscreen })} ref={this.setRef}> {alwaysPrepend && prepend} <div className='empty-column-indicator'> |