Clearing tags and naming convention

plugins/coral-plugin-offtopic/client/actions.js

@@ -1,5 +1,5 @@
-import {TOGGLE_CHECKBOX} from './constants';
+import {OFFTOPIC_TOGGLE_CHECKBOX} from './constants';
 
 export const toggleCheckbox = () => ({
-  type: TOGGLE_CHECKBOX
+  type: OFFTOPIC_TOGGLE_CHECKBOX
 });

plugins/coral-plugin-offtopic/client/components/OffTopicCheckbox.js

@@ -7,12 +7,24 @@ export default class OffTopicCheckbox extends React.Component {
 
   label = 'OFF_TOPIC';
 
-  handleChange = (e) => {
-    if (e.target.checked) {
-      this.props.addTag(this.label);
-    } else {
+  componentDidMount() {
+    this.clearTagsHook = this.props.registerHook('postSubmit', () => {
       const idx = this.props.commentBox.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.commentBox.tags.indexOf(this.label);
+      removeTag(idx);
     }
   }
 

plugins/coral-plugin-offtopic/client/constants.js

@@ -1 +1 @@
-export const TOGGLE_CHECKBOX = 'TOGGLE_CHECKBOX';
+export const OFFTOPIC_TOGGLE_CHECKBOX = 'OFFTOPIC_TOGGLE_CHECKBOX';

plugins/coral-plugin-offtopic/client/reducer.js

@@ -1,4 +1,4 @@
-import {TOGGLE_CHECKBOX} from './constants';
+import {OFFTOPIC_TOGGLE_CHECKBOX} from './constants';
 
 const initialState = {
   checked: false
@@ -6,7 +6,7 @@ const initialState = {
 
 export default function offTopic (state = initialState, action) {
   switch (action.type) {
-  case TOGGLE_CHECKBOX: {
+  case OFFTOPIC_TOGGLE_CHECKBOX: {
     return {
       ...state,
       checked: !state.checked