feat: introduce trigger functionality (#27644)

Signed-off-by: lyzno1 <yuanyouhuilyz@gmail.com> Co-authored-by: Stream <Stream_2@qq.com> Co-authored-by: lyzno1 <92089059+lyzno1@users.noreply.github.com> Co-authored-by: zhsama <torvalds@linux.do> Co-authored-by: Harry <xh001x@hotmail.com> Co-authored-by: lyzno1 <yuanyouhuilyz@gmail.com> Co-authored-by: yessenia <yessenia.contact@gmail.com> Co-authored-by: hjlarry <hjlarry@163.com> Co-authored-by: gemini-code-assist[bot] <176961590+gemini-code-assist[bot]@users.noreply.github.com> Co-authored-by: Copilot Autofix powered by AI <62310815+github-advanced-security[bot]@users.noreply.github.com> Co-authored-by: autofix-ci[bot] <114827586+autofix-ci[bot]@users.noreply.github.com> Co-authored-by: WTW0313 <twwu@dify.ai> Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
2025-11-12 17:59:37 +08:00
parent ca7794305b
commit b76e17b25d
785 changed files with 41186 additions and 3725 deletions
--- a/web/app/components/workflow-app/components/workflow-children.tsx
+++ b/web/app/components/workflow-app/components/workflow-children.tsx
@@ -1,19 +1,32 @@
 import {
  memo,
+  useCallback,
  useState,
 } from 'react'
 import type { EnvironmentVariable } from '@/app/components/workflow/types'
 import { DSL_EXPORT_CHECK } from '@/app/components/workflow/constants'
+import { START_INITIAL_POSITION } from '@/app/components/workflow/constants'
+import { generateNewNode } from '@/app/components/workflow/utils'
 import { useStore } from '@/app/components/workflow/store'
+import { useStoreApi } from 'reactflow'
 import PluginDependency from '../../workflow/plugin-dependency'
 import {
+  useAutoGenerateWebhookUrl,
  useDSL,
  usePanelInteractions,
 } from '@/app/components/workflow/hooks'
+import { useNodesSyncDraft } from '@/app/components/workflow/hooks/use-nodes-sync-draft'
 import { useEventEmitterContextContext } from '@/context/event-emitter'
 import WorkflowHeader from './workflow-header'
 import WorkflowPanel from './workflow-panel'
 import dynamic from 'next/dynamic'
+import { BlockEnum } from '@/app/components/workflow/types'
+import type {
+  PluginDefaultValue,
+  TriggerDefaultValue,
+} from '@/app/components/workflow/block-selector/types'
+import { useAutoOnboarding } from '../hooks/use-auto-onboarding'
+import { useAvailableNodesMetaData } from '../hooks'

 const Features = dynamic(() => import('@/app/components/workflow/features'), {
  ssr: false,
@@ -24,6 +37,34 @@ const UpdateDSLModal = dynamic(() => import('@/app/components/workflow/update-ds
 const DSLExportConfirmModal = dynamic(() => import('@/app/components/workflow/dsl-export-confirm-modal'), {
  ssr: false,
 })
+const WorkflowOnboardingModal = dynamic(() => import('./workflow-onboarding-modal'), {
+  ssr: false,
+})
+
+const getTriggerPluginNodeData = (
+  triggerConfig: TriggerDefaultValue,
+  fallbackTitle?: string,
+  fallbackDesc?: string,
+) => {
+  return {
+    plugin_id: triggerConfig.plugin_id,
+    provider_id: triggerConfig.provider_name,
+    provider_type: triggerConfig.provider_type,
+    provider_name: triggerConfig.provider_name,
+    event_name: triggerConfig.event_name,
+    event_label: triggerConfig.event_label,
+    event_description: triggerConfig.event_description,
+    title: triggerConfig.event_label || triggerConfig.title || fallbackTitle,
+    desc: triggerConfig.event_description || fallbackDesc,
+    output_schema: { ...triggerConfig.output_schema },
+    parameters_schema: triggerConfig.paramSchemas ? [...triggerConfig.paramSchemas] : [],
+    config: { ...triggerConfig.params },
+    subscription_id: triggerConfig.subscription_id,
+    plugin_unique_identifier: triggerConfig.plugin_unique_identifier,
+    is_team_authorization: triggerConfig.is_team_authorization,
+    meta: triggerConfig.meta ? { ...triggerConfig.meta } : undefined,
+  }
+}

 const WorkflowChildren = () => {
  const { eventEmitter } = useEventEmitterContextContext()
@@ -31,6 +72,14 @@ const WorkflowChildren = () => {
  const showFeaturesPanel = useStore(s => s.showFeaturesPanel)
  const showImportDSLModal = useStore(s => s.showImportDSLModal)
  const setShowImportDSLModal = useStore(s => s.setShowImportDSLModal)
+  const showOnboarding = useStore(s => s.showOnboarding)
+  const setShowOnboarding = useStore(s => s.setShowOnboarding)
+  const setHasSelectedStartNode = useStore(s => s.setHasSelectedStartNode)
+  const setShouldAutoOpenStartNodeSelector = useStore(s => s.setShouldAutoOpenStartNodeSelector)
+  const reactFlowStore = useStoreApi()
+  const availableNodesMetaData = useAvailableNodesMetaData()
+  const { handleSyncWorkflowDraft } = useNodesSyncDraft()
+  const { handleOnboardingClose } = useAutoOnboarding()
  const {
    handlePaneContextmenuCancel,
  } = usePanelInteractions()
@@ -44,12 +93,84 @@ const WorkflowChildren = () => {
      setSecretEnvList(v.payload.data as EnvironmentVariable[])
  })

+  const autoGenerateWebhookUrl = useAutoGenerateWebhookUrl()
+
+  const handleCloseOnboarding = useCallback(() => {
+    handleOnboardingClose()
+  }, [handleOnboardingClose])
+
+  const handleSelectStartNode = useCallback((nodeType: BlockEnum, toolConfig?: PluginDefaultValue) => {
+    const nodeDefault = availableNodesMetaData.nodesMap?.[nodeType]
+    if (!nodeDefault?.defaultValue)
+      return
+
+    const baseNodeData = { ...nodeDefault.defaultValue }
+
+    const mergedNodeData = (() => {
+      if (nodeType !== BlockEnum.TriggerPlugin || !toolConfig) {
+        return {
+          ...baseNodeData,
+          ...toolConfig,
+        }
+      }
+
+      const triggerNodeData = getTriggerPluginNodeData(
+        toolConfig as TriggerDefaultValue,
+        baseNodeData.title,
+        baseNodeData.desc,
+      )
+
+      return {
+        ...baseNodeData,
+        ...triggerNodeData,
+        config: {
+          ...(baseNodeData as { config?: Record<string, any> }).config,
+          ...triggerNodeData.config,
+        },
+      }
+    })()
+
+    const { newNode } = generateNewNode({
+      data: {
+        ...mergedNodeData,
+      } as any,
+      position: START_INITIAL_POSITION,
+    })
+
+    const { setNodes, setEdges } = reactFlowStore.getState()
+    setNodes([newNode])
+    setEdges([])
+
+    setShowOnboarding?.(false)
+    setHasSelectedStartNode?.(true)
+    setShouldAutoOpenStartNodeSelector?.(true)
+
+    handleSyncWorkflowDraft(true, false, {
+      onSuccess: () => {
+        autoGenerateWebhookUrl(newNode.id)
+        console.log('Node successfully saved to draft')
+      },
+      onError: () => {
+        console.error('Failed to save node to draft')
+      },
+    })
+  }, [availableNodesMetaData, setShowOnboarding, setHasSelectedStartNode, reactFlowStore, handleSyncWorkflowDraft])
+
  return (
    <>
      <PluginDependency />
      {
        showFeaturesPanel && <Features />
      }
+      {
+        showOnboarding && (
+          <WorkflowOnboardingModal
+            isShow={showOnboarding}
+            onClose={handleCloseOnboarding}
+            onSelectStartNode={handleSelectStartNode}
+          />
+        )
+      }
      {
        showImportDSLModal && (
          <UpdateDSLModal
--- a/web/app/components/workflow-app/components/workflow-header/features-trigger.tsx
+++ b/web/app/components/workflow-app/components/workflow-header/features-trigger.tsx
@@ -3,7 +3,7 @@ import {
  useCallback,
  useMemo,
 } from 'react'
-import { useEdges, useNodes, useStore as useReactflowStore } from 'reactflow'
+import { useEdges, useNodes } from 'reactflow'
 import { RiApps2AddLine } from '@remixicon/react'
 import { useTranslation } from 'react-i18next'
 import {
@@ -15,6 +15,7 @@ import {
  useChecklistBeforePublish,
  useNodesReadOnly,
  useNodesSyncDraft,
+  // useWorkflowRunValidation,
 } from '@/app/components/workflow/hooks'
 import Button from '@/app/components/base/button'
 import AppPublisher from '@/app/components/app/app-publisher'
@@ -22,36 +23,44 @@ import { useFeatures } from '@/app/components/base/features/hooks'
 import type {
  CommonEdgeType,
  CommonNodeType,
+  Node,
 } from '@/app/components/workflow/types'
 import {
  BlockEnum,
  InputVarType,
+  isTriggerNode,
 } from '@/app/components/workflow/types'
 import { useToastContext } from '@/app/components/base/toast'
 import { useInvalidateAppWorkflow, usePublishWorkflow, useResetWorkflowVersionHistory } from '@/service/use-workflow'
+import { useInvalidateAppTriggers } from '@/service/use-tools'
 import type { PublishWorkflowParams } from '@/types/workflow'
 import { fetchAppDetail } from '@/service/apps'
 import { useStore as useAppStore } from '@/app/components/app/store'
 import useTheme from '@/hooks/use-theme'
 import cn from '@/utils/classnames'
+import { useIsChatMode } from '@/app/components/workflow/hooks'
+import type { StartNodeType } from '@/app/components/workflow/nodes/start/types'

 const FeaturesTrigger = () => {
  const { t } = useTranslation()
  const { theme } = useTheme()
+  const isChatMode = useIsChatMode()
  const workflowStore = useWorkflowStore()
  const appDetail = useAppStore(s => s.appDetail)
  const appID = appDetail?.id
  const setAppDetail = useAppStore(s => s.setAppDetail)
-  const {
-    nodesReadOnly,
-    getNodesReadOnly,
-  } = useNodesReadOnly()
+  const { nodesReadOnly, getNodesReadOnly } = useNodesReadOnly()
  const publishedAt = useStore(s => s.publishedAt)
  const draftUpdatedAt = useStore(s => s.draftUpdatedAt)
  const toolPublished = useStore(s => s.toolPublished)
-  const startVariables = useReactflowStore(
-    s => s.getNodes().find(node => node.data.type === BlockEnum.Start)?.data.variables,
-  )
+  const lastPublishedHasUserInput = useStore(s => s.lastPublishedHasUserInput)
+
+  const nodes = useNodes<CommonNodeType>()
+  const hasWorkflowNodes = nodes.length > 0
+  const startNode = nodes.find(node => node.data.type === BlockEnum.Start)
+  const startVariables = (startNode as Node<StartNodeType>)?.data?.variables
+  const edges = useEdges<CommonEdgeType>()
+
  const fileSettings = useFeatures(s => s.features.file)
  const variables = useMemo(() => {
    const data = startVariables || []
@@ -73,6 +82,22 @@ const FeaturesTrigger = () => {
  const { handleCheckBeforePublish } = useChecklistBeforePublish()
  const { handleSyncWorkflowDraft } = useNodesSyncDraft()
  const { notify } = useToastContext()
+  const startNodeIds = useMemo(
+    () => nodes.filter(node => node.data.type === BlockEnum.Start).map(node => node.id),
+    [nodes],
+  )
+  const hasUserInputNode = useMemo(() => {
+    if (!startNodeIds.length)
+      return false
+    return edges.some(edge => startNodeIds.includes(edge.source))
+  }, [edges, startNodeIds])
+  // Track trigger presence so the publisher can adjust UI (e.g. hide missing start section).
+  const hasTriggerNode = useMemo(() => (
+    nodes.some(node => isTriggerNode(node.data.type as BlockEnum))
+  ), [nodes])
+
+  const resetWorkflowVersionHistory = useResetWorkflowVersionHistory()
+  const invalidateAppTriggers = useInvalidateAppTriggers()

  const handleShowFeatures = useCallback(() => {
    const {
@@ -85,8 +110,6 @@ const FeaturesTrigger = () => {
    setShowFeaturesPanel(!showFeaturesPanel)
  }, [workflowStore, getNodesReadOnly])

-  const resetWorkflowVersionHistory = useResetWorkflowVersionHistory()
-
  const updateAppDetail = useCallback(async () => {
    try {
      const res = await fetchAppDetail({ url: '/apps', id: appID! })
@@ -96,14 +119,17 @@ const FeaturesTrigger = () => {
      console.error(error)
    }
  }, [appID, setAppDetail])
+
  const { mutateAsync: publishWorkflow } = usePublishWorkflow()
-  const nodes = useNodes<CommonNodeType>()
-  const edges = useEdges<CommonEdgeType>()
+  // const { validateBeforeRun } = useWorkflowRunValidation()
  const needWarningNodes = useChecklist(nodes, edges)

  const updatePublishedWorkflow = useInvalidateAppWorkflow()
  const onPublish = useCallback(async (params?: PublishWorkflowParams) => {
    // First check if there are any items in the checklist
+    // if (!validateBeforeRun())
+    //   throw new Error('Checklist has unresolved items')
+
    if (needWarningNodes.length > 0) {
      notify({ type: 'error', message: t('workflow.panel.checklistTip') })
      throw new Error('Checklist has unresolved items')
@@ -121,14 +147,16 @@ const FeaturesTrigger = () => {
        notify({ type: 'success', message: t('common.api.actionSuccess') })
        updatePublishedWorkflow(appID!)
        updateAppDetail()
+        invalidateAppTriggers(appID!)
        workflowStore.getState().setPublishedAt(res.created_at)
+        workflowStore.getState().setLastPublishedHasUserInput(hasUserInputNode)
        resetWorkflowVersionHistory()
      }
    }
    else {
      throw new Error('Checklist failed')
    }
-  }, [needWarningNodes, handleCheckBeforePublish, publishWorkflow, notify, appID, t, updatePublishedWorkflow, updateAppDetail, workflowStore, resetWorkflowVersionHistory])
+  }, [needWarningNodes, handleCheckBeforePublish, publishWorkflow, notify, appID, t, updatePublishedWorkflow, updateAppDetail, workflowStore, resetWorkflowVersionHistory, invalidateAppTriggers])

  const onPublisherToggle = useCallback((state: boolean) => {
    if (state)
@@ -141,27 +169,34 @@ const FeaturesTrigger = () => {

  return (
    <>
-      <Button
-        className={cn(
-          'text-components-button-secondary-text',
-          theme === 'dark' && 'rounded-lg border border-black/5 bg-white/10 backdrop-blur-sm',
-        )}
-        onClick={handleShowFeatures}
-      >
-        <RiApps2AddLine className='mr-1 h-4 w-4 text-components-button-secondary-text' />
-        {t('workflow.common.features')}
-      </Button>
+      {/* Feature button is only visible in chatflow mode (advanced-chat) */}
+      {isChatMode && (
+        <Button
+          className={cn(
+            'text-components-button-secondary-text',
+            theme === 'dark' && 'rounded-lg border border-black/5 bg-white/10 backdrop-blur-sm',
+          )}
+          onClick={handleShowFeatures}
+        >
+          <RiApps2AddLine className='mr-1 h-4 w-4 text-components-button-secondary-text' />
+          {t('workflow.common.features')}
+        </Button>
+      )}
      <AppPublisher
        {...{
          publishedAt,
          draftUpdatedAt,
-          disabled: nodesReadOnly,
+          disabled: nodesReadOnly || !hasWorkflowNodes,
          toolPublished,
          inputs: variables,
          onRefreshData: handleToolConfigureUpdate,
          onPublish,
          onToggle: onPublisherToggle,
+          workflowToolAvailable: lastPublishedHasUserInput,
          crossAxisOffset: 4,
+          missingStartNode: !startNode,
+          hasTriggerNode,
+          publishDisabled: !hasWorkflowNodes,
        }}
      />
    </>
--- a/web/app/components/workflow-app/components/workflow-header/index.tsx
+++ b/web/app/components/workflow-app/components/workflow-header/index.tsx
@@ -41,8 +41,8 @@ const WorkflowHeader = () => {
    return {
      normal: {
        components: {
-          left: <ChatVariableTrigger />,
          middle: <FeaturesTrigger />,
+          chatVariableTrigger: <ChatVariableTrigger />,
        },
        runAndHistoryProps: {
          showRunButton: !isChatMode,
--- a/web/app/components/workflow-app/components/workflow-main.tsx
+++ b/web/app/components/workflow-app/components/workflow-main.tsx
@@ -66,6 +66,10 @@ const WorkflowMain = ({
    handleStartWorkflowRun,
    handleWorkflowStartRunInChatflow,
    handleWorkflowStartRunInWorkflow,
+    handleWorkflowTriggerScheduleRunInWorkflow,
+    handleWorkflowTriggerWebhookRunInWorkflow,
+    handleWorkflowTriggerPluginRunInWorkflow,
+    handleWorkflowRunAllTriggersInWorkflow,
  } = useWorkflowStartRun()
  const availableNodesMetaData = useAvailableNodesMetaData()
  const { getWorkflowRunAndTraceUrl } = useGetRunAndTraceUrl()
@@ -108,6 +112,10 @@ const WorkflowMain = ({
      handleStartWorkflowRun,
      handleWorkflowStartRunInChatflow,
      handleWorkflowStartRunInWorkflow,
+      handleWorkflowTriggerScheduleRunInWorkflow,
+      handleWorkflowTriggerWebhookRunInWorkflow,
+      handleWorkflowTriggerPluginRunInWorkflow,
+      handleWorkflowRunAllTriggersInWorkflow,
      availableNodesMetaData,
      getWorkflowRunAndTraceUrl,
      exportCheck,
@@ -141,6 +149,10 @@ const WorkflowMain = ({
    handleStartWorkflowRun,
    handleWorkflowStartRunInChatflow,
    handleWorkflowStartRunInWorkflow,
+    handleWorkflowTriggerScheduleRunInWorkflow,
+    handleWorkflowTriggerWebhookRunInWorkflow,
+    handleWorkflowTriggerPluginRunInWorkflow,
+    handleWorkflowRunAllTriggersInWorkflow,
    availableNodesMetaData,
    getWorkflowRunAndTraceUrl,
    exportCheck,
--- a/web/app/components/workflow-app/components/workflow-onboarding-modal/index.tsx
+++ b/web/app/components/workflow-app/components/workflow-onboarding-modal/index.tsx
@@ -0,0 +1,99 @@
+'use client'
+import type { FC } from 'react'
+import {
+  useCallback,
+  useEffect,
+} from 'react'
+import { useTranslation } from 'react-i18next'
+import { BlockEnum } from '@/app/components/workflow/types'
+import type { PluginDefaultValue } from '@/app/components/workflow/block-selector/types'
+import Modal from '@/app/components/base/modal'
+import StartNodeSelectionPanel from './start-node-selection-panel'
+import { useDocLink } from '@/context/i18n'
+
+type WorkflowOnboardingModalProps = {
+  isShow: boolean
+  onClose: () => void
+  onSelectStartNode: (nodeType: BlockEnum, toolConfig?: PluginDefaultValue) => void
+}
+
+const WorkflowOnboardingModal: FC<WorkflowOnboardingModalProps> = ({
+  isShow,
+  onClose,
+  onSelectStartNode,
+}) => {
+  const { t } = useTranslation()
+  const docLink = useDocLink()
+
+  const handleSelectUserInput = useCallback(() => {
+    onSelectStartNode(BlockEnum.Start)
+    onClose() // Close modal after selection
+  }, [onSelectStartNode, onClose])
+
+  const handleTriggerSelect = useCallback((nodeType: BlockEnum, toolConfig?: PluginDefaultValue) => {
+    onSelectStartNode(nodeType, toolConfig)
+    onClose() // Close modal after selection
+  }, [onSelectStartNode, onClose])
+
+  useEffect(() => {
+    const handleEsc = (e: KeyboardEvent) => {
+      if (e.key === 'Escape' && isShow)
+        onClose()
+    }
+    document.addEventListener('keydown', handleEsc)
+    return () => document.removeEventListener('keydown', handleEsc)
+  }, [isShow, onClose])
+
+  return (
+    <>
+      <Modal
+        isShow={isShow}
+        onClose={onClose}
+        className="w-[618px] max-w-[618px] rounded-2xl border border-effects-highlight bg-background-default-subtle shadow-lg"
+        overlayOpacity
+        closable
+        clickOutsideNotClose
+      >
+        <div className="pb-4">
+          {/* Header */}
+          <div className="mb-6">
+            <h3 className="title-2xl-semi-bold mb-2 text-text-primary">
+              {t('workflow.onboarding.title')}
+            </h3>
+            <div className="body-xs-regular leading-4 text-text-tertiary">
+              {t('workflow.onboarding.description')}{' '}
+              <a
+                href={docLink('/guides/workflow/node/start')}
+                target="_blank"
+                rel="noopener noreferrer"
+                className="hover:text-text-accent-hover cursor-pointer text-text-accent underline"
+              >
+                {t('workflow.onboarding.learnMore')}
+              </a>{' '}
+              {t('workflow.onboarding.aboutStartNode')}
+            </div>
+          </div>
+
+          {/* Content */}
+          <StartNodeSelectionPanel
+            onSelectUserInput={handleSelectUserInput}
+            onSelectTrigger={handleTriggerSelect}
+          />
+        </div>
+      </Modal>
+
+      {/* ESC tip below modal */}
+      {isShow && (
+        <div className="body-xs-regular pointer-events-none fixed left-1/2 top-1/2 z-[70] flex -translate-x-1/2 translate-y-[165px] items-center gap-1 text-text-quaternary">
+          <span>{t('workflow.onboarding.escTip.press')}</span>
+          <kbd className="system-kbd inline-flex h-4 min-w-4 items-center justify-center rounded bg-components-kbd-bg-gray px-1 text-text-tertiary">
+            {t('workflow.onboarding.escTip.key')}
+          </kbd>
+          <span>{t('workflow.onboarding.escTip.toDismiss')}</span>
+        </div>
+      )}
+    </>
+  )
+}
+
+export default WorkflowOnboardingModal
--- a/web/app/components/workflow-app/components/workflow-onboarding-modal/start-node-option.tsx
+++ b/web/app/components/workflow-app/components/workflow-onboarding-modal/start-node-option.tsx
@@ -0,0 +1,53 @@
+'use client'
+import type { FC, ReactNode } from 'react'
+import cn from '@/utils/classnames'
+
+type StartNodeOptionProps = {
+  icon: ReactNode
+  title: string
+  subtitle?: string
+  description: string
+  onClick: () => void
+}
+
+const StartNodeOption: FC<StartNodeOptionProps> = ({
+  icon,
+  title,
+  subtitle,
+  description,
+  onClick,
+}) => {
+  return (
+    <div
+      onClick={onClick}
+      className={cn(
+        'hover:border-components-panel-border-active flex h-40 w-[280px] cursor-pointer flex-col gap-2 rounded-xl border-[0.5px] border-components-option-card-option-border bg-components-panel-on-panel-item-bg p-4 shadow-sm transition-all hover:shadow-md',
+      )}
+    >
+      {/* Icon */}
+      <div className="shrink-0">
+        {icon}
+      </div>
+
+      {/* Text content */}
+      <div className="flex h-[74px] flex-col gap-1 py-0.5">
+        <div className="h-5 leading-5">
+          <h3 className="system-md-semi-bold text-text-primary">
+            {title}
+            {subtitle && (
+              <span className="system-md-regular text-text-quaternary"> {subtitle}</span>
+            )}
+          </h3>
+        </div>
+
+        <div className="h-12 leading-4">
+          <p className="system-xs-regular text-text-tertiary">
+            {description}
+          </p>
+        </div>
+      </div>
+    </div>
+  )
+}
+
+export default StartNodeOption
--- a/web/app/components/workflow-app/components/workflow-onboarding-modal/start-node-selection-panel.tsx
+++ b/web/app/components/workflow-app/components/workflow-onboarding-modal/start-node-selection-panel.tsx
@@ -0,0 +1,80 @@
+'use client'
+import type { FC } from 'react'
+import { useCallback, useState } from 'react'
+import { useTranslation } from 'react-i18next'
+import StartNodeOption from './start-node-option'
+import NodeSelector from '@/app/components/workflow/block-selector'
+import { Home } from '@/app/components/base/icons/src/vender/workflow'
+import { TriggerAll } from '@/app/components/base/icons/src/vender/workflow'
+import { BlockEnum } from '@/app/components/workflow/types'
+import type { PluginDefaultValue } from '@/app/components/workflow/block-selector/types'
+import { TabsEnum } from '@/app/components/workflow/block-selector/types'
+
+type StartNodeSelectionPanelProps = {
+  onSelectUserInput: () => void
+  onSelectTrigger: (nodeType: BlockEnum, toolConfig?: PluginDefaultValue) => void
+}
+
+const StartNodeSelectionPanel: FC<StartNodeSelectionPanelProps> = ({
+  onSelectUserInput,
+  onSelectTrigger,
+}) => {
+  const { t } = useTranslation()
+  const [showTriggerSelector, setShowTriggerSelector] = useState(false)
+
+  const handleTriggerClick = useCallback(() => {
+    setShowTriggerSelector(true)
+  }, [])
+
+  const handleTriggerSelect = useCallback((nodeType: BlockEnum, toolConfig?: PluginDefaultValue) => {
+    setShowTriggerSelector(false)
+    onSelectTrigger(nodeType, toolConfig)
+  }, [onSelectTrigger])
+
+  return (
+    <div className="grid grid-cols-2 gap-4">
+      <StartNodeOption
+        icon={
+          <div className="flex h-9 w-9 items-center justify-center rounded-[10px] border-[0.5px] border-transparent bg-util-colors-blue-brand-blue-brand-500 p-2">
+            <Home className="h-5 w-5 text-white" />
+          </div>
+        }
+        title={t('workflow.onboarding.userInputFull')}
+        description={t('workflow.onboarding.userInputDescription')}
+        onClick={onSelectUserInput}
+      />
+
+      <NodeSelector
+        open={showTriggerSelector}
+        onOpenChange={setShowTriggerSelector}
+        onSelect={handleTriggerSelect}
+        placement="right"
+        offset={-200}
+        noBlocks={true}
+        showStartTab={true}
+        defaultActiveTab={TabsEnum.Start}
+        forceShowStartContent={true}
+        availableBlocksTypes={[
+          BlockEnum.TriggerSchedule,
+          BlockEnum.TriggerWebhook,
+          BlockEnum.TriggerPlugin,
+        ]}
+        trigger={() => (
+          <StartNodeOption
+            icon={
+              <div className="flex h-9 w-9 items-center justify-center rounded-[10px] border-[0.5px] border-transparent bg-util-colors-blue-brand-blue-brand-500 p-2">
+                <TriggerAll className="h-5 w-5 text-white" />
+              </div>
+            }
+            title={t('workflow.onboarding.trigger')}
+            description={t('workflow.onboarding.triggerDescription')}
+            onClick={handleTriggerClick}
+          />
+        )}
+        popupClassName="z-[1200]"
+      />
+    </div>
+  )
+}
+
+export default StartNodeSelectionPanel
--- a/web/app/components/workflow-app/hooks/use-auto-onboarding.ts
+++ b/web/app/components/workflow-app/hooks/use-auto-onboarding.ts
@@ -0,0 +1,68 @@
+import { useCallback, useEffect } from 'react'
+import { useStoreApi } from 'reactflow'
+import { useWorkflowStore } from '@/app/components/workflow/store'
+
+export const useAutoOnboarding = () => {
+  const store = useStoreApi()
+  const workflowStore = useWorkflowStore()
+
+  const checkAndShowOnboarding = useCallback(() => {
+    const { getNodes } = store.getState()
+    const {
+      showOnboarding,
+      hasShownOnboarding,
+      notInitialWorkflow,
+      setShowOnboarding,
+      setHasShownOnboarding,
+      setShouldAutoOpenStartNodeSelector,
+    } = workflowStore.getState()
+
+    // Skip if already showing onboarding or it's the initial workflow creation
+    if (showOnboarding || notInitialWorkflow)
+      return
+
+    const nodes = getNodes()
+
+    // Check if canvas is completely empty (no nodes at all)
+    // Only trigger onboarding when canvas is completely blank to avoid data loss
+    const isCompletelyEmpty = nodes.length === 0
+
+    // Show onboarding only if canvas is completely empty and we haven't shown it before in this session
+    if (isCompletelyEmpty && !hasShownOnboarding) {
+      setShowOnboarding?.(true)
+      setHasShownOnboarding?.(true)
+      setShouldAutoOpenStartNodeSelector?.(true)
+    }
+  }, [store, workflowStore])
+
+  const handleOnboardingClose = useCallback(() => {
+    const {
+      setShowOnboarding,
+      setHasShownOnboarding,
+      setShouldAutoOpenStartNodeSelector,
+      hasSelectedStartNode,
+      setHasSelectedStartNode,
+    } = workflowStore.getState()
+    setShowOnboarding?.(false)
+    setHasShownOnboarding?.(true)
+    if (hasSelectedStartNode)
+      setHasSelectedStartNode?.(false)
+    else
+      setShouldAutoOpenStartNodeSelector?.(false)
+  }, [workflowStore])
+
+  // Check on mount and when nodes change
+  useEffect(() => {
+    // Small delay to ensure the workflow data is loaded
+    const timer = setTimeout(() => {
+      checkAndShowOnboarding()
+    }, 500)
+
+    return () => clearTimeout(timer)
+  }, [checkAndShowOnboarding])
+
+  return {
+    checkAndShowOnboarding,
+    handleOnboardingClose,
+  }
+}
--- a/web/app/components/workflow-app/hooks/use-available-nodes-meta-data.ts
+++ b/web/app/components/workflow-app/hooks/use-available-nodes-meta-data.ts
@@ -1,7 +1,10 @@
 import { useMemo } from 'react'
 import { useTranslation } from 'react-i18next'
-import { useGetLanguage } from '@/context/i18n'
+import { useDocLink } from '@/context/i18n'
 import StartDefault from '@/app/components/workflow/nodes/start/default'
+import TriggerWebhookDefault from '@/app/components/workflow/nodes/trigger-webhook/default'
+import TriggerScheduleDefault from '@/app/components/workflow/nodes/trigger-schedule/default'
+import TriggerPluginDefault from '@/app/components/workflow/nodes/trigger-plugin/default'
 import EndDefault from '@/app/components/workflow/nodes/end/default'
 import AnswerDefault from '@/app/components/workflow/nodes/answer/default'
 import { WORKFLOW_COMMON_NODES } from '@/app/components/workflow/constants/node'
@@ -12,7 +15,7 @@ import { BlockEnum } from '@/app/components/workflow/types'
 export const useAvailableNodesMetaData = () => {
  const { t } = useTranslation()
  const isChatMode = useIsChatMode()
-  const language = useGetLanguage()
+  const docLink = useDocLink()

  const mergedNodesMetaData = useMemo(() => [
    ...WORKFLOW_COMMON_NODES,
@@ -20,28 +23,27 @@ export const useAvailableNodesMetaData = () => {
    ...(
      isChatMode
        ? [AnswerDefault]
-        : [EndDefault]
+        : [
+          EndDefault,
+          TriggerWebhookDefault,
+          TriggerScheduleDefault,
+          TriggerPluginDefault,
+        ]
    ),
  ], [isChatMode])

-  const prefixLink = useMemo(() => {
-    if (language === 'zh_Hans')
-      return 'https://docs.dify.ai/zh-hans/guides/workflow/node/'
-
-    return 'https://docs.dify.ai/guides/workflow/node/'
-  }, [language])
-
  const availableNodesMetaData = useMemo(() => mergedNodesMetaData.map((node) => {
    const { metaData } = node
    const title = t(`workflow.blocks.${metaData.type}`)
    const description = t(`workflow.blocksAbout.${metaData.type}`)
+    const helpLinkPath = `guides/workflow/node/${metaData.helpLinkUri}`
    return {
      ...node,
      metaData: {
        ...metaData,
        title,
        description,
-        helpLinkUri: `${prefixLink}${metaData.helpLinkUri}`,
+        helpLinkUri: docLink(helpLinkPath),
      },
      defaultValue: {
        ...node.defaultValue,
@@ -49,7 +51,7 @@ export const useAvailableNodesMetaData = () => {
        title,
      },
    }
-  }), [mergedNodesMetaData, t, prefixLink])
+  }), [mergedNodesMetaData, t, docLink])

  const availableNodesMetaDataMap = useMemo(() => availableNodesMetaData.reduce((acc, node) => {
    acc![node.metaData.type] = node
--- a/web/app/components/workflow-app/hooks/use-is-chat-mode.ts
+++ b/web/app/components/workflow-app/hooks/use-is-chat-mode.ts
@@ -1,7 +1,8 @@
 import { useStore as useAppStore } from '@/app/components/app/store'
+import { AppModeEnum } from '@/types/app'

 export const useIsChatMode = () => {
  const appDetail = useAppStore(s => s.appDetail)

-  return appDetail?.mode === 'advanced-chat'
+  return appDetail?.mode === AppModeEnum.ADVANCED_CHAT
 }
--- a/web/app/components/workflow-app/hooks/use-nodes-sync-draft.ts
+++ b/web/app/components/workflow-app/hooks/use-nodes-sync-draft.ts
@@ -1,14 +1,9 @@
 import { useCallback } from 'react'
 import { produce } from 'immer'
 import { useStoreApi } from 'reactflow'
-import { useParams } from 'next/navigation'
-import {
-  useWorkflowStore,
-} from '@/app/components/workflow/store'
-import { BlockEnum } from '@/app/components/workflow/types'
-import {
-  useNodesReadOnly,
-} from '@/app/components/workflow/hooks/use-workflow'
+import { useWorkflowStore } from '@/app/components/workflow/store'
+import { useNodesReadOnly } from '@/app/components/workflow/hooks/use-workflow'
+import { useSerialAsyncCallback } from '@/app/components/workflow/hooks/use-serial-async-callback'
 import { syncWorkflowDraft } from '@/service/workflow'
 import { useFeaturesStore } from '@/app/components/base/features/hooks'
 import { API_PREFIX } from '@/config'
@@ -20,7 +15,6 @@ export const useNodesSyncDraft = () => {
  const featuresStore = useFeaturesStore()
  const { getNodesReadOnly } = useNodesReadOnly()
  const { handleRefreshWorkflowDraft } = useWorkflowRefreshDraft()
-  const params = useParams()

  const getPostParams = useCallback(() => {
    const {
@@ -28,65 +22,60 @@ export const useNodesSyncDraft = () => {
      edges,
      transform,
    } = store.getState()
-    const nodes = getNodes()
+    const nodes = getNodes().filter(node => !node.data?._isTempNode)
    const [x, y, zoom] = transform
    const {
      appId,
      conversationVariables,
      environmentVariables,
      syncWorkflowDraftHash,
+      isWorkflowDataLoaded,
    } = workflowStore.getState()

-    if (appId && !!nodes.length) {
-      const hasStartNode = nodes.find(node => node.data.type === BlockEnum.Start)
+    if (!appId || !isWorkflowDataLoaded)
+      return null

-      if (!hasStartNode)
-        return
-
-      const features = featuresStore!.getState().features
-      const producedNodes = produce(nodes, (draft) => {
-        draft.forEach((node) => {
-          Object.keys(node.data).forEach((key) => {
-            if (key.startsWith('_'))
-              delete node.data[key]
-          })
+    const features = featuresStore!.getState().features
+    const producedNodes = produce(nodes, (draft) => {
+      draft.forEach((node) => {
+        Object.keys(node.data).forEach((key) => {
+          if (key.startsWith('_'))
+            delete node.data[key]
        })
      })
-      const producedEdges = produce(edges.filter(edge => !edge.data?._isTemp), (draft) => {
-        draft.forEach((edge) => {
-          Object.keys(edge.data).forEach((key) => {
-            if (key.startsWith('_'))
-              delete edge.data[key]
-          })
+    })
+    const producedEdges = produce(edges.filter(edge => !edge.data?._isTemp), (draft) => {
+      draft.forEach((edge) => {
+        Object.keys(edge.data).forEach((key) => {
+          if (key.startsWith('_'))
+            delete edge.data[key]
        })
      })
-      return {
-        url: `/apps/${appId}/workflows/draft`,
-        params: {
-          graph: {
-            nodes: producedNodes,
-            edges: producedEdges,
-            viewport: {
-              x,
-              y,
-              zoom,
-            },
-          },
-          features: {
-            opening_statement: features.opening?.enabled ? (features.opening?.opening_statement || '') : '',
-            suggested_questions: features.opening?.enabled ? (features.opening?.suggested_questions || []) : [],
-            suggested_questions_after_answer: features.suggested,
-            text_to_speech: features.text2speech,
-            speech_to_text: features.speech2text,
-            retriever_resource: features.citation,
-            sensitive_word_avoidance: features.moderation,
-            file_upload: features.file,
-          },
-          environment_variables: environmentVariables,
-          conversation_variables: conversationVariables,
-          hash: syncWorkflowDraftHash,
+    })
+    const viewport = { x, y, zoom }
+
+    return {
+      url: `/apps/${appId}/workflows/draft`,
+      params: {
+        graph: {
+          nodes: producedNodes,
+          edges: producedEdges,
+          viewport,
        },
-      }
+        features: {
+          opening_statement: features.opening?.enabled ? (features.opening?.opening_statement || '') : '',
+          suggested_questions: features.opening?.enabled ? (features.opening?.suggested_questions || []) : [],
+          suggested_questions_after_answer: features.suggested,
+          text_to_speech: features.text2speech,
+          speech_to_text: features.speech2text,
+          retriever_resource: features.citation,
+          sensitive_word_avoidance: features.moderation,
+          file_upload: features.file,
+        },
+        environment_variables: environmentVariables,
+        conversation_variables: conversationVariables,
+        hash: syncWorkflowDraftHash,
+      },
    }
  }, [store, featuresStore, workflowStore])

@@ -95,15 +84,11 @@ export const useNodesSyncDraft = () => {
      return
    const postParams = getPostParams()

-    if (postParams) {
-      navigator.sendBeacon(
-        `${API_PREFIX}/apps/${params.appId}/workflows/draft`,
-        JSON.stringify(postParams.params),
-      )
-    }
-  }, [getPostParams, params.appId, getNodesReadOnly])
+    if (postParams)
+      navigator.sendBeacon(`${API_PREFIX}${postParams.url}`, JSON.stringify(postParams.params))
+  }, [getPostParams, getNodesReadOnly])

-  const doSyncWorkflowDraft = useCallback(async (
+  const performSync = useCallback(async (
    notRefreshWhenSyncError?: boolean,
    callback?: {
      onSuccess?: () => void
@@ -141,6 +126,8 @@ export const useNodesSyncDraft = () => {
    }
  }, [workflowStore, getPostParams, getNodesReadOnly, handleRefreshWorkflowDraft])

+  const doSyncWorkflowDraft = useSerialAsyncCallback(performSync, getNodesReadOnly)
+
  return {
    doSyncWorkflowDraft,
    syncWorkflowDraftWhenPageClose,
--- a/web/app/components/workflow-app/hooks/use-workflow-init.ts
+++ b/web/app/components/workflow-app/hooks/use-workflow-init.ts
@@ -18,7 +18,20 @@ import {
 import type { FetchWorkflowDraftResponse } from '@/types/workflow'
 import { useWorkflowConfig } from '@/service/use-workflow'
 import type { FileUploadConfigResponse } from '@/models/common'
+import type { Edge, Node } from '@/app/components/workflow/types'
+import { BlockEnum } from '@/app/components/workflow/types'
+import { AppModeEnum } from '@/types/app'

+const hasConnectedUserInput = (nodes: Node[] = [], edges: Edge[] = []): boolean => {
+  const startNodeIds = nodes
+    .filter(node => node?.data?.type === BlockEnum.Start)
+    .map(node => node.id)
+
+  if (!startNodeIds.length)
+    return false
+
+  return edges.some(edge => startNodeIds.includes(edge.source))
+}
 export const useWorkflowInit = () => {
  const workflowStore = useWorkflowStore()
  const {
@@ -53,6 +66,7 @@ export const useWorkflowInit = () => {
        }, {} as Record<string, string>),
        environmentVariables: res.environment_variables?.map(env => env.value_type === 'secret' ? { ...env, value: '[__HIDDEN__]' } : env) || [],
        conversationVariables: res.conversation_variables || [],
+        isWorkflowDataLoaded: true,
      })
      setSyncWorkflowDraftHash(res.hash)
      setIsLoading(false)
@@ -61,13 +75,22 @@ export const useWorkflowInit = () => {
      if (error && error.json && !error.bodyUsed && appDetail) {
        error.json().then((err: any) => {
          if (err.code === 'draft_workflow_not_exist') {
-            workflowStore.setState({ notInitialWorkflow: true })
+            const isAdvancedChat = appDetail.mode === AppModeEnum.ADVANCED_CHAT
+            workflowStore.setState({
+              notInitialWorkflow: true,
+              showOnboarding: !isAdvancedChat,
+              shouldAutoOpenStartNodeSelector: !isAdvancedChat,
+              hasShownOnboarding: false,
+            })
+            const nodesData = isAdvancedChat ? nodesTemplate : []
+            const edgesData = isAdvancedChat ? edgesTemplate : []
+
            syncWorkflowDraft({
              url: `/apps/${appDetail.id}/workflows/draft`,
              params: {
                graph: {
-                  nodes: nodesTemplate,
-                  edges: edgesTemplate,
+                  nodes: nodesData,
+                  edges: edgesData,
                },
                features: {
                  retriever_resource: { enabled: true },
@@ -101,9 +124,14 @@ export const useWorkflowInit = () => {
        }, {} as Record<string, any>),
      })
      workflowStore.getState().setPublishedAt(publishedWorkflow?.created_at)
+      const graph = publishedWorkflow?.graph
+      workflowStore.getState().setLastPublishedHasUserInput(
+        hasConnectedUserInput(graph?.nodes, graph?.edges),
+      )
    }
    catch (e) {
      console.error(e)
+      workflowStore.getState().setLastPublishedHasUserInput(false)
    }
  }, [workflowStore, appDetail])

--- a/web/app/components/workflow-app/hooks/use-workflow-refresh-draft.ts
+++ b/web/app/components/workflow-app/hooks/use-workflow-refresh-draft.ts
@@ -16,18 +16,43 @@ export const useWorkflowRefreshDraft = () => {
      setEnvironmentVariables,
      setEnvSecrets,
      setConversationVariables,
+      setIsWorkflowDataLoaded,
+      isWorkflowDataLoaded,
+      debouncedSyncWorkflowDraft,
    } = workflowStore.getState()
+
+    if (debouncedSyncWorkflowDraft && typeof (debouncedSyncWorkflowDraft as any).cancel === 'function')
+      (debouncedSyncWorkflowDraft as any).cancel()
+
+    const wasLoaded = isWorkflowDataLoaded
+    if (wasLoaded)
+      setIsWorkflowDataLoaded(false)
    setIsSyncingWorkflowDraft(true)
-    fetchWorkflowDraft(`/apps/${appId}/workflows/draft`).then((response) => {
-      handleUpdateWorkflowCanvas(response.graph as WorkflowDataUpdater)
-      setSyncWorkflowDraftHash(response.hash)
-      setEnvSecrets((response.environment_variables || []).filter(env => env.value_type === 'secret').reduce((acc, env) => {
-        acc[env.id] = env.value
-        return acc
-      }, {} as Record<string, string>))
-      setEnvironmentVariables(response.environment_variables?.map(env => env.value_type === 'secret' ? { ...env, value: '[__HIDDEN__]' } : env) || [])
-      setConversationVariables(response.conversation_variables || [])
-    }).finally(() => setIsSyncingWorkflowDraft(false))
+    fetchWorkflowDraft(`/apps/${appId}/workflows/draft`)
+      .then((response) => {
+        // Ensure we have a valid workflow structure with viewport
+        const workflowData: WorkflowDataUpdater = {
+          nodes: response.graph?.nodes || [],
+          edges: response.graph?.edges || [],
+          viewport: response.graph?.viewport || { x: 0, y: 0, zoom: 1 },
+        }
+        handleUpdateWorkflowCanvas(workflowData)
+        setSyncWorkflowDraftHash(response.hash)
+        setEnvSecrets((response.environment_variables || []).filter(env => env.value_type === 'secret').reduce((acc, env) => {
+          acc[env.id] = env.value
+          return acc
+        }, {} as Record<string, string>))
+        setEnvironmentVariables(response.environment_variables?.map(env => env.value_type === 'secret' ? { ...env, value: '[__HIDDEN__]' } : env) || [])
+        setConversationVariables(response.conversation_variables || [])
+        setIsWorkflowDataLoaded(true)
+      })
+      .catch(() => {
+        if (wasLoaded)
+          setIsWorkflowDataLoaded(true)
+      })
+      .finally(() => {
+        setIsSyncingWorkflowDraft(false)
+      })
  }, [handleUpdateWorkflowCanvas, workflowStore])

  return {
--- a/web/app/components/workflow-app/hooks/use-workflow-run.ts
+++ b/web/app/components/workflow-app/hooks/use-workflow-run.ts
@@ -1,4 +1,4 @@
-import { useCallback } from 'react'
+import { useCallback, useRef } from 'react'
 import {
  useReactFlow,
  useStoreApi,
@@ -12,7 +12,8 @@ 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 { useStore as useAppStore } from '@/app/components/app/store'
 import type { IOtherOptions } from '@/service/base'
-import { ssePost } from '@/service/base'
+import Toast from '@/app/components/base/toast'
+import { handleStream, ssePost } from '@/service/base'
 import { stopWorkflowRun } from '@/service/workflow'
 import { useFeaturesStore } from '@/app/components/base/features/hooks'
 import { AudioPlayerManager } from '@/app/components/base/audio-btn/audio.player.manager'
@@ -22,6 +23,35 @@ import { useNodesSyncDraft } from './use-nodes-sync-draft'
 import { useInvalidAllLastRun } from '@/service/use-workflow'
 import { useSetWorkflowVarsWithValue } from '../../workflow/hooks/use-fetch-workflow-inspect-vars'
 import { useConfigsMap } from './use-configs-map'
+import { post } from '@/service/base'
+import { ContentType } from '@/service/fetch'
+import { TriggerType } from '@/app/components/workflow/header/test-run-menu'
+import { AppModeEnum } from '@/types/app'
+
+type HandleRunMode = TriggerType
+type HandleRunOptions = {
+  mode?: HandleRunMode
+  scheduleNodeId?: string
+  webhookNodeId?: string
+  pluginNodeId?: string
+  allNodeIds?: string[]
+}
+
+type DebuggableTriggerType = Exclude<TriggerType, TriggerType.UserInput>
+
+const controllerKeyMap: Record<DebuggableTriggerType, string> = {
+  [TriggerType.Webhook]: '__webhookDebugAbortController',
+  [TriggerType.Plugin]: '__pluginDebugAbortController',
+  [TriggerType.All]: '__allTriggersDebugAbortController',
+  [TriggerType.Schedule]: '__scheduleDebugAbortController',
+}
+
+const debugLabelMap: Record<DebuggableTriggerType, string> = {
+  [TriggerType.Webhook]: 'Webhook',
+  [TriggerType.Plugin]: 'Plugin',
+  [TriggerType.All]: 'All',
+  [TriggerType.Schedule]: 'Schedule',
+}

 export const useWorkflowRun = () => {
  const store = useStoreApi()
@@ -39,6 +69,8 @@ export const useWorkflowRun = () => {
    ...configsMap,
  })

+  const abortControllerRef = useRef<AbortController | null>(null)
+
  const {
    handleWorkflowStarted,
    handleWorkflowFinished,
@@ -111,7 +143,10 @@ export const useWorkflowRun = () => {
  const handleRun = useCallback(async (
    params: any,
    callback?: IOtherOptions,
+    options?: HandleRunOptions,
  ) => {
+    const runMode: HandleRunMode = options?.mode ?? TriggerType.UserInput
+    const resolvedParams = params ?? {}
    const {
      getNodes,
      setNodes,
@@ -139,6 +174,7 @@ export const useWorkflowRun = () => {
      onNodeRetry,
      onAgentLog,
      onError,
+      onCompleted,
      ...restCallback
    } = callback || {}
    workflowStore.setState({ historyWorkflowData: undefined })
@@ -150,175 +186,531 @@ export const useWorkflowRun = () => {
      clientHeight,
    } = workflowContainer!

-    const isInWorkflowDebug = appDetail?.mode === 'workflow'
+    const isInWorkflowDebug = appDetail?.mode === AppModeEnum.WORKFLOW

    let url = ''
-    if (appDetail?.mode === 'advanced-chat')
+    if (runMode === TriggerType.Plugin || runMode === TriggerType.Webhook || runMode === TriggerType.Schedule) {
+      if (!appDetail?.id) {
+        console.error('handleRun: missing app id for trigger plugin run')
+        return
+      }
+      url = `/apps/${appDetail.id}/workflows/draft/trigger/run`
+    }
+    else if (runMode === TriggerType.All) {
+      if (!appDetail?.id) {
+        console.error('handleRun: missing app id for trigger run all')
+        return
+      }
+      url = `/apps/${appDetail.id}/workflows/draft/trigger/run-all`
+    }
+    else if (appDetail?.mode === AppModeEnum.ADVANCED_CHAT) {
      url = `/apps/${appDetail.id}/advanced-chat/workflows/draft/run`
-
-    if (isInWorkflowDebug)
+    }
+    else if (isInWorkflowDebug && appDetail?.id) {
      url = `/apps/${appDetail.id}/workflows/draft/run`
+    }
+
+    let requestBody = {}
+
+    if (runMode === TriggerType.Schedule)
+      requestBody = { node_id: options?.scheduleNodeId }
+
+    else if (runMode === TriggerType.Webhook)
+      requestBody = { node_id: options?.webhookNodeId }
+
+    else if (runMode === TriggerType.Plugin)
+      requestBody = { node_id: options?.pluginNodeId }
+
+    else if (runMode === TriggerType.All)
+      requestBody = { node_ids: options?.allNodeIds }
+
+    else
+      requestBody = resolvedParams
+
+    if (!url)
+      return
+
+    if (runMode === TriggerType.Schedule && !options?.scheduleNodeId) {
+      console.error('handleRun: schedule trigger run requires node id')
+      return
+    }
+
+    if (runMode === TriggerType.Webhook && !options?.webhookNodeId) {
+      console.error('handleRun: webhook trigger run requires node id')
+      return
+    }
+
+    if (runMode === TriggerType.Plugin && !options?.pluginNodeId) {
+      console.error('handleRun: plugin trigger run requires node id')
+      return
+    }
+
+    if (runMode === TriggerType.All && !options?.allNodeIds && options?.allNodeIds?.length === 0) {
+      console.error('handleRun: all trigger run requires node ids')
+      return
+    }
+
+    abortControllerRef.current?.abort()
+    abortControllerRef.current = null

    const {
      setWorkflowRunningData,
+      setIsListening,
+      setShowVariableInspectPanel,
+      setListeningTriggerType,
+      setListeningTriggerNodeIds,
+      setListeningTriggerIsAll,
+      setListeningTriggerNodeId,
    } = workflowStore.getState()
-    setWorkflowRunningData({
-      result: {
-        inputs_truncated: false,
-        process_data_truncated: false,
-        outputs_truncated: false,
-        status: WorkflowRunningStatus.Running,
-      },
-      tracing: [],
-      resultText: '',
-    })
+
+    if (
+      runMode === TriggerType.Webhook
+      || runMode === TriggerType.Plugin
+      || runMode === TriggerType.All
+      || runMode === TriggerType.Schedule
+    ) {
+      setIsListening(true)
+      setShowVariableInspectPanel(true)
+      setListeningTriggerIsAll(runMode === TriggerType.All)
+      if (runMode === TriggerType.All)
+        setListeningTriggerNodeIds(options?.allNodeIds ?? [])
+      else if (runMode === TriggerType.Webhook && options?.webhookNodeId)
+        setListeningTriggerNodeIds([options.webhookNodeId])
+      else if (runMode === TriggerType.Schedule && options?.scheduleNodeId)
+        setListeningTriggerNodeIds([options.scheduleNodeId])
+      else if (runMode === TriggerType.Plugin && options?.pluginNodeId)
+        setListeningTriggerNodeIds([options.pluginNodeId])
+      else
+        setListeningTriggerNodeIds([])
+      setWorkflowRunningData({
+        result: {
+          status: WorkflowRunningStatus.Running,
+          inputs_truncated: false,
+          process_data_truncated: false,
+          outputs_truncated: false,
+        },
+        tracing: [],
+        resultText: '',
+      })
+    }
+    else {
+      setIsListening(false)
+      setListeningTriggerType(null)
+      setListeningTriggerNodeId(null)
+      setListeningTriggerNodeIds([])
+      setListeningTriggerIsAll(false)
+      setWorkflowRunningData({
+        result: {
+          status: WorkflowRunningStatus.Running,
+          inputs_truncated: false,
+          process_data_truncated: false,
+          outputs_truncated: false,
+        },
+        tracing: [],
+        resultText: '',
+      })
+    }

    let ttsUrl = ''
    let ttsIsPublic = false
-    if (params.token) {
+    if (resolvedParams.token) {
      ttsUrl = '/text-to-audio'
      ttsIsPublic = true
    }
-    else if (params.appId) {
+    else if (resolvedParams.appId) {
      if (pathname.search('explore/installed') > -1)
-        ttsUrl = `/installed-apps/${params.appId}/text-to-audio`
+        ttsUrl = `/installed-apps/${resolvedParams.appId}/text-to-audio`
      else
-        ttsUrl = `/apps/${params.appId}/text-to-audio`
+        ttsUrl = `/apps/${resolvedParams.appId}/text-to-audio`
    }
    const player = AudioPlayerManager.getInstance().getAudioPlayer(ttsUrl, ttsIsPublic, uuidV4(), 'none', 'none', noop)

+    const clearAbortController = () => {
+      abortControllerRef.current = null
+      delete (window as any).__webhookDebugAbortController
+      delete (window as any).__pluginDebugAbortController
+      delete (window as any).__scheduleDebugAbortController
+      delete (window as any).__allTriggersDebugAbortController
+    }
+
+    const clearListeningState = () => {
+      const state = workflowStore.getState()
+      state.setIsListening(false)
+      state.setListeningTriggerType(null)
+      state.setListeningTriggerNodeId(null)
+      state.setListeningTriggerNodeIds([])
+      state.setListeningTriggerIsAll(false)
+    }
+
+    const wrappedOnError = (params: any) => {
+      clearAbortController()
+      handleWorkflowFailed()
+      clearListeningState()
+
+      if (onError)
+        onError(params)
+    }
+
+    const wrappedOnCompleted: IOtherOptions['onCompleted'] = async (hasError?: boolean, errorMessage?: string) => {
+      clearAbortController()
+      clearListeningState()
+      if (onCompleted)
+        onCompleted(hasError, errorMessage)
+    }
+
+    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)
+          onWorkflowStarted(params)
+      },
+      onWorkflowFinished: (params) => {
+        clearListeningState()
+        handleWorkflowFinished(params)
+
+        if (onWorkflowFinished)
+          onWorkflowFinished(params)
+        if (isInWorkflowDebug) {
+          fetchInspectVars({})
+          invalidAllLastRun()
+        }
+      },
+      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)
+      },
+      onError: wrappedOnError,
+      onCompleted: wrappedOnCompleted,
+    }
+
+    const waitWithAbort = (signal: AbortSignal, delay: number) => new Promise<void>((resolve) => {
+      const timer = window.setTimeout(resolve, delay)
+      signal.addEventListener('abort', () => {
+        clearTimeout(timer)
+        resolve()
+      }, { once: true })
+    })
+
+    const runTriggerDebug = async (debugType: DebuggableTriggerType) => {
+      const controller = new AbortController()
+      abortControllerRef.current = controller
+
+      const controllerKey = controllerKeyMap[debugType]
+
+        ; (window as any)[controllerKey] = controller
+
+      const debugLabel = debugLabelMap[debugType]
+
+      const poll = async (): Promise<void> => {
+        try {
+          const response = await post<Response>(url, {
+            body: requestBody,
+            signal: controller.signal,
+          }, {
+            needAllResponseContent: true,
+          })
+
+          if (controller.signal.aborted)
+            return
+
+          if (!response) {
+            const message = `${debugLabel} debug request failed`
+            Toast.notify({ type: 'error', message })
+            clearAbortController()
+            return
+          }
+
+          const contentType = response.headers.get('content-type') || ''
+
+          if (contentType.includes(ContentType.json)) {
+            let data: any = null
+            try {
+              data = await response.json()
+            }
+            catch (jsonError) {
+              console.error(`handleRun: ${debugLabel.toLowerCase()} debug response parse error`, jsonError)
+              Toast.notify({ type: 'error', message: `${debugLabel} debug request failed` })
+              clearAbortController()
+              clearListeningState()
+              return
+            }
+
+            if (controller.signal.aborted)
+              return
+
+            if (data?.status === 'waiting') {
+              const delay = Number(data.retry_in) || 2000
+              await waitWithAbort(controller.signal, delay)
+              if (controller.signal.aborted)
+                return
+              await poll()
+              return
+            }
+
+            const errorMessage = data?.message || `${debugLabel} debug failed`
+            Toast.notify({ type: 'error', message: errorMessage })
+            clearAbortController()
+            setWorkflowRunningData({
+              result: {
+                status: WorkflowRunningStatus.Failed,
+                error: errorMessage,
+                inputs_truncated: false,
+                process_data_truncated: false,
+                outputs_truncated: false,
+              },
+              tracing: [],
+            })
+            clearListeningState()
+            return
+          }
+
+          clearListeningState()
+          handleStream(
+            response,
+            baseSseOptions.onData ?? noop,
+            baseSseOptions.onCompleted,
+            baseSseOptions.onThought,
+            baseSseOptions.onMessageEnd,
+            baseSseOptions.onMessageReplace,
+            baseSseOptions.onFile,
+            baseSseOptions.onWorkflowStarted,
+            baseSseOptions.onWorkflowFinished,
+            baseSseOptions.onNodeStarted,
+            baseSseOptions.onNodeFinished,
+            baseSseOptions.onIterationStart,
+            baseSseOptions.onIterationNext,
+            baseSseOptions.onIterationFinish,
+            baseSseOptions.onLoopStart,
+            baseSseOptions.onLoopNext,
+            baseSseOptions.onLoopFinish,
+            baseSseOptions.onNodeRetry,
+            baseSseOptions.onParallelBranchStarted,
+            baseSseOptions.onParallelBranchFinished,
+            baseSseOptions.onTextChunk,
+            baseSseOptions.onTTSChunk,
+            baseSseOptions.onTTSEnd,
+            baseSseOptions.onTextReplace,
+            baseSseOptions.onAgentLog,
+            baseSseOptions.onDataSourceNodeProcessing,
+            baseSseOptions.onDataSourceNodeCompleted,
+            baseSseOptions.onDataSourceNodeError,
+          )
+        }
+        catch (error) {
+          if (controller.signal.aborted)
+            return
+          if (error instanceof Response) {
+            const data = await error.clone().json() as Record<string, any>
+            const { error: respError } = data || {}
+            Toast.notify({ type: 'error', message: respError })
+            clearAbortController()
+            setWorkflowRunningData({
+              result: {
+                status: WorkflowRunningStatus.Failed,
+                error: respError,
+                inputs_truncated: false,
+                process_data_truncated: false,
+                outputs_truncated: false,
+              },
+              tracing: [],
+            })
+          }
+          clearListeningState()
+        }
+      }
+
+      await poll()
+    }
+
+    if (runMode === TriggerType.Schedule) {
+      await runTriggerDebug(TriggerType.Schedule)
+      return
+    }
+
+    if (runMode === TriggerType.Webhook) {
+      await runTriggerDebug(TriggerType.Webhook)
+      return
+    }
+
+    if (runMode === TriggerType.Plugin) {
+      await runTriggerDebug(TriggerType.Plugin)
+      return
+    }
+
+    if (runMode === TriggerType.All) {
+      await runTriggerDebug(TriggerType.All)
+      return
+    }
+
    ssePost(
      url,
      {
-        body: params,
+        body: requestBody,
      },
      {
-        onWorkflowStarted: (params) => {
-          handleWorkflowStarted(params)
-
-          if (onWorkflowStarted)
-            onWorkflowStarted(params)
+        ...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)
-        },
-        ...restCallback,
      },
    )
  }, [store, doSyncWorkflowDraft, workflowStore, pathname, handleWorkflowStarted, handleWorkflowFinished, fetchInspectVars, invalidAllLastRun, handleWorkflowFailed, handleWorkflowNodeStarted, handleWorkflowNodeFinished, handleWorkflowNodeIterationStarted, handleWorkflowNodeIterationNext, handleWorkflowNodeIterationFinished, handleWorkflowNodeLoopStarted, handleWorkflowNodeLoopNext, handleWorkflowNodeLoopFinished, handleWorkflowNodeRetry, handleWorkflowAgentLog, handleWorkflowTextChunk, handleWorkflowTextReplace],
  )

  const handleStopRun = useCallback((taskId: string) => {
-    const appId = useAppStore.getState().appDetail?.id
+    const setStoppedState = () => {
+      const {
+        setWorkflowRunningData,
+        setIsListening,
+        setShowVariableInspectPanel,
+        setListeningTriggerType,
+        setListeningTriggerNodeId,
+      } = workflowStore.getState()

-    stopWorkflowRun(`/apps/${appId}/workflow-runs/tasks/${taskId}/stop`)
-  }, [])
+      setWorkflowRunningData({
+        result: {
+          status: WorkflowRunningStatus.Stopped,
+          inputs_truncated: false,
+          process_data_truncated: false,
+          outputs_truncated: false,
+        },
+        tracing: [],
+        resultText: '',
+      })
+      setIsListening(false)
+      setListeningTriggerType(null)
+      setListeningTriggerNodeId(null)
+      setShowVariableInspectPanel(true)
+    }
+
+    if (taskId) {
+      const appId = useAppStore.getState().appDetail?.id
+      stopWorkflowRun(`/apps/${appId}/workflow-runs/tasks/${taskId}/stop`)
+      setStoppedState()
+      return
+    }
+
+    // Try webhook debug controller from global variable first
+    const webhookController = (window as any).__webhookDebugAbortController
+    if (webhookController)
+      webhookController.abort()
+
+    const pluginController = (window as any).__pluginDebugAbortController
+    if (pluginController)
+      pluginController.abort()
+
+    const scheduleController = (window as any).__scheduleDebugAbortController
+    if (scheduleController)
+      scheduleController.abort()
+
+    const allTriggerController = (window as any).__allTriggersDebugAbortController
+    if (allTriggerController)
+      allTriggerController.abort()
+
+    // Also try the ref
+    if (abortControllerRef.current)
+      abortControllerRef.current.abort()
+
+    abortControllerRef.current = null
+    setStoppedState()
+  }, [workflowStore])

  const handleRestoreFromPublishedWorkflow = useCallback((publishedWorkflow: VersionHistory) => {
    const nodes = publishedWorkflow.graph.nodes.map(node => ({ ...node, selected: false, data: { ...node.data, selected: false } }))
--- a/web/app/components/workflow-app/hooks/use-workflow-start-run.tsx
+++ b/web/app/components/workflow-app/hooks/use-workflow-start-run.tsx
@@ -12,6 +12,7 @@ import {
  useNodesSyncDraft,
  useWorkflowRun,
 } from '.'
+import { TriggerType } from '@/app/components/workflow/header/test-run-menu'

 export const useWorkflowStartRun = () => {
  const store = useStoreApi()
@@ -40,9 +41,11 @@ export const useWorkflowStartRun = () => {
      setShowDebugAndPreviewPanel,
      setShowInputsPanel,
      setShowEnvPanel,
+      setShowGlobalVariablePanel,
    } = workflowStore.getState()

    setShowEnvPanel(false)
+    setShowGlobalVariablePanel(false)

    if (showDebugAndPreviewPanel) {
      handleCancelDebugAndPreviewPanel()
@@ -61,6 +64,203 @@ export const useWorkflowStartRun = () => {
    }
  }, [store, workflowStore, featuresStore, handleCancelDebugAndPreviewPanel, handleRun, doSyncWorkflowDraft])

+  const handleWorkflowTriggerScheduleRunInWorkflow = useCallback(async (nodeId?: string) => {
+    if (!nodeId)
+      return
+
+    const {
+      workflowRunningData,
+      showDebugAndPreviewPanel,
+      setShowDebugAndPreviewPanel,
+      setShowInputsPanel,
+      setShowEnvPanel,
+      setShowGlobalVariablePanel,
+      setListeningTriggerType,
+      setListeningTriggerNodeId,
+      setListeningTriggerNodeIds,
+      setListeningTriggerIsAll,
+    } = workflowStore.getState()
+
+    if (workflowRunningData?.result.status === WorkflowRunningStatus.Running)
+      return
+
+    const { getNodes } = store.getState()
+    const nodes = getNodes()
+    const scheduleNode = nodes.find(node => node.id === nodeId && node.data.type === BlockEnum.TriggerSchedule)
+
+    if (!scheduleNode) {
+      console.warn('handleWorkflowTriggerScheduleRunInWorkflow: schedule node not found', nodeId)
+      return
+    }
+
+    setShowEnvPanel(false)
+    setShowGlobalVariablePanel(false)
+
+    if (showDebugAndPreviewPanel) {
+      handleCancelDebugAndPreviewPanel()
+      return
+    }
+
+    setListeningTriggerType(BlockEnum.TriggerSchedule)
+    setListeningTriggerNodeId(nodeId)
+    setListeningTriggerNodeIds([nodeId])
+    setListeningTriggerIsAll(false)
+
+    await doSyncWorkflowDraft()
+    handleRun(
+      {},
+      undefined,
+      {
+        mode: TriggerType.Schedule,
+        scheduleNodeId: nodeId,
+      },
+    )
+    setShowDebugAndPreviewPanel(true)
+    setShowInputsPanel(false)
+  }, [store, workflowStore, handleCancelDebugAndPreviewPanel, handleRun, doSyncWorkflowDraft])
+
+  const handleWorkflowTriggerWebhookRunInWorkflow = useCallback(async ({ nodeId }: { nodeId: string }) => {
+    if (!nodeId)
+      return
+
+    const {
+      workflowRunningData,
+      showDebugAndPreviewPanel,
+      setShowDebugAndPreviewPanel,
+      setShowInputsPanel,
+      setShowEnvPanel,
+      setShowGlobalVariablePanel,
+      setListeningTriggerType,
+      setListeningTriggerNodeId,
+      setListeningTriggerNodeIds,
+      setListeningTriggerIsAll,
+    } = workflowStore.getState()
+
+    if (workflowRunningData?.result.status === WorkflowRunningStatus.Running)
+      return
+
+    const { getNodes } = store.getState()
+    const nodes = getNodes()
+    const webhookNode = nodes.find(node => node.id === nodeId && node.data.type === BlockEnum.TriggerWebhook)
+
+    if (!webhookNode) {
+      console.warn('handleWorkflowTriggerWebhookRunInWorkflow: webhook node not found', nodeId)
+      return
+    }
+
+    setShowEnvPanel(false)
+    setShowGlobalVariablePanel(false)
+
+    if (!showDebugAndPreviewPanel)
+      setShowDebugAndPreviewPanel(true)
+
+    setShowInputsPanel(false)
+    setListeningTriggerType(BlockEnum.TriggerWebhook)
+    setListeningTriggerNodeId(nodeId)
+    setListeningTriggerNodeIds([nodeId])
+    setListeningTriggerIsAll(false)
+
+    await doSyncWorkflowDraft()
+    handleRun(
+      { node_id: nodeId },
+      undefined,
+      {
+        mode: TriggerType.Webhook,
+        webhookNodeId: nodeId,
+      },
+    )
+  }, [store, workflowStore, handleRun, doSyncWorkflowDraft])
+
+  const handleWorkflowTriggerPluginRunInWorkflow = useCallback(async (nodeId?: string) => {
+    if (!nodeId)
+      return
+    const {
+      workflowRunningData,
+      showDebugAndPreviewPanel,
+      setShowDebugAndPreviewPanel,
+      setShowInputsPanel,
+      setShowEnvPanel,
+      setShowGlobalVariablePanel,
+      setListeningTriggerType,
+      setListeningTriggerNodeId,
+      setListeningTriggerNodeIds,
+      setListeningTriggerIsAll,
+    } = workflowStore.getState()
+
+    if (workflowRunningData?.result.status === WorkflowRunningStatus.Running)
+      return
+
+    const { getNodes } = store.getState()
+    const nodes = getNodes()
+    const pluginNode = nodes.find(node => node.id === nodeId && node.data.type === BlockEnum.TriggerPlugin)
+
+    if (!pluginNode) {
+      console.warn('handleWorkflowTriggerPluginRunInWorkflow: plugin node not found', nodeId)
+      return
+    }
+
+    setShowEnvPanel(false)
+    setShowGlobalVariablePanel(false)
+
+    if (!showDebugAndPreviewPanel)
+      setShowDebugAndPreviewPanel(true)
+
+    setShowInputsPanel(false)
+    setListeningTriggerType(BlockEnum.TriggerPlugin)
+    setListeningTriggerNodeId(nodeId)
+    setListeningTriggerNodeIds([nodeId])
+    setListeningTriggerIsAll(false)
+
+    await doSyncWorkflowDraft()
+    handleRun(
+      { node_id: nodeId },
+      undefined,
+      {
+        mode: TriggerType.Plugin,
+        pluginNodeId: nodeId,
+      },
+    )
+  }, [store, workflowStore, handleRun, doSyncWorkflowDraft])
+
+  const handleWorkflowRunAllTriggersInWorkflow = useCallback(async (nodeIds: string[]) => {
+    if (!nodeIds.length)
+      return
+    const {
+      workflowRunningData,
+      showDebugAndPreviewPanel,
+      setShowDebugAndPreviewPanel,
+      setShowInputsPanel,
+      setShowEnvPanel,
+      setShowGlobalVariablePanel,
+      setListeningTriggerIsAll,
+      setListeningTriggerNodeIds,
+      setListeningTriggerNodeId,
+    } = workflowStore.getState()
+
+    if (workflowRunningData?.result.status === WorkflowRunningStatus.Running)
+      return
+
+    setShowEnvPanel(false)
+    setShowGlobalVariablePanel(false)
+    setShowInputsPanel(false)
+    setListeningTriggerIsAll(true)
+    setListeningTriggerNodeIds(nodeIds)
+    setListeningTriggerNodeId(null)
+
+    if (!showDebugAndPreviewPanel)
+      setShowDebugAndPreviewPanel(true)
+
+    await doSyncWorkflowDraft()
+    handleRun(
+      { node_ids: nodeIds },
+      undefined,
+      {
+        mode: TriggerType.All,
+        allNodeIds: nodeIds,
+      },
+    )
+  }, [store, workflowStore, handleRun, doSyncWorkflowDraft])
+
  const handleWorkflowStartRunInChatflow = useCallback(async () => {
    const {
      showDebugAndPreviewPanel,
@@ -68,10 +268,12 @@ export const useWorkflowStartRun = () => {
      setHistoryWorkflowData,
      setShowEnvPanel,
      setShowChatVariablePanel,
+      setShowGlobalVariablePanel,
    } = workflowStore.getState()

    setShowEnvPanel(false)
    setShowChatVariablePanel(false)
+    setShowGlobalVariablePanel(false)

    if (showDebugAndPreviewPanel)
      handleCancelDebugAndPreviewPanel()
@@ -92,5 +294,9 @@ export const useWorkflowStartRun = () => {
    handleStartWorkflowRun,
    handleWorkflowStartRunInWorkflow,
    handleWorkflowStartRunInChatflow,
+    handleWorkflowTriggerScheduleRunInWorkflow,
+    handleWorkflowTriggerWebhookRunInWorkflow,
+    handleWorkflowTriggerPluginRunInWorkflow,
+    handleWorkflowRunAllTriggersInWorkflow,
  }
 }
--- a/web/app/components/workflow-app/index.tsx
+++ b/web/app/components/workflow-app/index.tsx
@@ -10,6 +10,10 @@ import {
 import {
  useWorkflowInit,
 } from './hooks/use-workflow-init'
+import { useAppTriggers } from '@/service/use-tools'
+import { useTriggerStatusStore } from '@/app/components/workflow/store/trigger-status'
+import { useStore as useAppStore } from '@/app/components/app/store'
+import { useWorkflowStore } from '@/app/components/workflow/store'
 import {
  initialEdges,
  initialNodes,
@@ -24,13 +28,13 @@ import {
  WorkflowContextProvider,
 } from '@/app/components/workflow/context'
 import type { InjectWorkflowStoreSliceFn } from '@/app/components/workflow/store'
-import { useWorkflowStore } from '@/app/components/workflow/store'
 import { createWorkflowSlice } from './store/workflow/workflow-slice'
 import WorkflowAppMain from './components/workflow-main'
 import { useSearchParams } from 'next/navigation'

 import { fetchRunDetail } from '@/service/log'
 import { useGetRunAndTraceUrl } from './hooks/use-get-run-and-trace-url'
+import { AppModeEnum } from '@/types/app'

 const WorkflowAppWithAdditionalContext = () => {
  const {
@@ -38,8 +42,46 @@ const WorkflowAppWithAdditionalContext = () => {
    isLoading,
    fileUploadConfigResponse,
  } = useWorkflowInit()
+  const workflowStore = useWorkflowStore()
  const { isLoadingCurrentWorkspace, currentWorkspace } = useAppContext()

+  // Initialize trigger status at application level
+  const { setTriggerStatuses } = useTriggerStatusStore()
+  const appDetail = useAppStore(s => s.appDetail)
+  const appId = appDetail?.id
+  const isWorkflowMode = appDetail?.mode === AppModeEnum.WORKFLOW
+  const { data: triggersResponse } = useAppTriggers(isWorkflowMode ? appId : undefined, {
+    staleTime: 5 * 60 * 1000, // 5 minutes cache
+    refetchOnWindowFocus: false,
+  })
+
+  // Sync trigger statuses to store when data loads
+  useEffect(() => {
+    if (triggersResponse?.data) {
+      // Map API status to EntryNodeStatus: 'enabled' stays 'enabled', all others become 'disabled'
+      const statusMap = triggersResponse.data.reduce((acc, trigger) => {
+        acc[trigger.node_id] = trigger.status === 'enabled' ? 'enabled' : 'disabled'
+        return acc
+      }, {} as Record<string, 'enabled' | 'disabled'>)
+
+      setTriggerStatuses(statusMap)
+    }
+  }, [triggersResponse?.data, setTriggerStatuses])
+
+  // Cleanup on unmount
+  useEffect(() => {
+    return () => {
+      // Reset the loaded flag when component unmounts
+      workflowStore.setState({ isWorkflowDataLoaded: false })
+
+      // Cancel any pending debounced sync operations
+      const { debouncedSyncWorkflowDraft } = workflowStore.getState()
+      // The debounced function from lodash has a cancel method
+      if (debouncedSyncWorkflowDraft && 'cancel' in debouncedSyncWorkflowDraft)
+        (debouncedSyncWorkflowDraft as any).cancel()
+    }
+  }, [workflowStore])
+
  const nodesData = useMemo(() => {
    if (data)
      return initialNodes(data.graph.nodes, data.graph.edges)
@@ -54,7 +96,6 @@ const WorkflowAppWithAdditionalContext = () => {
  }, [data])

  const searchParams = useSearchParams()
-  const workflowStore = useWorkflowStore()
  const { getWorkflowRunAndTraceUrl } = useGetRunAndTraceUrl()
  const replayRunId = searchParams.get('replayRunId')

--- a/web/app/components/workflow-app/store/workflow/workflow-slice.ts
+++ b/web/app/components/workflow-app/store/workflow/workflow-slice.ts
@@ -5,8 +5,16 @@ export type WorkflowSliceShape = {
  appName: string
  notInitialWorkflow: boolean
  setNotInitialWorkflow: (notInitialWorkflow: boolean) => void
+  shouldAutoOpenStartNodeSelector: boolean
+  setShouldAutoOpenStartNodeSelector: (shouldAutoOpen: boolean) => void
  nodesDefaultConfigs: Record<string, any>
  setNodesDefaultConfigs: (nodesDefaultConfigs: Record<string, any>) => void
+  showOnboarding: boolean
+  setShowOnboarding: (showOnboarding: boolean) => void
+  hasSelectedStartNode: boolean
+  setHasSelectedStartNode: (hasSelectedStartNode: boolean) => void
+  hasShownOnboarding: boolean
+  setHasShownOnboarding: (hasShownOnboarding: boolean) => void
 }

 export type CreateWorkflowSlice = StateCreator<WorkflowSliceShape>
@@ -15,6 +23,14 @@ export const createWorkflowSlice: StateCreator<WorkflowSliceShape> = set => ({
  appName: '',
  notInitialWorkflow: false,
  setNotInitialWorkflow: notInitialWorkflow => set(() => ({ notInitialWorkflow })),
+  shouldAutoOpenStartNodeSelector: false,
+  setShouldAutoOpenStartNodeSelector: shouldAutoOpenStartNodeSelector => set(() => ({ shouldAutoOpenStartNodeSelector })),
  nodesDefaultConfigs: {},
  setNodesDefaultConfigs: nodesDefaultConfigs => set(() => ({ nodesDefaultConfigs })),
+  showOnboarding: false,
+  setShowOnboarding: showOnboarding => set(() => ({ showOnboarding })),
+  hasSelectedStartNode: false,
+  setHasSelectedStartNode: hasSelectedStartNode => set(() => ({ hasSelectedStartNode })),
+  hasShownOnboarding: false,
+  setHasShownOnboarding: hasShownOnboarding => set(() => ({ hasShownOnboarding })),
 })