parent
9b9816aba6
commit
9a2f10fe8b
@ -1,76 +0,0 @@ |
||||
// Package imports.
|
||||
import React from 'react'; |
||||
import ImmutablePropTypes from 'react-immutable-proptypes'; |
||||
import { |
||||
FormattedMessage, |
||||
defineMessages, |
||||
} from 'react-intl'; |
||||
|
||||
// Components.
|
||||
import Avatar from 'flavours/glitch/components/avatar'; |
||||
import Permalink from 'flavours/glitch/components/permalink'; |
||||
|
||||
// Utils.
|
||||
import { hiddenComponent } from 'flavours/glitch/util/react_helpers'; |
||||
import { profileLink } from 'flavours/glitch/util/backend_links'; |
||||
|
||||
// Messages.
|
||||
const messages = defineMessages({ |
||||
edit: { |
||||
defaultMessage: 'Edit profile', |
||||
id: 'navigation_bar.edit_profile', |
||||
}, |
||||
}); |
||||
|
||||
// The component.
|
||||
export default function DrawerAccount ({ account }) { |
||||
|
||||
// We need an account to render.
|
||||
if (!account) { |
||||
return ( |
||||
<div className='drawer--account'> |
||||
{ profileLink !== undefined && ( |
||||
<a |
||||
className='edit' |
||||
href={ profileLink } |
||||
> |
||||
<FormattedMessage {...messages.edit} /> |
||||
</a> |
||||
)} |
||||
</div> |
||||
); |
||||
} |
||||
|
||||
// The result.
|
||||
return ( |
||||
<div className='drawer--account'> |
||||
<Permalink |
||||
className='avatar' |
||||
href={account.get('url')} |
||||
to={`/accounts/${account.get('id')}`} |
||||
> |
||||
<span {...hiddenComponent}>{account.get('acct')}</span> |
||||
<Avatar |
||||
account={account} |
||||
size={40} |
||||
/> |
||||
</Permalink> |
||||
<Permalink |
||||
className='acct' |
||||
href={account.get('url')} |
||||
to={`/accounts/${account.get('id')}`} |
||||
> |
||||
<strong>@{account.get('acct')}</strong> |
||||
</Permalink> |
||||
{ profileLink !== undefined && ( |
||||
<a |
||||
className='edit' |
||||
href={ profileLink } |
||||
><FormattedMessage {...messages.edit} /></a> |
||||
)} |
||||
</div> |
||||
); |
||||
} |
||||
|
||||
// Props.
|
||||
DrawerAccount.propTypes = { account: ImmutablePropTypes.map }; |
@ -0,0 +1,36 @@ |
||||
import React from 'react'; |
||||
import ImmutablePropTypes from 'react-immutable-proptypes'; |
||||
import Avatar from 'flavours/glitch/components/avatar'; |
||||
import Permalink from 'flavours/glitch/components/permalink'; |
||||
import { FormattedMessage } from 'react-intl'; |
||||
import ImmutablePureComponent from 'react-immutable-pure-component'; |
||||
import { profileLink } from 'flavours/glitch/util/backend_links'; |
||||
|
||||
export default class NavigationBar extends ImmutablePureComponent { |
||||
|
||||
static propTypes = { |
||||
account: ImmutablePropTypes.map.isRequired, |
||||
}; |
||||
|
||||
render () { |
||||
return ( |
||||
<div className='drawer--account'> |
||||
<Permalink className='avatar' href={this.props.account.get('url')} to={`/accounts/${this.props.account.get('id')}`}> |
||||
<span style={{ display: 'none' }}>{this.props.account.get('acct')}</span> |
||||
<Avatar account={this.props.account} size={40} /> |
||||
</Permalink> |
||||
|
||||
<Permalink className='acct' href={this.props.account.get('url')} to={`/accounts/${this.props.account.get('id')}`}> |
||||
<strong>@{this.props.account.get('acct')}</strong> |
||||
</Permalink> |
||||
|
||||
{ profileLink !== undefined && ( |
||||
<a |
||||
className='edit' |
||||
href={ profileLink } |
||||
><FormattedMessage id='navigation_bar.edit_profile' defaultMessage='Edit profile' /></a> |
||||
)} |
||||
</div> |
||||
); |
||||
}; |
||||
} |
@ -0,0 +1,11 @@ |
||||
import { connect } from 'react-redux'; |
||||
import NavigationBar from '../components/navigation_bar'; |
||||
import { me } from 'flavours/glitch/util/initial_state'; |
||||
|
||||
const mapStateToProps = state => { |
||||
return { |
||||
account: state.getIn(['accounts', me]), |
||||
}; |
||||
}; |
||||
|
||||
export default connect(mapStateToProps)(NavigationBar); |
Loading…
Reference in new issue