101 lines
2.9 KiB
JavaScript
101 lines
2.9 KiB
JavaScript
import PropTypes from 'prop-types';
|
|
import React from 'react';
|
|
import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
|
|
import { connect } from 'react-redux';
|
|
|
|
import { changeAccountNoteComment, submitAccountNote } from 'soapbox/actions/account-notes';
|
|
import { closeModal } from 'soapbox/actions/modals';
|
|
import { Modal, Text } from 'soapbox/components/ui';
|
|
import { makeGetAccount } from 'soapbox/selectors';
|
|
|
|
|
|
const messages = defineMessages({
|
|
placeholder: { id: 'account_note.placeholder', defaultMessage: 'No comment provided' },
|
|
save: { id: 'account_note.save', defaultMessage: 'Save' },
|
|
});
|
|
|
|
const makeMapStateToProps = () => {
|
|
const getAccount = makeGetAccount();
|
|
|
|
const mapStateToProps = state => ({
|
|
isSubmitting: state.getIn(['account_notes', 'edit', 'isSubmitting']),
|
|
account: getAccount(state, state.getIn(['account_notes', 'edit', 'account_id'])),
|
|
comment: state.getIn(['account_notes', 'edit', 'comment']),
|
|
});
|
|
|
|
return mapStateToProps;
|
|
};
|
|
|
|
const mapDispatchToProps = dispatch => {
|
|
return {
|
|
onConfirm() {
|
|
dispatch(submitAccountNote());
|
|
},
|
|
|
|
onClose() {
|
|
dispatch(closeModal());
|
|
},
|
|
|
|
onCommentChange(comment) {
|
|
dispatch(changeAccountNoteComment(comment));
|
|
},
|
|
};
|
|
};
|
|
|
|
export default @connect(makeMapStateToProps, mapDispatchToProps)
|
|
@injectIntl
|
|
class AccountNoteModal extends React.PureComponent {
|
|
|
|
static propTypes = {
|
|
isSubmitting: PropTypes.bool,
|
|
account: PropTypes.object.isRequired,
|
|
onClose: PropTypes.func.isRequired,
|
|
onConfirm: PropTypes.func.isRequired,
|
|
onCommentChange: PropTypes.func.isRequired,
|
|
comment: PropTypes.string,
|
|
intl: PropTypes.object.isRequired,
|
|
};
|
|
|
|
handleCommentChange = e => {
|
|
this.props.onCommentChange(e.target.value);
|
|
}
|
|
|
|
handleSubmit = () => {
|
|
this.props.onConfirm();
|
|
}
|
|
|
|
handleKeyDown = e => {
|
|
if (e.keyCode === 13 && (e.ctrlKey || e.metaKey)) {
|
|
this.handleSubmit();
|
|
}
|
|
}
|
|
|
|
render() {
|
|
const { account, isSubmitting, comment, onClose, intl } = this.props;
|
|
|
|
return (
|
|
<Modal
|
|
title={<FormattedMessage id='account_note.target' defaultMessage='Note for @{target}' values={{ target: account.get('acct') }} />}
|
|
onClose={onClose}
|
|
confirmationAction={this.handleSubmit}
|
|
confirmationText={intl.formatMessage(messages.save)}
|
|
confirmationDisabled={isSubmitting}
|
|
>
|
|
<Text theme='muted'>
|
|
<FormattedMessage id='account_note.hint' defaultMessage='You can keep notes about this user for yourself (this will not be shared with them):' />
|
|
</Text>
|
|
|
|
<textarea
|
|
className='setting-text light'
|
|
placeholder={intl.formatMessage(messages.placeholder)}
|
|
value={comment}
|
|
onChange={this.handleCommentChange}
|
|
onKeyDown={this.handleKeyDown}
|
|
disabled={isSubmitting}
|
|
autoFocus
|
|
/>
|
|
</Modal>
|
|
);
|
|
}
|
|
|
|
}
|