mastodon/app/javascript/mastodon/features/compose/components/navigation_bar.js

69 lines
2.0 KiB
JavaScript

import React from 'react';
import PropTypes from 'prop-types';
import ImmutablePropTypes from 'react-immutable-proptypes';
import ActionBar from './action_bar';
import Avatar from '../../../components/avatar';
import Permalink from '../../../components/permalink';
import IconButton from '../../../components/icon_button';
import { FormattedMessage } from 'react-intl';
import ImmutablePureComponent from 'react-immutable-pure-component';
export default class NavigationBar extends ImmutablePureComponent {
static propTypes = {
account : ImmutablePropTypes.map.isRequired,
onLogout: PropTypes.func.isRequired,
onClose : PropTypes.func,
};
render() {
return (
<div className='navigation-bar'>
<Permalink
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={48}
/>
</Permalink >
<div className='navigation-bar__profile'>
<Permalink
href={this.props.account.get('url')}
to={`/accounts/${this.props.account.get('id')}`}
>
<strong className='navigation-bar__profile-account'>@{this.props.account.get('acct')}</strong >
</Permalink >
<a
href='/settings/profile'
className='navigation-bar__profile-edit'
>
<i className='fa fa-pencil' />
<FormattedMessage
id='navigation_bar.edit_profile'
defaultMessage='Edit profile'
/></a >
</div >
<div className='navigation-bar__actions'>
<IconButton
className='close'
title=''
icon='close'
onClick={this.props.onClose}
/>
<ActionBar
account={this.props.account}
onLogout={this.props.onLogout}
/>
</div >
</div >
);
}
}