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.

45 lines
1.3 KiB

  1. import PureRenderMixin from 'react-addons-pure-render-mixin';
  2. import ImmutablePropTypes from 'react-immutable-proptypes';
  3. import Button from '../../../components/button';
  4. const ActionBar = React.createClass({
  5. propTypes: {
  6. account: ImmutablePropTypes.map.isRequired,
  7. me: React.PropTypes.number.isRequired,
  8. onFollow: React.PropTypes.func.isRequired,
  9. onUnfollow: React.PropTypes.func.isRequired
  10. },
  11. mixins: [PureRenderMixin],
  12. render () {
  13. const { account, me } = this.props;
  14. let infoText = '';
  15. let actionButton = '';
  16. if (account.get('id') === me) {
  17. infoText = 'This is you!';
  18. } else {
  19. if (account.getIn(['relationship', 'following'])) {
  20. actionButton = <Button text='Unfollow' onClick={this.props.onUnfollow} />
  21. } else {
  22. actionButton = <Button text='Follow' onClick={this.props.onFollow} />
  23. }
  24. if (account.getIn(['relationship', 'followed_by'])) {
  25. infoText = 'Follows you!';
  26. }
  27. }
  28. return (
  29. <div style={{ borderTop: '1px solid #363c4b', borderBottom: '1px solid #363c4b', padding: '10px', lineHeight: '36px' }}>
  30. {actionButton} <span style={{ color: '#616b86', fontWeight: '500', textTransform: 'uppercase' }}>{infoText}</span>
  31. </div>
  32. );
  33. },
  34. });
  35. export default ActionBar;