import React from 'react';
import ImmutablePropTypes from 'react-immutable-proptypes';
import PropTypes from 'prop-types';
import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
import IconButton from '../../../components/icon_button';
import Motion from '../../ui/util/optional_motion';
import spring from 'react-motion/lib/spring';
import ImmutablePureComponent from 'react-immutable-pure-component';
import { autoPlayGif, me } from '../../../initial_state';
import classNames from 'classnames';
const messages = defineMessages({
unfollow: { id: 'account.unfollow', defaultMessage: 'Unfollow' },
follow: { id: 'account.follow', defaultMessage: 'Follow' },
requested: { id: 'account.requested', defaultMessage: 'Awaiting approval. Click to cancel follow request' },
unblock: { id: 'account.unblock', defaultMessage: 'Unblock @{name}' },
edit_profile: { id: 'account.edit_profile', defaultMessage: 'Edit profile' },
});
class Avatar extends ImmutablePureComponent {
static propTypes = {
account: ImmutablePropTypes.map.isRequired,
};
state = {
isHovered: false,
};
handleMouseOver = () => {
if (this.state.isHovered) return;
this.setState({ isHovered: true });
}
handleMouseOut = () => {
if (!this.state.isHovered) return;
this.setState({ isHovered: false });
}
render () {
const { account } = this.props;
const { isHovered } = this.state;
return (
{({ radius }) => (
{account.get('acct')}
)}
);
}
}
@injectIntl
export default class Header extends ImmutablePureComponent {
static propTypes = {
account: ImmutablePropTypes.map,
onFollow: PropTypes.func.isRequired,
onBlock: PropTypes.func.isRequired,
intl: PropTypes.object.isRequired,
};
openEditProfile = () => {
window.open('/settings/profile', '_blank');
}
render () {
const { account, intl } = this.props;
if (!account) {
return null;
}
let info = '';
let mutingInfo = '';
let actionBtn = '';
let lockedIcon = '';
if (me !== account.get('id') && account.getIn(['relationship', 'followed_by'])) {
info = ;
} else if (me !== account.get('id') && account.getIn(['relationship', 'blocking'])) {
info = ;
}
if (me !== account.get('id') && account.getIn(['relationship', 'muting'])) {
mutingInfo = ;
} else if (me !== account.get('id') && account.getIn(['relationship', 'domain_blocking'])) {
mutingInfo = ;
}
if (me !== account.get('id')) {
if (!account.get('relationship')) { // Wait until the relationship is loaded
actionBtn = '';
} else if (account.getIn(['relationship', 'requested'])) {
actionBtn = (
);
} else if (!account.getIn(['relationship', 'blocking'])) {
actionBtn = (
);
} else if (account.getIn(['relationship', 'blocking'])) {
actionBtn = (
);
}
} else {
actionBtn = (
);
}
if (account.get('moved') && !account.getIn(['relationship', 'following'])) {
actionBtn = '';
}
if (account.get('locked')) {
lockedIcon = ;
}
const content = { __html: account.get('note_emojified') };
const displayNameHtml = { __html: account.get('display_name_html') };
const fields = account.get('fields');
const badge = account.get('bot') ? () : null;
return (
@{account.get('acct')} {lockedIcon}
{badge}
{fields.size > 0 && (
{fields.map((pair, i) => (
))}
)}
{info}
{mutingInfo}
{actionBtn}
);
}
}