diff options
author | Jakub Mendyk <jakubmendyk.szkola+git@gmail.com> | 2018-08-26 16:39:37 +0200 |
---|---|---|
committer | Eugen Rochko <eugen@zeonfederated.com> | 2018-08-26 16:39:37 +0200 |
commit | 5129f6f2aa56afb21708aec552a798d062ccaff9 (patch) | |
tree | 8ab33e62dece517f50e86d8936ce8c2588527448 /app/javascript/mastodon/features/follow_requests | |
parent | 104d089df16214855cf3860671f022f7d2520a51 (diff) |
Add messages informing that collections are empty (fixes #4115) (#8418)
* Add messages informing that collections are empty Adds empty messages to blocked users, domain blocks, favourited statuses, users that favourited toot, follow requests, followers of given user, user's being followed by given user, lists, muted users, toots' boosts. Switched from using ScrollContainer to ScrollableList and/or added empty message's text. Fixes #4115 * Update localization files with strings for #4115 * Fix whitespace issues pointed out by codeclimate
Diffstat (limited to 'app/javascript/mastodon/features/follow_requests')
-rw-r--r-- | app/javascript/mastodon/features/follow_requests/index.js | 35 |
1 files changed, 18 insertions, 17 deletions
diff --git a/app/javascript/mastodon/features/follow_requests/index.js b/app/javascript/mastodon/features/follow_requests/index.js index 53a394cbc..cb574e08d 100644 --- a/app/javascript/mastodon/features/follow_requests/index.js +++ b/app/javascript/mastodon/features/follow_requests/index.js @@ -1,15 +1,16 @@ import React from 'react'; import { connect } from 'react-redux'; -import { defineMessages, injectIntl } from 'react-intl'; +import { defineMessages, injectIntl, FormattedMessage } from 'react-intl'; import ImmutablePureComponent from 'react-immutable-pure-component'; import PropTypes from 'prop-types'; import ImmutablePropTypes from 'react-immutable-proptypes'; +import { debounce } from 'lodash'; import LoadingIndicator from '../../components/loading_indicator'; -import { ScrollContainer } from 'react-router-scroll-4'; import Column from '../ui/components/column'; import ColumnBackButtonSlim from '../../components/column_back_button_slim'; import AccountAuthorizeContainer from './containers/account_authorize_container'; import { fetchFollowRequests, expandFollowRequests } from '../../actions/accounts'; +import ScrollableList from '../../components/scrollable_list'; const messages = defineMessages({ heading: { id: 'column.follow_requests', defaultMessage: 'Follow requests' }, @@ -35,13 +36,9 @@ export default class FollowRequests extends ImmutablePureComponent { this.props.dispatch(fetchFollowRequests()); } - handleScroll = (e) => { - const { scrollTop, scrollHeight, clientHeight } = e.target; - - if (scrollTop === scrollHeight - clientHeight) { - this.props.dispatch(expandFollowRequests()); - } - } + handleLoadMore = debounce(() => { + this.props.dispatch(expandFollowRequests()); + }, 300, { leading: true }); render () { const { intl, shouldUpdateScroll, accountIds } = this.props; @@ -54,17 +51,21 @@ export default class FollowRequests extends ImmutablePureComponent { ); } + const emptyMessage = <FormattedMessage id='empty_column.follow_requests' defaultMessage="You don't have any follow requests yet. When you receive one, it will show up here." />; + return ( <Column icon='users' heading={intl.formatMessage(messages.heading)}> <ColumnBackButtonSlim /> - - <ScrollContainer scrollKey='follow_requests' shouldUpdateScroll={shouldUpdateScroll}> - <div className='scrollable' onScroll={this.handleScroll}> - {accountIds.map(id => - <AccountAuthorizeContainer key={id} id={id} /> - )} - </div> - </ScrollContainer> + <ScrollableList + scrollKey='follow_requests' + onLoadMore={this.handleLoadMore} + shouldUpdateScroll={shouldUpdateScroll} + emptyMessage={emptyMessage} + > + {accountIds.map(id => + <AccountAuthorizeContainer key={id} id={id} /> + )} + </ScrollableList> </Column> ); } |