soapbox/app/soapbox/features/developers/developers_menu.js

91 wiersze
3.1 KiB
JavaScript

import PropTypes from 'prop-types';
import React from 'react';
import { FormattedMessage, injectIntl, defineMessages } from 'react-intl';
import { connect } from 'react-redux';
import { Link, withRouter } from 'react-router-dom';
import { changeSettingImmediate } from 'soapbox/actions/settings';
import snackbar from 'soapbox/actions/snackbar';
import Icon from 'soapbox/components/icon';
import Column from '../ui/components/column';
const messages = defineMessages({
heading: { id: 'column.developers', defaultMessage: 'Developers' },
leave: { id: 'developers.leave', defaultMessage: 'You have left developers' },
});
export default @connect()
@injectIntl
@withRouter
class DevelopersMenu extends React.Component {
static propTypes = {
intl: PropTypes.object.isRequired,
dispatch: PropTypes.func.isRequired,
history: PropTypes.object,
}
leaveDevelopers = e => {
const { intl, dispatch } = this.props;
dispatch(changeSettingImmediate(['isDeveloper'], false));
dispatch(snackbar.success(intl.formatMessage(messages.leave)));
this.props.history.push('/');
e.preventDefault();
}
render() {
const { intl } = this.props;
return (
<Column heading={intl.formatMessage(messages.heading)}>
<div className='dashcounters'>
<div className='dashcounter'>
<Link to='/developers/apps/create'>
<div className='dashcounter__icon'>
<Icon src={require('@tabler/icons/icons/apps.svg')} />
</div>
<div className='dashcounter__label'>
<FormattedMessage id='developers.navigation.app_create_label' defaultMessage='Create an app' />
</div>
</Link>
</div>
<div className='dashcounter'>
<Link to='/developers/settings_store'>
<div className='dashcounter__icon'>
<Icon src={require('@tabler/icons/icons/code-plus.svg')} />
</div>
<div className='dashcounter__label'>
<FormattedMessage id='developers.navigation.settings_store_label' defaultMessage='Settings store' />
</div>
</Link>
</div>
<div className='dashcounter'>
<Link to='/error'>
<div className='dashcounter__icon'>
<Icon src={require('@tabler/icons/icons/mood-sad.svg')} />
</div>
<div className='dashcounter__label'>
<FormattedMessage id='developers.navigation.intentional_error_label' defaultMessage='Trigger an error' />
</div>
</Link>
</div>
<div className='dashcounter'>
<a href='#' onClick={this.leaveDevelopers}>
<div className='dashcounter__icon'>
<Icon src={require('@tabler/icons/icons/logout.svg')} />
</div>
<div className='dashcounter__label'>
<FormattedMessage id='developers.navigation.leave_developers_label' defaultMessage='Leave developers' />
</div>
</a>
</div>
</div>
</Column>
);
}
}