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