diff --git a/plugins/talk-plugin-offtopic/client/components/OffTopicCheckbox.js b/plugins/talk-plugin-offtopic/client/components/OffTopicCheckbox.js
index 97916b900..fec42fc9e 100644
--- a/plugins/talk-plugin-offtopic/client/components/OffTopicCheckbox.js
+++ b/plugins/talk-plugin-offtopic/client/components/OffTopicCheckbox.js
@@ -1,47 +1,27 @@
import React from 'react';
+import PropTypes from 'prop-types';
import styles from './OffTopicCheckbox.css';
import { t } from 'plugin-api/beta/client/services';
export default class OffTopicCheckbox extends React.Component {
- label = 'OFF_TOPIC';
-
- componentDidMount() {
- this.clearTagsHook = this.props.registerHook('postSubmit', () => {
- const idx = this.props.tags.indexOf(this.label);
- this.props.removeTag(idx);
- });
- }
-
- componentWillUnmount() {
- this.props.unregisterHook(this.clearTagsHook);
- }
-
- handleChange = e => {
- const { addTag, removeTag } = this.props;
- if (e.target.checked) {
- addTag(this.label);
- } else {
- const idx = this.props.tags.indexOf(this.label);
- removeTag(idx);
- }
- };
-
render() {
- const checked = this.props.tags.indexOf(this.label) >= 0;
return (
- {!this.props.isReply ? (
-
- ) : null}
+
);
}
}
+
+OffTopicCheckbox.propTypes = {
+ onChange: PropTypes.func.isRequired,
+ checked: PropTypes.bool.isRequired,
+};
diff --git a/plugins/talk-plugin-offtopic/client/containers/OffTopicCheckbox.js b/plugins/talk-plugin-offtopic/client/containers/OffTopicCheckbox.js
index e8c07bee3..a9d6c4914 100644
--- a/plugins/talk-plugin-offtopic/client/containers/OffTopicCheckbox.js
+++ b/plugins/talk-plugin-offtopic/client/containers/OffTopicCheckbox.js
@@ -1,14 +1,34 @@
-import { bindActionCreators } from 'redux';
-import { addTag, removeTag } from 'plugin-api/alpha/client/actions';
-import { commentBoxTagsSelector } from 'plugin-api/alpha/client/selectors';
-import { connect } from 'plugin-api/beta/client/hocs';
+import React from 'react';
+import PropTypes from 'prop-types';
import OffTopicCheckbox from '../components/OffTopicCheckbox';
+import { excludeIf } from 'plugin-api/beta/client/hocs';
-const mapStateToProps = state => ({
- tags: commentBoxTagsSelector(state),
-});
+const OFF_TOPIC_TAG = 'OFF_TOPIC';
+class OffTopicCheckboxContainer extends React.Component {
+ handleChange = e => {
+ const { input, onInputChange } = this.props;
+ if (e.target.checked && !input.tags.includes(OFF_TOPIC_TAG)) {
+ onInputChange({ tags: [...input.tags, OFF_TOPIC_TAG] });
+ } else {
+ const idx = input.tags.indexOf(OFF_TOPIC_TAG);
+ if (idx !== -1) {
+ onInputChange({
+ tags: [...input.tags.slice(0, idx), ...input.tags.slice(0, idx)],
+ });
+ }
+ }
+ };
-const mapDispatchToProps = dispatch =>
- bindActionCreators({ addTag, removeTag }, dispatch);
+ render() {
+ const checked = this.props.input.tags.includes(OFF_TOPIC_TAG);
+ return ;
+ }
+}
-export default connect(mapStateToProps, mapDispatchToProps)(OffTopicCheckbox);
+OffTopicCheckboxContainer.propTypes = {
+ input: PropTypes.object.isRequired,
+ onInputChange: PropTypes.func.isRequired,
+ isReply: PropTypes.bool,
+};
+
+export default excludeIf(props => props.isReply)(OffTopicCheckboxContainer);