You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

61 lines
1.7 KiB

  1. import { connect } from 'react-redux';
  2. import PureRenderMixin from 'react-addons-pure-render-mixin';
  3. import ImmutablePropTypes from 'react-immutable-proptypes';
  4. import LoadingIndicator from '../../components/loading_indicator';
  5. import { fetchFavourites } from '../../actions/interactions';
  6. import { ScrollContainer } from 'react-router-scroll';
  7. import AccountContainer from '../../containers/account_container';
  8. import Column from '../ui/components/column';
  9. import ColumnBackButton from '../../components/column_back_button';
  10. const mapStateToProps = (state, props) => ({
  11. accountIds: state.getIn(['user_lists', 'favourited_by', Number(props.params.statusId)])
  12. });
  13. const Favourites = React.createClass({
  14. propTypes: {
  15. params: React.PropTypes.object.isRequired,
  16. dispatch: React.PropTypes.func.isRequired,
  17. accountIds: ImmutablePropTypes.list
  18. },
  19. mixins: [PureRenderMixin],
  20. componentWillMount () {
  21. this.props.dispatch(fetchFavourites(Number(this.props.params.statusId)));
  22. },
  23. componentWillReceiveProps(nextProps) {
  24. if (nextProps.params.statusId !== this.props.params.statusId && nextProps.params.statusId) {
  25. this.props.dispatch(fetchFavourites(Number(nextProps.params.statusId)));
  26. }
  27. },
  28. render () {
  29. const { accountIds } = this.props;
  30. if (!accountIds) {
  31. return (
  32. <Column>
  33. <LoadingIndicator />
  34. </Column>
  35. );
  36. }
  37. return (
  38. <Column>
  39. <ColumnBackButton />
  40. <ScrollContainer scrollKey='favourites'>
  41. <div className='scrollable'>
  42. {accountIds.map(id => <AccountContainer key={id} id={id} withNote={false} />)}
  43. </div>
  44. </ScrollContainer>
  45. </Column>
  46. );
  47. }
  48. });
  49. export default connect(mapStateToProps)(Favourites);