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>

web/app/components/workflow/block-selector/main.tsx

@@ -9,16 +9,18 @@ import {
   useState,
 } from 'react'
 import { useTranslation } from 'react-i18next'
+import { useNodes } from 'reactflow'
 import type {
   OffsetOptions,
   Placement,
 } from '@floating-ui/react'
 import type {
-  BlockEnum,
+  CommonNodeType,
   NodeDefault,
   OnSelectBlock,
   ToolWithProvider,
 } from '../types'
+import { BlockEnum, isTriggerNode } from '../types'
 import Tabs from './tabs'
 import { TabsEnum } from './types'
 import { useTabs } from './hooks'
@@ -51,6 +53,12 @@ export type NodeSelectorProps = {
   dataSources?: ToolWithProvider[]
   noBlocks?: boolean
   noTools?: boolean
+  showStartTab?: boolean
+  defaultActiveTab?: TabsEnum
+  forceShowStartContent?: boolean
+  ignoreNodeIds?: string[]
+  forceEnableStartTab?: boolean // Force enabling Start tab regardless of existing trigger/user input nodes (e.g., when changing Start node type).
+  allowUserInputSelection?: boolean // Override user-input availability; default logic blocks it when triggers exist.
 }
 const NodeSelector: FC<NodeSelectorProps> = ({
   open: openFromProps,
@@ -70,11 +78,47 @@ const NodeSelector: FC<NodeSelectorProps> = ({
   dataSources = [],
   noBlocks = false,
   noTools = false,
+  showStartTab = false,
+  defaultActiveTab,
+  forceShowStartContent = false,
+  ignoreNodeIds = [],
+  forceEnableStartTab = false,
+  allowUserInputSelection,
 }) => {
   const { t } = useTranslation()
+  const nodes = useNodes()
   const [searchText, setSearchText] = useState('')
   const [tags, setTags] = useState<string[]>([])
   const [localOpen, setLocalOpen] = useState(false)
+  // Exclude nodes explicitly ignored (such as the node currently being edited) when checking canvas state.
+  const filteredNodes = useMemo(() => {
+    if (!ignoreNodeIds.length)
+      return nodes
+    const ignoreSet = new Set(ignoreNodeIds)
+    return nodes.filter(node => !ignoreSet.has(node.id))
+  }, [nodes, ignoreNodeIds])
+
+  const { hasTriggerNode, hasUserInputNode } = useMemo(() => {
+    const result = {
+      hasTriggerNode: false,
+      hasUserInputNode: false,
+    }
+    for (const node of filteredNodes) {
+      const nodeType = (node.data as CommonNodeType | undefined)?.type
+      if (!nodeType)
+        continue
+      if (nodeType === BlockEnum.Start)
+        result.hasUserInputNode = true
+      if (isTriggerNode(nodeType))
+        result.hasTriggerNode = true
+      if (result.hasTriggerNode && result.hasUserInputNode)
+        break
+    }
+    return result
+  }, [filteredNodes])
+  // Default rule: user input option is only available when no Start node nor Trigger node exists on canvas.
+  const defaultAllowUserInputSelection = !hasUserInputNode && !hasTriggerNode
+  const canSelectUserInput = allowUserInputSelection ?? defaultAllowUserInputSelection
   const open = openFromProps === undefined ? localOpen : openFromProps
   const handleOpenChange = useCallback((newOpen: boolean) => {
     setLocalOpen(newOpen)
@@ -91,22 +135,34 @@ const NodeSelector: FC<NodeSelectorProps> = ({
     e.stopPropagation()
     handleOpenChange(!open)
   }, [handleOpenChange, open, disabled])
-  const handleSelect = useCallback<OnSelectBlock>((type, toolDefaultValue) => {
+
+  const handleSelect = useCallback<OnSelectBlock>((type, pluginDefaultValue) => {
     handleOpenChange(false)
-    onSelect(type, toolDefaultValue)
+    onSelect(type, pluginDefaultValue)
   }, [handleOpenChange, onSelect])
 
   const {
     activeTab,
     setActiveTab,
     tabs,
-  } = useTabs(noBlocks, !dataSources.length, noTools)
+  } = useTabs({
+    noBlocks,
+    noSources: !dataSources.length,
+    noTools,
+    noStart: !showStartTab,
+    defaultActiveTab,
+    hasUserInputNode,
+    forceEnableStartTab,
+  })
 
   const handleActiveTabChange = useCallback((newActiveTab: TabsEnum) => {
     setActiveTab(newActiveTab)
   }, [setActiveTab])
 
   const searchPlaceholder = useMemo(() => {
+    if (activeTab === TabsEnum.Start)
+      return t('workflow.tabs.searchTrigger')
+
     if (activeTab === TabsEnum.Blocks)
       return t('workflow.tabs.searchBlock')
 
@@ -136,7 +192,7 @@ const NodeSelector: FC<NodeSelectorProps> = ({
             : (
               <div
                 className={`
-                  z-10 flex h-4 
+                  z-10 flex h-4
                   w-4 cursor-pointer items-center justify-center rounded-full bg-components-button-primary-bg text-text-primary-on-surface hover:bg-components-button-primary-bg-hover
                   ${triggerClassName?.(open)}
                 `}
@@ -153,9 +209,21 @@ const NodeSelector: FC<NodeSelectorProps> = ({
             tabs={tabs}
             activeTab={activeTab}
             blocks={blocks}
+            allowStartNodeSelection={canSelectUserInput}
             onActiveTabChange={handleActiveTabChange}
             filterElem={
               <div className='relative m-2' onClick={e => e.stopPropagation()}>
+                {activeTab === TabsEnum.Start && (
+                  <SearchBox
+                    autoFocus
+                    search={searchText}
+                    onSearchChange={setSearchText}
+                    tags={tags}
+                    onTagsChange={setTags}
+                    placeholder={searchPlaceholder}
+                    inputClassName='grow'
+                  />
+                )}
                 {activeTab === TabsEnum.Blocks && (
                   <Input
                     showLeftIcon
@@ -180,6 +248,7 @@ const NodeSelector: FC<NodeSelectorProps> = ({
                 )}
                 {activeTab === TabsEnum.Tools && (
                   <SearchBox
+                    autoFocus
                     search={searchText}
                     onSearchChange={setSearchText}
                     tags={tags}
@@ -198,6 +267,7 @@ const NodeSelector: FC<NodeSelectorProps> = ({
             dataSources={dataSources}
             noTools={noTools}
             onTagsChange={setTags}
+            forceShowStartContent={forceShowStartContent}
           />
         </div>
       </PortalToFollowElemContent>