Add the ability to run a task manually

CHANGELOG.md

@@ -1,6 +1,7 @@
 ## v2.0.0-alpha.4 [unreleased]
 
 ### Features
+1. [11954](https://github.com/influxdata/influxdb/pull/11954): Add the ability to run a task manually from tasks page
 
 ### Bug Fixes
 

ui/src/organizations/components/OrgTasksPage.tsx

@@ -25,6 +25,7 @@ import {
   importScript,
   addTaskLabelsAsync,
   removeTaskLabelsAsync,
+  runTask,
 } from 'src/tasks/actions/v2'
 
 // Types
@@ -51,6 +52,7 @@ interface ConnectedDispatchProps {
   importScript: typeof importScript
   onAddTaskLabels: typeof addTaskLabelsAsync
   onRemoveTaskLabels: typeof removeTaskLabelsAsync
+  onRunTask: typeof runTask
 }
 
 interface ConnectedStateProps {
@@ -89,6 +91,7 @@ class OrgTasksPage extends PureComponent<Props, State> {
       searchTerm,
       onAddTaskLabels,
       onRemoveTaskLabels,
+      onRunTask,
     } = this.props
 
     return (
@@ -129,6 +132,7 @@ class OrgTasksPage extends PureComponent<Props, State> {
                 onAddTaskLabels={onAddTaskLabels}
                 onRemoveTaskLabels={onRemoveTaskLabels}
                 onUpdate={this.handleUpdateTask}
+                onRunTask={onRunTask}
               />
             )}
           </FilterList>
@@ -245,6 +249,7 @@ const mdtp: ConnectedDispatchProps = {
   importScript,
   onRemoveTaskLabels: removeTaskLabelsAsync,
   onAddTaskLabels: addTaskLabelsAsync,
+  onRunTask: runTask,
 }
 
 export default connect<

ui/src/shared/copy/v2/notifications.ts

@@ -86,6 +86,12 @@ export const taskImportSuccess = (fileName: string): Notification => ({
   message: `Successfully imported file ${fileName}.`,
 })
 
+export const taskRunSuccess = (): Notification => ({
+  ...defaultSuccessNotification,
+  duration: FIVE_SECONDS,
+  message: 'Task ran successfully',
+})
+
 export const getTelegrafConfigFailed = (): Notification => ({
   ...defaultErrorNotification,
   message: 'Failed to get telegraf config',

ui/src/tasks/actions/v2/index.ts

@@ -19,6 +19,7 @@ import {
   taskDeleteSuccess,
   taskCloneSuccess,
   taskCloneFailed,
+  taskRunSuccess,
 } from 'src/shared/copy/v2/notifications'
 
 // Types
@@ -482,3 +483,12 @@ export const getRuns = async (taskID: string): Promise<Run[]> => {
   const runs = await client.tasks.getRunsByTaskID(taskID)
   return runs
 }
+
+export const runTask = (taskID: string) => async dispatch => {
+  try {
+    await client.tasks.startRunByTaskID(taskID)
+    dispatch(notify(taskRunSuccess()))
+  } catch (e) {
+    console.error(e)
+  }
+}

ui/src/tasks/components/TaskRow.test.tsx

@@ -20,6 +20,7 @@ const setup = (override = {}) => {
     onClone: jest.fn(),
     onSelect: jest.fn(),
     onEditLabels: jest.fn(),
+    onRunTask: jest.fn(),
     ...override,
   }
 

ui/src/tasks/components/TaskRow.tsx

@@ -36,6 +36,7 @@ interface Props {
   onSelect: (task: Task) => void
   onClone: (task: Task) => void
   onEditLabels: (task: Task) => void
+  onRunTask: (taskID: string) => void
   onUpdate?: (task: Task) => void
 }
 
@@ -89,6 +90,12 @@ export class TaskRow extends PureComponent<Props & WithRouterProps> {
               icon={IconFont.Duplicate}
               onClick={this.handleClone}
             />
+            <Button
+              size={ComponentSize.ExtraSmall}
+              color={ComponentColor.Primary}
+              text="RunTask"
+              onClick={this.handleRunTask}
+            />
             <ConfirmationButton
               size={ComponentSize.ExtraSmall}
               text="Delete"
@@ -125,6 +132,10 @@ export class TaskRow extends PureComponent<Props & WithRouterProps> {
     )
   }
 
+  private handleRunTask = () => {
+    this.props.onRunTask(this.props.task.id)
+  }
+
   // private handleViewRuns = () => {
   //   const {router, task} = this.props
   //   router.push(`tasks/${task.id}/runs`)

ui/src/tasks/components/TasksList.tsx

@@ -19,7 +19,11 @@ interface Task extends TaskAPI {
 }
 
 import {Sort} from 'src/clockface'
-import {addTaskLabelsAsync, removeTaskLabelsAsync} from 'src/tasks/actions/v2'
+import {
+  addTaskLabelsAsync,
+  removeTaskLabelsAsync,
+  runTask,
+} from 'src/tasks/actions/v2'
 
 interface Props {
   tasks: Task[]
@@ -32,6 +36,7 @@ interface Props {
   totalCount: number
   onRemoveTaskLabels: typeof removeTaskLabelsAsync
   onAddTaskLabels: typeof addTaskLabelsAsync
+  onRunTask: typeof runTask
   onUpdate?: (task: Task) => void
 }
 
@@ -131,7 +136,14 @@ export default class TasksList extends PureComponent<Props, State> {
   }
 
   private rows = (tasks: Task[]): JSX.Element => {
-    const {onActivate, onDelete, onSelect, onClone, onUpdate} = this.props
+    const {
+      onActivate,
+      onDelete,
+      onSelect,
+      onClone,
+      onUpdate,
+      onRunTask,
+    } = this.props
     const taskrows = (
       <>
         {tasks.map(t => (
@@ -144,6 +156,7 @@ export default class TasksList extends PureComponent<Props, State> {
             onSelect={onSelect}
             onEditLabels={this.handleStartEditingLabels}
             onUpdate={onUpdate}
+            onRunTask={onRunTask}
           />
         ))}
       </>

ui/src/tasks/components/__snapshots__/TaskRow.test.tsx.snap

@@ -90,6 +90,16 @@ exports[`Tasks.Components.TaskRow renders 1`] = `
         text="Clone"
         type="button"
       />
+      <t
+        active={false}
+        color="primary"
+        onClick={[Function]}
+        shape="none"
+        size="xs"
+        status="default"
+        text="RunTask"
+        type="button"
+      />
       <ConfirmationButton
         confirmText="Confirm"
         onConfirm={[MockFunction]}

ui/src/tasks/containers/TasksPage.tsx

@@ -24,6 +24,7 @@ import {
   importScript,
   addTaskLabelsAsync,
   removeTaskLabelsAsync,
+  runTask,
 } from 'src/tasks/actions/v2'
 
 // Constants
@@ -55,6 +56,7 @@ interface ConnectedDispatchProps {
   importScript: typeof importScript
   onAddTaskLabels: typeof addTaskLabelsAsync
   onRemoveTaskLabels: typeof removeTaskLabelsAsync
+  onRunTask: typeof runTask
 }
 
 interface ConnectedStateProps {
@@ -97,6 +99,7 @@ class TasksPage extends PureComponent<Props, State> {
       showInactive,
       onAddTaskLabels,
       onRemoveTaskLabels,
+      onRunTask,
     } = this.props
 
     return (
@@ -122,6 +125,7 @@ class TasksPage extends PureComponent<Props, State> {
                 onSelect={this.props.selectTask}
                 onAddTaskLabels={onAddTaskLabels}
                 onRemoveTaskLabels={onRemoveTaskLabels}
+                onRunTask={onRunTask}
               />
               {this.hiddenTaskAlert}
             </div>
@@ -249,6 +253,7 @@ const mdtp: ConnectedDispatchProps = {
   importScript,
   onRemoveTaskLabels: removeTaskLabelsAsync,
   onAddTaskLabels: addTaskLabelsAsync,
+  onRunTask: runTask,
 }
 
 export default connect<