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/nodes/tool/components/mixed-variable-text-input/index.tsx
+++ b/web/app/components/workflow/nodes/tool/components/mixed-variable-text-input/index.tsx
@@ -20,6 +20,7 @@ type MixedVariableTextInputProps = {
  onChange?: (text: string) => void
  showManageInputField?: boolean
  onManageInputField?: () => void
+  disableVariableInsertion?: boolean
 }
 const MixedVariableTextInput = ({
  readOnly = false,
@@ -29,6 +30,7 @@ const MixedVariableTextInput = ({
  onChange,
  showManageInputField,
  onManageInputField,
+  disableVariableInsertion = false,
 }: MixedVariableTextInputProps) => {
  const { t } = useTranslation()
  const controlPromptEditorRerenderKey = useStore(s => s.controlPromptEditorRerenderKey)
@@ -37,7 +39,7 @@ const MixedVariableTextInput = ({
    <PromptEditor
      key={controlPromptEditorRerenderKey}
      wrapperClassName={cn(
-        'w-full rounded-lg border border-transparent bg-components-input-bg-normal px-2 py-1',
+        'min-h-8 w-full rounded-lg border border-transparent bg-components-input-bg-normal px-2 py-1',
        'hover:border-components-input-border-hover hover:bg-components-input-bg-hover',
        'focus-within:border-components-input-border-active focus-within:bg-components-input-bg-active focus-within:shadow-xs',
      )}
@@ -45,7 +47,7 @@ const MixedVariableTextInput = ({
      editable={!readOnly}
      value={value}
      workflowVariableBlock={{
-        show: true,
+        show: !disableVariableInsertion,
        variables: nodesOutputVars || [],
        workflowNodesMap: availableNodes.reduce((acc, node) => {
          acc[node.id] = {
@@ -63,7 +65,7 @@ const MixedVariableTextInput = ({
        showManageInputField,
        onManageInputField,
      }}
-      placeholder={<Placeholder />}
+      placeholder={<Placeholder disableVariableInsertion={disableVariableInsertion} />}
      onChange={onChange}
    />
  )
--- a/web/app/components/workflow/nodes/tool/components/mixed-variable-text-input/placeholder.tsx
+++ b/web/app/components/workflow/nodes/tool/components/mixed-variable-text-input/placeholder.tsx
@@ -6,7 +6,11 @@ import { $insertNodes } from 'lexical'
 import { CustomTextNode } from '@/app/components/base/prompt-editor/plugins/custom-text/node'
 import Badge from '@/app/components/base/badge'

-const Placeholder = () => {
+type PlaceholderProps = {
+  disableVariableInsertion?: boolean
+}
+
+const Placeholder = ({ disableVariableInsertion = false }: PlaceholderProps) => {
  const { t } = useTranslation()
  const [editor] = useLexicalComposerContext()

@@ -28,17 +32,21 @@ const Placeholder = () => {
    >
      <div className='flex grow items-center'>
        {t('workflow.nodes.tool.insertPlaceholder1')}
-        <div className='system-kbd mx-0.5 flex h-4 w-4 items-center justify-center rounded bg-components-kbd-bg-gray text-text-placeholder'>/</div>
-        <div
-          className='system-sm-regular cursor-pointer text-components-input-text-placeholder underline decoration-dotted decoration-auto underline-offset-auto hover:text-text-tertiary'
-          onMouseDown={((e) => {
-            e.preventDefault()
-            e.stopPropagation()
-            handleInsert('/')
-          })}
-        >
-          {t('workflow.nodes.tool.insertPlaceholder2')}
-        </div>
+        {(!disableVariableInsertion) && (
+          <>
+            <div className='system-kbd mx-0.5 flex h-4 w-4 items-center justify-center rounded bg-components-kbd-bg-gray text-text-placeholder'>/</div>
+            <div
+              className='system-sm-regular cursor-pointer text-components-input-text-placeholder underline decoration-dotted decoration-auto underline-offset-auto hover:text-text-tertiary'
+              onMouseDown={((e) => {
+                e.preventDefault()
+                e.stopPropagation()
+                handleInsert('/')
+              })}
+            >
+              {t('workflow.nodes.tool.insertPlaceholder2')}
+            </div>
+          </>
+        )}
      </div>
      <Badge
        className='shrink-0'
--- a/web/app/components/workflow/nodes/tool/components/tool-form/index.tsx
+++ b/web/app/components/workflow/nodes/tool/components/tool-form/index.tsx
@@ -18,6 +18,7 @@ type Props = {
  currentProvider?: ToolWithProvider
  showManageInputField?: boolean
  onManageInputField?: () => void
+  extraParams?: Record<string, any>
 }

 const ToolForm: FC<Props> = ({
@@ -31,6 +32,7 @@ const ToolForm: FC<Props> = ({
  currentProvider,
  showManageInputField,
  onManageInputField,
+  extraParams,
 }) => {
  return (
    <div className='space-y-1'>
@@ -48,6 +50,8 @@ const ToolForm: FC<Props> = ({
            currentProvider={currentProvider}
            showManageInputField={showManageInputField}
            onManageInputField={onManageInputField}
+            extraParams={extraParams}
+            providerType='tool'
          />
        ))
      }
--- a/web/app/components/workflow/nodes/tool/components/tool-form/item.tsx
+++ b/web/app/components/workflow/nodes/tool/components/tool-form/item.tsx
@@ -26,6 +26,8 @@ type Props = {
  currentProvider?: ToolWithProvider
  showManageInputField?: boolean
  onManageInputField?: () => void
+  extraParams?: Record<string, any>
+  providerType?: 'tool' | 'trigger'
 }

 const ToolFormItem: FC<Props> = ({
@@ -39,6 +41,8 @@ const ToolFormItem: FC<Props> = ({
  currentProvider,
  showManageInputField,
  onManageInputField,
+  extraParams,
+  providerType = 'tool',
 }) => {
  const language = useLanguage()
  const { name, label, type, required, tooltip, input_schema } = schema
@@ -95,6 +99,8 @@ const ToolFormItem: FC<Props> = ({
        currentProvider={currentProvider}
        showManageInputField={showManageInputField}
        onManageInputField={onManageInputField}
+        extraParams={extraParams}
+        providerType={providerType}
      />

      {isShowSchema && (
--- a/web/app/components/workflow/nodes/tool/node.tsx
+++ b/web/app/components/workflow/nodes/tool/node.tsx
@@ -1,46 +1,90 @@
 import type { FC } from 'react'
-import React from 'react'
-import type { ToolNodeType } from './types'
+import React, { useEffect } from 'react'
 import type { NodeProps } from '@/app/components/workflow/types'
 import { FormTypeEnum } from '@/app/components/header/account-setting/model-provider-page/declarations'
+import { InstallPluginButton } from '@/app/components/workflow/nodes/_base/components/install-plugin-button'
+import { useNodePluginInstallation } from '@/app/components/workflow/hooks/use-node-plugin-installation'
+import { useNodeDataUpdate } from '@/app/components/workflow/hooks/use-node-data-update'
+import type { ToolNodeType } from './types'

 const Node: FC<NodeProps<ToolNodeType>> = ({
+  id,
  data,
 }) => {
  const { tool_configurations, paramSchemas } = data
  const toolConfigs = Object.keys(tool_configurations || {})
+  const {
+    isChecking,
+    isMissing,
+    uniqueIdentifier,
+    canInstall,
+    onInstallSuccess,
+    shouldDim,
+  } = useNodePluginInstallation(data)
+  const showInstallButton = !isChecking && isMissing && canInstall && uniqueIdentifier
+  const { handleNodeDataUpdate } = useNodeDataUpdate()
+  const shouldLock = !isChecking && isMissing && canInstall && Boolean(uniqueIdentifier)

-  if (!toolConfigs.length)
+  useEffect(() => {
+    if (data._pluginInstallLocked === shouldLock && data._dimmed === shouldDim)
+      return
+    handleNodeDataUpdate({
+      id,
+      data: {
+        _pluginInstallLocked: shouldLock,
+        _dimmed: shouldDim,
+      },
+    })
+  }, [data._pluginInstallLocked, data._dimmed, handleNodeDataUpdate, id, shouldDim, shouldLock])
+
+  const hasConfigs = toolConfigs.length > 0
+
+  if (!showInstallButton && !hasConfigs)
    return null

  return (
-    <div className='mb-1 px-3 py-1'>
-      <div className='space-y-0.5'>
-        {toolConfigs.map((key, index) => (
-          <div key={index} className='flex h-6 items-center justify-between space-x-1 rounded-md  bg-workflow-block-parma-bg px-1 text-xs font-normal text-text-secondary'>
-            <div title={key} className='max-w-[100px] shrink-0 truncate text-xs font-medium uppercase text-text-tertiary'>
-              {key}
+    <div className='relative mb-1 px-3 py-1'>
+      {showInstallButton && (
+        <div className='pointer-events-auto absolute right-3 top-[-32px] z-40'>
+          <InstallPluginButton
+            size='small'
+            className='!font-medium !text-text-accent'
+            extraIdentifiers={[
+              data.plugin_id,
+              data.provider_id,
+              data.provider_name,
+            ].filter(Boolean) as string[]}
+            uniqueIdentifier={uniqueIdentifier!}
+            onSuccess={onInstallSuccess}
+          />
+        </div>
+      )}
+      {hasConfigs && (
+        <div className='space-y-0.5' aria-disabled={shouldDim}>
+          {toolConfigs.map((key, index) => (
+            <div key={index} className='flex h-6 items-center justify-between space-x-1 rounded-md  bg-workflow-block-parma-bg px-1 text-xs font-normal text-text-secondary'>
+              <div title={key} className='max-w-[100px] shrink-0 truncate text-xs font-medium uppercase text-text-tertiary'>
+                {key}
+              </div>
+              {typeof tool_configurations[key].value === 'string' && (
+                <div title={tool_configurations[key].value} className='w-0 shrink-0 grow truncate text-right text-xs font-normal text-text-secondary'>
+                  {paramSchemas?.find(i => i.name === key)?.type === FormTypeEnum.secretInput ? '********' : tool_configurations[key].value}
+                </div>
+              )}
+              {typeof tool_configurations[key].value === 'number' && (
+                <div title={Number.isNaN(tool_configurations[key].value) ? '' : tool_configurations[key].value} className='w-0 shrink-0 grow truncate text-right text-xs font-normal text-text-secondary'>
+                  {Number.isNaN(tool_configurations[key].value) ? '' : tool_configurations[key].value}
+                </div>
+              )}
+              {typeof tool_configurations[key] !== 'string' && tool_configurations[key]?.type === FormTypeEnum.modelSelector && (
+                <div title={tool_configurations[key].model} className='w-0 shrink-0 grow truncate text-right text-xs font-normal text-text-secondary'>
+                  {tool_configurations[key].model}
+                </div>
+              )}
            </div>
-            {typeof tool_configurations[key].value === 'string' && (
-              <div title={tool_configurations[key].value} className='w-0 shrink-0 grow truncate text-right text-xs font-normal text-text-secondary'>
-                {paramSchemas?.find(i => i.name === key)?.type === FormTypeEnum.secretInput ? '********' : tool_configurations[key].value}
-              </div>
-            )}
-            {typeof tool_configurations[key].value === 'number' && (
-              <div title={Number.isNaN(tool_configurations[key].value) ? '' : tool_configurations[key].value} className='w-0 shrink-0 grow truncate text-right text-xs font-normal text-text-secondary'>
-                {Number.isNaN(tool_configurations[key].value) ? '' : tool_configurations[key].value}
-              </div>
-            )}
-            {typeof tool_configurations[key] !== 'string' && tool_configurations[key]?.type === FormTypeEnum.modelSelector && (
-              <div title={tool_configurations[key].model} className='w-0 shrink-0 grow truncate text-right text-xs font-normal text-text-secondary'>
-                {tool_configurations[key].model}
-              </div>
-            )}
-          </div>
-
-        ))}
-
-      </div>
+          ))}
+        </div>
+      )}
    </div>
  )
 }
--- a/web/app/components/workflow/nodes/tool/types.ts
+++ b/web/app/components/workflow/nodes/tool/types.ts
@@ -1,16 +1,10 @@
-import type { CollectionType } from '@/app/components/tools/types'
-import type { CommonNodeType, ValueSelector } from '@/app/components/workflow/types'
+import type { Collection, CollectionType } from '@/app/components/tools/types'
+import type { CommonNodeType } from '@/app/components/workflow/types'
+import type { ResourceVarInputs } from '../_base/types'

-export enum VarType {
-  variable = 'variable',
-  constant = 'constant',
-  mixed = 'mixed',
-}
-
-export type ToolVarInputs = Record<string, {
-  type: VarType
-  value?: string | ValueSelector | any
-}>
+// Use base types directly
+export { VarKindType as VarType } from '../_base/types'
+export type ToolVarInputs = ResourceVarInputs

 export type ToolNodeType = CommonNodeType & {
  provider_id: string
@@ -26,4 +20,7 @@ export type ToolNodeType = CommonNodeType & {
  tool_description?: string
  is_team_authorization?: boolean
  params?: Record<string, any>
+  plugin_id?: string
+  provider_icon?: Collection['icon']
+  plugin_unique_identifier?: string
 }