treehouse
/
mastodon
21
8
Fork 5
Code Issues 32 Pull Requests Projects 1 Releases Wiki Activity

Fix followers/follows layout issues from #8418 (#8505) 

* Add alwaysShowScrollbar prop to ScrollableList

* Fix followers/follows layout issues from #8418
lolsob-rspec
Jakub Mendyk 2018-08-29 01:19:58 +02:00 committed by Eugen Rochko
parent a45a6fc459
commit 816384cf32
3 changed files with 12 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
app/javascript/mastodon/components/scrollable_list.js
View File

@ -26,6 +26,7 @@ export default class ScrollableList extends PureComponent {
hasMore: PropTypes.bool, hasMore: PropTypes.bool,
prepend: PropTypes.node, prepend: PropTypes.node,
alwaysPrepend: PropTypes.bool, alwaysPrepend: PropTypes.bool,
alwaysShowScrollbar: PropTypes.bool,
emptyMessage: PropTypes.node, emptyMessage: PropTypes.node,
children: PropTypes.node, children: PropTypes.node,
}; };
@ -141,7 +142,7 @@ export default class ScrollableList extends PureComponent {
} }
render () { render () {
const { children, scrollKey, trackScroll, shouldUpdateScroll, isLoading, hasMore, prepend, alwaysPrepend, emptyMessage, onLoadMore } = this.props; const { children, scrollKey, trackScroll, shouldUpdateScroll, isLoading, hasMore, prepend, alwaysPrepend, alwaysShowScrollbar, emptyMessage, onLoadMore } = this.props;
const { fullscreen } = this.state; const { fullscreen } = this.state;
const childrenCount = React.Children.count(children); const childrenCount = React.Children.count(children);
@ -172,11 +173,13 @@ export default class ScrollableList extends PureComponent {
</div> </div>
); );
} else { } else {
const scrollable = alwaysShowScrollbar;
scrollableArea = ( scrollableArea = (
<div style={{ flex: '1 1 auto', display: 'flex', flexDirection: 'column' }}> <div className={classNames({ scrollable, fullscreen })} ref={this.setRef} style={{ flex: '1 1 auto', display: 'flex', flexDirection: 'column' }}>
{alwaysPrepend && prepend} {alwaysPrepend && prepend}
<div className='empty-column-indicator' ref={this.setRef}> <div className='empty-column-indicator'>
{emptyMessage} {emptyMessage}
</div> </div>
</div> </div>

5
app/javascript/mastodon/features/followers/index.js
View File

@ -66,13 +66,14 @@ export default class Followers extends ImmutablePureComponent {
<Column> <Column>
<ColumnBackButton /> <ColumnBackButton />
<HeaderContainer accountId={this.props.params.accountId} hideTabs />
<ScrollableList <ScrollableList
scrollKey='followers' scrollKey='followers'
hasMore={hasMore} hasMore={hasMore}
onLoadMore={this.handleLoadMore} onLoadMore={this.handleLoadMore}
shouldUpdateScroll={shouldUpdateScroll} shouldUpdateScroll={shouldUpdateScroll}
prepend={<HeaderContainer accountId={this.props.params.accountId} hideTabs />}
alwaysPrepend
alwaysShowScrollbar
emptyMessage={emptyMessage} emptyMessage={emptyMessage}
> >
{accountIds.map(id => {accountIds.map(id =>

5
app/javascript/mastodon/features/following/index.js
View File

@ -66,13 +66,14 @@ export default class Following extends ImmutablePureComponent {
<Column> <Column>
<ColumnBackButton /> <ColumnBackButton />
<HeaderContainer accountId={this.props.params.accountId} hideTabs />
<ScrollableList <ScrollableList
scrollKey='following' scrollKey='following'
hasMore={hasMore} hasMore={hasMore}
onLoadMore={this.handleLoadMore} onLoadMore={this.handleLoadMore}
shouldUpdateScroll={shouldUpdateScroll} shouldUpdateScroll={shouldUpdateScroll}
prepend={<HeaderContainer accountId={this.props.params.accountId} hideTabs />}
alwaysPrepend
alwaysShowScrollbar
emptyMessage={emptyMessage} emptyMessage={emptyMessage}
> >
{accountIds.map(id => {accountIds.map(id =>