Fixes users disabling rules from tickscript table

ui/src/kapacitor/components/TasksTable.tsx

@@ -56,18 +56,6 @@ const TasksTable: SFC<TasksTableProps> = ({
 )
 
 export class TaskRow extends PureComponent<TaskRowProps> {
-  public handleClickRuleStatusEnabled(task: AlertRule) {
-    return () => {
-      this.props.onChangeRuleStatus(task)
-    }
-  }
-
-  public handleDelete(task: AlertRule) {
-    return () => {
-      this.props.onDelete(task)
-    }
-  }
-
   public render() {
     const {task, source} = this.props
 
@@ -91,9 +79,9 @@ export class TaskRow extends PureComponent<TaskRowProps> {
               className="form-control-static"
               type="checkbox"
               checked={task.status === 'enabled'}
-              onChange={this.handleClickRuleStatusEnabled(task)}
+              onChange={this.handleClickRuleStatusEnabled}
             />
-            <label htmlFor={`kapacitor-task-row-task-enabled ${task.name}`} />
+            <label htmlFor={`kapacitor-task-row-task-enabled ${task.id}`} />
           </div>
         </td>
         <td style={{width: colActions}} className="text-right">
@@ -102,12 +90,24 @@ export class TaskRow extends PureComponent<TaskRowProps> {
             type="btn-danger"
             size="btn-xs"
             customClass="table--show-on-row-hover"
-            confirmAction={this.handleDelete(task)}
+            confirmAction={this.handleDelete}
           />
         </td>
       </tr>
     )
   }
+
+  private handleDelete = () => {
+    const {onDelete, task} = this.props
+
+    onDelete(task)
+  }
+
+  private handleClickRuleStatusEnabled = () => {
+    const {onChangeRuleStatus, task} = this.props
+
+    onChangeRuleStatus(task)
+  }
 }
 
 export default TasksTable