feat: Human Input Node (#32060)

The frontend and backend implementation for the human input node.

Co-authored-by: twwu <twwu@dify.ai>
Co-authored-by: JzoNg <jzongcode@gmail.com>
Co-authored-by: yyh <92089059+lyzno1@users.noreply.github.com>
Co-authored-by: zhsama <torvalds@linux.do>

web/app/components/workflow-app/components/workflow-header/features-trigger.tsx

@@ -111,6 +111,10 @@ const FeaturesTrigger = () => {
     return isFetchedPlan && plan.type === Plan.sandbox && entryCount > 2
   }, [nodes, plan.type, isFetchedPlan])
 
+  const hasHumanInputNode = useMemo(() => {
+    return nodes.some(node => node.data.type === BlockEnum.HumanInput)
+  }, [nodes])
+
   const resetWorkflowVersionHistory = useResetWorkflowVersionHistory()
   const invalidateAppTriggers = useInvalidateAppTriggers()
 
@@ -171,7 +175,7 @@ const FeaturesTrigger = () => {
     else {
       throw new Error('Checklist failed')
     }
-  }, [needWarningNodes, handleCheckBeforePublish, publishWorkflow, notify, appID, t, updatePublishedWorkflow, updateAppDetail, workflowStore, resetWorkflowVersionHistory, invalidateAppTriggers])
+  }, [needWarningNodes, handleCheckBeforePublish, publishWorkflow, notify, appID, t, updatePublishedWorkflow, updateAppDetail, workflowStore, resetWorkflowVersionHistory, invalidateAppTriggers, hasUserInputNode])
 
   const onPublisherToggle = useCallback((state: boolean) => {
     if (state)
@@ -214,6 +218,7 @@ const FeaturesTrigger = () => {
           hasTriggerNode,
           startNodeLimitExceeded,
           publishDisabled: !hasWorkflowNodes || startNodeLimitExceeded,
+          hasHumanInputNode,
         }}
       />
     </>

web/app/components/workflow-app/hooks/use-workflow-run.ts

@@ -21,7 +21,7 @@ import { useWorkflowUpdate } from '@/app/components/workflow/hooks/use-workflow-
 import { useWorkflowRunEvent } from '@/app/components/workflow/hooks/use-workflow-run-event/use-workflow-run-event'
 import { useWorkflowStore } from '@/app/components/workflow/store'
 import { WorkflowRunningStatus } from '@/app/components/workflow/types'
-import { handleStream, post, ssePost } from '@/service/base'
+import { handleStream, post, sseGet, ssePost } from '@/service/base'
 import { ContentType } from '@/service/fetch'
 import { useInvalidAllLastRun } from '@/service/use-workflow'
 import { stopWorkflowRun } from '@/service/workflow'
@@ -79,6 +79,9 @@ export const useWorkflowRun = () => {
     handleWorkflowFailed,
     handleWorkflowNodeStarted,
     handleWorkflowNodeFinished,
+    handleWorkflowNodeHumanInputRequired,
+    handleWorkflowNodeHumanInputFormFilled,
+    handleWorkflowNodeHumanInputFormTimeout,
     handleWorkflowNodeIterationStarted,
     handleWorkflowNodeIterationNext,
     handleWorkflowNodeIterationFinished,
@@ -89,6 +92,7 @@ export const useWorkflowRun = () => {
     handleWorkflowAgentLog,
     handleWorkflowTextChunk,
     handleWorkflowTextReplace,
+    handleWorkflowPaused,
   } = useWorkflowRunEvent()
 
   const handleBackupDraft = useCallback(() => {
@@ -176,6 +180,10 @@ export const useWorkflowRun = () => {
       onNodeRetry,
       onAgentLog,
       onError,
+      onWorkflowPaused,
+      onHumanInputRequired,
+      onHumanInputFormFilled,
+      onHumanInputFormTimeout,
       onCompleted,
       ...restCallback
     } = callback || {}
@@ -372,12 +380,6 @@ export const useWorkflowRun = () => {
     const baseSseOptions: IOtherOptions = {
       ...restCallback,
       onWorkflowStarted: (params) => {
-        const state = workflowStore.getState()
-        if (state.workflowRunningData) {
-          state.setWorkflowRunningData(produce(state.workflowRunningData, (draft) => {
-            draft.resultText = ''
-          }))
-        }
         handleWorkflowStarted(params)
 
         if (onWorkflowStarted)
@@ -492,6 +494,32 @@ export const useWorkflowRun = () => {
         if (audioPlayer)
           audioPlayer.playAudioWithAudio(audio, false)
       },
+      onWorkflowPaused: (params) => {
+        handleWorkflowPaused()
+        if (onWorkflowPaused)
+          onWorkflowPaused(params)
+        const url = `/workflow/${params.workflow_run_id}/events`
+        sseGet(
+          url,
+          {},
+          baseSseOptions,
+        )
+      },
+      onHumanInputRequired: (params) => {
+        handleWorkflowNodeHumanInputRequired(params)
+        if (onHumanInputRequired)
+          onHumanInputRequired(params)
+      },
+      onHumanInputFormFilled: (params) => {
+        handleWorkflowNodeHumanInputFormFilled(params)
+        if (onHumanInputFormFilled)
+          onHumanInputFormFilled(params)
+      },
+      onHumanInputFormTimeout: (params) => {
+        handleWorkflowNodeHumanInputFormTimeout(params)
+        if (onHumanInputFormTimeout)
+          onHumanInputFormTimeout(params)
+      },
       onError: wrappedOnError,
       onCompleted: wrappedOnCompleted,
     }
@@ -604,6 +632,10 @@ export const useWorkflowRun = () => {
             baseSseOptions.onTTSEnd,
             baseSseOptions.onTextReplace,
             baseSseOptions.onAgentLog,
+            baseSseOptions.onHumanInputRequired,
+            baseSseOptions.onHumanInputFormFilled,
+            baseSseOptions.onHumanInputFormTimeout,
+            baseSseOptions.onWorkflowPaused,
             baseSseOptions.onDataSourceNodeProcessing,
             baseSseOptions.onDataSourceNodeCompleted,
             baseSseOptions.onDataSourceNodeError,
@@ -655,19 +687,157 @@ export const useWorkflowRun = () => {
       return
     }
 
+    const finalCallbacks: IOtherOptions = {
+      ...baseSseOptions,
+      getAbortController: (controller: AbortController) => {
+        abortControllerRef.current = controller
+      },
+      onWorkflowFinished: (params) => {
+        handleWorkflowFinished(params)
+
+        if (onWorkflowFinished)
+          onWorkflowFinished(params)
+        if (isInWorkflowDebug) {
+          fetchInspectVars({})
+          invalidAllLastRun()
+        }
+      },
+      onError: (params) => {
+        handleWorkflowFailed()
+
+        if (onError)
+          onError(params)
+      },
+      onNodeStarted: (params) => {
+        handleWorkflowNodeStarted(
+          params,
+          {
+            clientWidth,
+            clientHeight,
+          },
+        )
+
+        if (onNodeStarted)
+          onNodeStarted(params)
+      },
+      onNodeFinished: (params) => {
+        handleWorkflowNodeFinished(params)
+
+        if (onNodeFinished)
+          onNodeFinished(params)
+      },
+      onIterationStart: (params) => {
+        handleWorkflowNodeIterationStarted(
+          params,
+          {
+            clientWidth,
+            clientHeight,
+          },
+        )
+
+        if (onIterationStart)
+          onIterationStart(params)
+      },
+      onIterationNext: (params) => {
+        handleWorkflowNodeIterationNext(params)
+
+        if (onIterationNext)
+          onIterationNext(params)
+      },
+      onIterationFinish: (params) => {
+        handleWorkflowNodeIterationFinished(params)
+
+        if (onIterationFinish)
+          onIterationFinish(params)
+      },
+      onLoopStart: (params) => {
+        handleWorkflowNodeLoopStarted(
+          params,
+          {
+            clientWidth,
+            clientHeight,
+          },
+        )
+
+        if (onLoopStart)
+          onLoopStart(params)
+      },
+      onLoopNext: (params) => {
+        handleWorkflowNodeLoopNext(params)
+
+        if (onLoopNext)
+          onLoopNext(params)
+      },
+      onLoopFinish: (params) => {
+        handleWorkflowNodeLoopFinished(params)
+
+        if (onLoopFinish)
+          onLoopFinish(params)
+      },
+      onNodeRetry: (params) => {
+        handleWorkflowNodeRetry(params)
+
+        if (onNodeRetry)
+          onNodeRetry(params)
+      },
+      onAgentLog: (params) => {
+        handleWorkflowAgentLog(params)
+
+        if (onAgentLog)
+          onAgentLog(params)
+      },
+      onTextChunk: (params) => {
+        handleWorkflowTextChunk(params)
+      },
+      onTextReplace: (params) => {
+        handleWorkflowTextReplace(params)
+      },
+      onTTSChunk: (messageId: string, audio: string) => {
+        if (!audio || audio === '')
+          return
+        player?.playAudioWithAudio(audio, true)
+        AudioPlayerManager.getInstance().resetMsgId(messageId)
+      },
+      onTTSEnd: (messageId: string, audio: string) => {
+        player?.playAudioWithAudio(audio, false)
+      },
+      onWorkflowPaused: (params) => {
+        handleWorkflowPaused()
+        if (onWorkflowPaused)
+          onWorkflowPaused(params)
+        const url = `/workflow/${params.workflow_run_id}/events`
+        sseGet(
+          url,
+          {},
+          finalCallbacks,
+        )
+      },
+      onHumanInputRequired: (params) => {
+        handleWorkflowNodeHumanInputRequired(params)
+        if (onHumanInputRequired)
+          onHumanInputRequired(params)
+      },
+      onHumanInputFormFilled: (params) => {
+        handleWorkflowNodeHumanInputFormFilled(params)
+        if (onHumanInputFormFilled)
+          onHumanInputFormFilled(params)
+      },
+      onHumanInputFormTimeout: (params) => {
+        handleWorkflowNodeHumanInputFormTimeout(params)
+        if (onHumanInputFormTimeout)
+          onHumanInputFormTimeout(params)
+      },
+      ...restCallback,
+    }
+
     ssePost(
       url,
       {
         body: requestBody,
       },
-      {
-        ...baseSseOptions,
-        getAbortController: (controller: AbortController) => {
-          abortControllerRef.current = controller
-        },
-      },
+      finalCallbacks,
     )
-  }, [store, doSyncWorkflowDraft, workflowStore, pathname, handleWorkflowStarted, handleWorkflowFinished, fetchInspectVars, invalidAllLastRun, handleWorkflowFailed, handleWorkflowNodeStarted, handleWorkflowNodeFinished, handleWorkflowNodeIterationStarted, handleWorkflowNodeIterationNext, handleWorkflowNodeIterationFinished, handleWorkflowNodeLoopStarted, handleWorkflowNodeLoopNext, handleWorkflowNodeLoopFinished, handleWorkflowNodeRetry, handleWorkflowAgentLog, handleWorkflowTextChunk, handleWorkflowTextReplace])
+  }, [store, doSyncWorkflowDraft, workflowStore, pathname, handleWorkflowFailed, flowId, handleWorkflowStarted, handleWorkflowFinished, fetchInspectVars, invalidAllLastRun, handleWorkflowNodeStarted, handleWorkflowNodeFinished, handleWorkflowNodeIterationStarted, handleWorkflowNodeIterationNext, handleWorkflowNodeIterationFinished, handleWorkflowNodeLoopStarted, handleWorkflowNodeLoopNext, handleWorkflowNodeLoopFinished, handleWorkflowNodeRetry, handleWorkflowAgentLog, handleWorkflowTextChunk, handleWorkflowTextReplace, handleWorkflowPaused, handleWorkflowNodeHumanInputRequired, handleWorkflowNodeHumanInputFormFilled, handleWorkflowNodeHumanInputFormTimeout])
 
   const handleStopRun = useCallback((taskId: string) => {
     const setStoppedState = () => {