import { NavLink } from 'react-router-dom' import { injectIntl, defineMessages } from 'react-intl' import ImmutablePropTypes from 'react-immutable-proptypes' import ImmutablePureComponent from 'react-immutable-pure-component' import { me } from '../../initial_state' import { makeGetAccount } from '../../selectors' import { shortNumberFormat } from '../../utils/numbers' import { openModal } from '../../actions/modal' import { CX, MODAL_EDIT_PROFILE, } from '../../constants' import PanelLayout from './panel_layout' import Avatar from '../avatar' import Button from '../button' import DisplayName from '../display_name' import Image from '../image' import UserStat from '../user_stat' const messages = defineMessages({ gabs: { id: 'account.posts', defaultMessage: 'Gabs' }, followers: { id: 'account.followers', defaultMessage: 'Followers' }, follows: { id: 'account.follows', defaultMessage: 'Following' }, edit_profile: { id: 'account.edit_profile', defaultMessage: 'Edit profile' }, headerPhoto: { id: 'header_photo', defaultMessage: 'Header photo' }, }) const mapStateToProps = (state) => ({ account: makeGetAccount()(state, me), }) const mapDispatchToProps = (dispatch) => ({ onOpenEditProfile() { dispatch(openModal(MODAL_EDIT_PROFILE)) }, }) export default @connect(mapStateToProps, mapDispatchToProps) @injectIntl class UserPanel extends ImmutablePureComponent { static propTypes = { account: ImmutablePropTypes.map.isRequired, intl: PropTypes.object.isRequired, onOpenEditProfile: PropTypes.func.isRequired, } state = { hovering: false, } updateOnProps = [ 'account' ] handleOnMouseEnter = () => { this.setState({ hovering: true }) } handleOnMouseLeave = () => { this.setState({ hovering: false }) } handleOnEditProfile = () => { this.props.onOpenEditProfile() } render() { const { account, intl, onOpenEditProfile, } = this.props const { hovering } = this.state const buttonClasses = CX({ posAbs: 1, mt10: 1, mr10: 1, top0: 1, right0: 1, displayNone: !hovering, }) const acct = account.get('acct') return (
{intl.formatMessage(messages.headerPhoto)}
) } }