b1571b1e1d
Currently we have the problem where the follow request button is missing from the Follow request tab. This means that when you visit that tab you either have to press the back button in the browser or re-enter the home page, which breaks the app flow. This will resolve that issue by adding a new back button to that tab, in the same way that the public timeline, and favourites have.
69 lines
2 KiB
JavaScript
69 lines
2 KiB
JavaScript
import { connect } from 'react-redux';
|
|
import PureRenderMixin from 'react-addons-pure-render-mixin';
|
|
import ImmutablePropTypes from 'react-immutable-proptypes';
|
|
import LoadingIndicator from '../../components/loading_indicator';
|
|
import { ScrollContainer } from 'react-router-scroll';
|
|
import Column from '../ui/components/column';
|
|
import ColumnBackButton from '../../components/column_back_button';
|
|
import AccountAuthorizeContainer from './containers/account_authorize_container';
|
|
import { fetchFollowRequests, expandFollowRequests } from '../../actions/accounts';
|
|
import { defineMessages, injectIntl } from 'react-intl';
|
|
|
|
const messages = defineMessages({
|
|
heading: { id: 'column.follow_requests', defaultMessage: 'Follow requests' }
|
|
});
|
|
|
|
const mapStateToProps = state => ({
|
|
accountIds: state.getIn(['user_lists', 'follow_requests', 'items'])
|
|
});
|
|
|
|
const FollowRequests = React.createClass({
|
|
propTypes: {
|
|
params: React.PropTypes.object.isRequired,
|
|
dispatch: React.PropTypes.func.isRequired,
|
|
accountIds: ImmutablePropTypes.list,
|
|
intl: React.PropTypes.object.isRequired
|
|
},
|
|
|
|
mixins: [PureRenderMixin],
|
|
|
|
componentWillMount () {
|
|
this.props.dispatch(fetchFollowRequests());
|
|
},
|
|
|
|
handleScroll (e) {
|
|
const { scrollTop, scrollHeight, clientHeight } = e.target;
|
|
|
|
if (scrollTop === scrollHeight - clientHeight) {
|
|
this.props.dispatch(expandFollowRequests());
|
|
}
|
|
},
|
|
|
|
render () {
|
|
const { intl, accountIds } = this.props;
|
|
|
|
if (!accountIds) {
|
|
return (
|
|
<Column>
|
|
<LoadingIndicator />
|
|
</Column>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<Column icon='users' heading={intl.formatMessage(messages.heading)}>
|
|
<ColumnBackButton />
|
|
<ScrollContainer scrollKey='follow_requests'>
|
|
<div className='scrollable' onScroll={this.handleScroll}>
|
|
{accountIds.map(id =>
|
|
<AccountAuthorizeContainer key={id} id={id} />
|
|
)}
|
|
</div>
|
|
</ScrollContainer>
|
|
</Column>
|
|
);
|
|
}
|
|
});
|
|
|
|
export default connect(mapStateToProps)(injectIntl(FollowRequests));
|