1 import PropTypes from 'prop-types';
2 import React, { useState } from 'react';
3 import { Button } from 'react-bootstrap';
4 import { withTranslation } from 'react-i18next';
6 import EditNicknameDialog from './EditNicknameDialog';
7 import Icon from '../common/Icon';
8 import { mayEditNickname } from '../../helpers/permissions';
9 import { withUser } from '../../helpers/UserContext';
10 import i18n from '../../i18n';
12 const EditNicknameButton = ({ authUser, user }) => {
13 const [showDialog, setShowDialog] = useState(false);
15 if (mayEditNickname(authUser, user)) {
18 onHide={() => setShowDialog(false)}
23 onClick={() => setShowDialog(true)}
24 title={i18n.t('button.edit')}
25 variant="outline-secondary"
27 <Icon.EDIT title="" />
34 EditNicknameButton.propTypes = {
35 authUser: PropTypes.shape({
37 user: PropTypes.shape({
41 export default withTranslation()(withUser(EditNicknameButton, 'authUser'));