Merge branch 'feat/trigger' of https://github.com/langgenius/dify into feat/trigger

2025-10-30 15:35:39 +08:00 · 2025-10-30 15:35:39 +08:00 · bed2ce69bb
parent 4d37d61851 1d03e0e9fc
commit bed2ce69bb
7 changed files with 111 additions and 125 deletions
--- a/web/app/components/plugins/readme-panel/index.tsx
+++ b/web/app/components/plugins/readme-panel/index.tsx
@ -2,7 +2,6 @@
 import ActionButton from '@/app/components/base/action-button'
 import Loading from '@/app/components/base/loading'
 import { Markdown } from '@/app/components/base/markdown'
-import Modal from '@/app/components/base/modal'
 import { useLanguage } from '@/app/components/header/account-setting/model-provider-page/hooks'
 import { usePluginReadme } from '@/service/use-plugins'
 import cn from '@/utils/classnames'
@ -85,29 +84,36 @@ const ReadmePanel: FC = () => {
    </div>
  )

-  return showType === ReadmeShowType.drawer ? createPortal(
-    <div className='pointer-events-none fixed inset-0 z-[9997] flex justify-start'>
-      <div
-        className={cn(
-          'pointer-events-auto mb-2 ml-2 mr-2 mt-16 w-[600px] max-w-[600px] justify-start rounded-2xl border-[0.5px] border-components-panel-border bg-components-panel-bg p-0 shadow-xl',
-        )}
-      >
-        {children}
+  const portalContent = showType === ReadmeShowType.drawer
+    ? (
+      <div className='pointer-events-none fixed inset-0 z-[9997] flex justify-start'>
+        <div
+          className={cn(
+            'pointer-events-auto mb-2 ml-2 mr-2 mt-16 w-[600px] max-w-[600px] justify-start rounded-2xl border-[0.5px] border-components-panel-border bg-components-panel-bg p-0 shadow-xl',
+          )}
+        >
+          {children}
+        </div>
      </div>
-    </div>,
+    )
+    : (
+      <div className='pointer-events-none fixed inset-0 z-[9997] flex items-center justify-center p-2'>
+        <div
+          className={cn(
+            'pointer-events-auto relative h-[calc(100vh-16px)] w-full max-w-[800px] rounded-2xl bg-components-panel-bg p-0 shadow-xl',
+          )}
+          onClick={(event) => {
+            event.stopPropagation()
+          }}
+        >
+          {children}
+        </div>
+      </div>
+    )
+
+  return createPortal(
+    portalContent,
    document.body,
-  ) : (
-    <Modal
-      isShow={!!detail}
-      onClose={onClose}
-      overlayOpacity={true}
-      className='h-[calc(100vh-16px)] max-w-[800px] p-0'
-      wrapperClassName='!z-[102]'
-      containerClassName='p-2'
-      clickOutsideNotClose={true}
-    >
-      {children}
-    </Modal>
  )
 }

--- a/web/app/components/workflow/nodes/_base/components/workflow-panel/index.tsx
+++ b/web/app/components/workflow/nodes/_base/components/workflow-panel/index.tsx
@ -1,5 +1,17 @@
 import { useStore as useAppStore } from '@/app/components/app/store'
+import { Stop } from '@/app/components/base/icons/src/vender/line/mediaAndDevices'
 import Tooltip from '@/app/components/base/tooltip'
+import { useLanguage } from '@/app/components/header/account-setting/model-provider-page/hooks'
+import {
+  AuthCategory,
+  AuthorizedInDataSourceNode,
+  AuthorizedInNode,
+  PluginAuth,
+  PluginAuthInDataSourceNode,
+} from '@/app/components/plugins/plugin-auth'
+import { usePluginStore } from '@/app/components/plugins/plugin-detail-panel/store'
+import type { SimpleSubscription } from '@/app/components/plugins/plugin-detail-panel/subscription-list'
+import { ReadmeEntrance } from '@/app/components/plugins/readme-panel/entrance'
 import BlockIcon from '@/app/components/workflow/block-icon'
 import {
  WorkflowHistoryEvent,
@ -11,7 +23,14 @@ import {
  useToolIcon,
  useWorkflowHistory,
 } from '@/app/components/workflow/hooks'
+import { useHooksStore } from '@/app/components/workflow/hooks-store'
+import useInspectVarsCrud from '@/app/components/workflow/hooks/use-inspect-vars-crud'
 import Split from '@/app/components/workflow/nodes/_base/components/split'
+import DataSourceBeforeRunForm from '@/app/components/workflow/nodes/data-source/before-run-form'
+import type { CustomRunFormProps } from '@/app/components/workflow/nodes/data-source/types'
+import { DataSourceClassification } from '@/app/components/workflow/nodes/data-source/types'
+import { useLogs } from '@/app/components/workflow/run/hooks'
+import SpecialResultPanel from '@/app/components/workflow/run/special-result-panel'
 import { useStore } from '@/app/components/workflow/store'
 import { BlockEnum, type Node, NodeRunningStatus } from '@/app/components/workflow/types'
 import {
@ -20,16 +39,18 @@ import {
  hasRetryNode,
  isSupportCustomRunForm,
 } from '@/app/components/workflow/utils'
+import { useModalContext } from '@/context/modal-context'
+import { useAllBuiltInTools } from '@/service/use-tools'
 import { useAllTriggerPlugins } from '@/service/use-triggers'
+import { FlowType } from '@/types/common'
+import { canFindTool } from '@/utils'
 import cn from '@/utils/classnames'
 import {
  RiCloseLine,
  RiPlayLargeLine,
 } from '@remixicon/react'
-import type {
-  FC,
-  ReactNode,
-} from 'react'
+import { debounce } from 'lodash-es'
+import type { FC, ReactNode } from 'react'
 import React, {
  cloneElement,
  memo,
@ -42,44 +63,18 @@ import React, {
 import { useTranslation } from 'react-i18next'
 import { useShallow } from 'zustand/react/shallow'
 import { useResizePanel } from '../../hooks/use-resize-panel'
+import BeforeRunForm from '../before-run-form'
+import PanelWrap from '../before-run-form/panel-wrap'
 import ErrorHandleOnPanel from '../error-handle/error-handle-on-panel'
 import HelpLink from '../help-link'
 import NextStep from '../next-step'
 import PanelOperator from '../panel-operator'
 import RetryOnPanel from '../retry/retry-on-panel'
-import {
-  DescriptionInput,
-  TitleInput,
-} from '../title-description-input'
-import Tab, { TabType } from './tab'
-// import AuthMethodSelector from '@/app/components/workflow/nodes/trigger-plugin/components/auth-method-selector'
-import { Stop } from '@/app/components/base/icons/src/vender/line/mediaAndDevices'
-import {
-  AuthCategory,
-  AuthorizedInDataSourceNode,
-  AuthorizedInNode,
-  PluginAuth,
-  PluginAuthInDataSourceNode,
-} from '@/app/components/plugins/plugin-auth'
-import type { SimpleSubscription } from '@/app/components/plugins/plugin-detail-panel/subscription-list'
-import { useHooksStore } from '@/app/components/workflow/hooks-store'
-import useInspectVarsCrud from '@/app/components/workflow/hooks/use-inspect-vars-crud'
-import DataSourceBeforeRunForm from '@/app/components/workflow/nodes/data-source/before-run-form'
-import type { CustomRunFormProps } from '@/app/components/workflow/nodes/data-source/types'
-import { DataSourceClassification } from '@/app/components/workflow/nodes/data-source/types'
-import { useLogs } from '@/app/components/workflow/run/hooks'
-import SpecialResultPanel from '@/app/components/workflow/run/special-result-panel'
-import { useModalContext } from '@/context/modal-context'
-import { FlowType } from '@/types/common'
-import { canFindTool } from '@/utils'
-import { debounce } from 'lodash-es'
-import BeforeRunForm from '../before-run-form'
-import PanelWrap from '../before-run-form/panel-wrap'
+import { DescriptionInput, TitleInput } from '../title-description-input'
 import LastRun from './last-run'
 import useLastRun from './last-run/use-last-run'
+import Tab, { TabType } from './tab'
 import { TriggerSubscription } from './trigger-subscription'
-import { ReadmeEntrance } from '@/app/components/plugins/readme-panel/entrance'
-import { useAllBuiltInTools } from '@/service/use-tools'

 const getCustomRunForm = (params: CustomRunFormProps): React.JSX.Element => {
  const nodeType = params.payload.type
@ -103,6 +98,7 @@ const BasePanel: FC<BasePanelProps> = ({
  children,
 }) => {
  const { t } = useTranslation()
+  const language = useLanguage()
  const { showMessageLogModal } = useAppStore(useShallow(state => ({
    showMessageLogModal: state.showMessageLogModal,
  })))
@ -224,6 +220,7 @@ const BasePanel: FC<BasePanelProps> = ({
  useEffect(() => {
    hasClickRunning.current = false
  }, [id])
+
  const {
    nodesMap,
  } = useNodesMetaData()
@ -278,12 +275,7 @@ const BasePanel: FC<BasePanelProps> = ({
  }, [pendingSingleRun, id, handleSingleRun, handleStop, setPendingSingleRun])

  const logParams = useLogs()
-  const passedLogParams = (() => {
-    if ([BlockEnum.Tool, BlockEnum.Agent, BlockEnum.Iteration, BlockEnum.Loop].includes(data.type))
-      return logParams
-
-    return {}
-  })()
+  const passedLogParams = useMemo(() => [BlockEnum.Tool, BlockEnum.Agent, BlockEnum.Iteration, BlockEnum.Loop].includes(data.type) ? logParams : {}, [data.type, logParams])

  const storeBuildInTools = useStore(s => s.buildInTools)
  const { data: buildInTools } = useAllBuiltInTools()
@ -295,16 +287,32 @@ const BasePanel: FC<BasePanelProps> = ({
    return data.type === BlockEnum.Tool && currToolCollection?.allow_delete
  }, [data.type, currToolCollection?.allow_delete])

-  const { data: triggerProviders = [] } = useAllTriggerPlugins()
-  const currentTriggerProvider = useMemo(() => {
-    if (!data.provider_id || !data.provider_name)
+  // only fetch trigger plugins when the node is a trigger plugin
+  const { data: triggerPlugins = [] } = useAllTriggerPlugins(data.type === BlockEnum.TriggerPlugin)
+  const currentTriggerPlugin = useMemo(() => {
+    if (data.type !== BlockEnum.TriggerPlugin || !data.plugin_id || !triggerPlugins?.length)
      return undefined
-    return triggerProviders.find(p => p.name === data.provider_id) // todo: confirm
-  }, [data.type, data.provider_id, data.provider_name, triggerProviders])
+    return triggerPlugins?.find(p => p.plugin_id === data.plugin_id)
+  }, [data.type, data.plugin_id, triggerPlugins])
+  const { setDetail } = usePluginStore()

-  const showTriggerConfig = useMemo(() => {
-    return data.type === BlockEnum.TriggerPlugin && currentTriggerProvider
-  }, [data.type, currentTriggerProvider])
+  useEffect(() => {
+    if (currentTriggerPlugin) {
+      setDetail({
+        name: currentTriggerPlugin.label[language],
+        plugin_id: currentTriggerPlugin.plugin_id || '',
+        provider: currentTriggerPlugin.name,
+        declaration: {
+          tool: undefined,
+          // @ts-expect-error just remain the necessary fields
+          trigger: {
+            subscription_schema: currentTriggerPlugin.subscription_schema || [],
+            subscription_constructor: currentTriggerPlugin.subscription_constructor,
+          },
+        },
+      })
+    }
+  }, [currentTriggerPlugin, setDetail])

  const dataSourceList = useStore(s => s.dataSourceList)

@ -352,14 +360,14 @@ const BasePanel: FC<BasePanelProps> = ({
        pluginDetail = currentDataSource
        break
      case BlockEnum.TriggerPlugin:
-        pluginDetail = currentTriggerProvider
+        pluginDetail = currentTriggerPlugin
        break

      default:
        break
    }
    return !pluginDetail ? null : <ReadmeEntrance pluginDetail={pluginDetail as any} className='mt-auto' />
-  }, [data.type, currToolCollection, currentDataSource, currentTriggerProvider])
+  }, [data.type, currToolCollection, currentDataSource, currentTriggerPlugin])

  if (logParams.showSpecialResultPanel) {
    return (
@ -558,9 +566,9 @@ const BasePanel: FC<BasePanelProps> = ({
            )
          }
          {
-            showTriggerConfig && (
+            currentTriggerPlugin && (
              <TriggerSubscription
-                data={data}
+                subscriptionIdSelected={data.subscription_id}
                onSubscriptionChange={handleSubscriptionChange}
              >
                <Tab
@ -571,7 +579,7 @@ const BasePanel: FC<BasePanelProps> = ({
            )
          }
          {
-            !needsToolAuth && !currentDataSource && !showTriggerConfig && (
+            !needsToolAuth && !currentDataSource && !currentTriggerPlugin && (
              <div className='flex items-center justify-between pl-4 pr-3'>
                <Tab
                  value={tabType}
--- a/web/app/components/workflow/nodes/_base/components/workflow-panel/trigger-subscription.tsx
+++ b/web/app/components/workflow/nodes/_base/components/workflow-panel/trigger-subscription.tsx
@ -1,52 +1,25 @@
-import { useLanguage } from '@/app/components/header/account-setting/model-provider-page/hooks'
 import type { SimpleSubscription } from '@/app/components/plugins/plugin-detail-panel/subscription-list'
 import { CreateButtonType, CreateSubscriptionButton } from '@/app/components/plugins/plugin-detail-panel/subscription-list/create'
 import { SubscriptionSelectorEntry } from '@/app/components/plugins/plugin-detail-panel/subscription-list/selector-entry'
-import { usePluginStore } from '@/app/components/plugins/plugin-detail-panel/store'
 import { useSubscriptionList } from '@/app/components/plugins/plugin-detail-panel/subscription-list/use-subscription-list'
-import useConfig from '@/app/components/workflow/nodes/trigger-plugin/use-config'
-import type { Node } from '@/app/components/workflow/types'
 import cn from '@/utils/classnames'
 import type { FC } from 'react'
-import { useEffect } from 'react'

 type TriggerSubscriptionProps = {
-  data: Node['data']
+  subscriptionIdSelected?: string
  onSubscriptionChange: (v: SimpleSubscription, callback?: () => void) => void
  children: React.ReactNode
 }

-export const TriggerSubscription: FC<TriggerSubscriptionProps> = ({ data, onSubscriptionChange, children }) => {
-  // @ts-expect-error TODO: fix this
-  const { currentProvider } = useConfig(data.id as string, data)
-  const { setDetail } = usePluginStore()
-  const language = useLanguage()
+export const TriggerSubscription: FC<TriggerSubscriptionProps> = ({ subscriptionIdSelected, onSubscriptionChange, children }) => {
  const { subscriptions } = useSubscriptionList()
  const subscriptionCount = subscriptions?.length || 0

-  useEffect(() => {
-    if (currentProvider) {
-      setDetail({
-        name: currentProvider.label[language],
-        plugin_id: currentProvider.plugin_id || '',
-        provider: currentProvider.name,
-        declaration: {
-          tool: undefined,
-          // @ts-expect-error just remain the necessary fields
-          trigger: {
-            subscription_schema: currentProvider.subscription_schema || [],
-            subscription_constructor: currentProvider.subscription_constructor,
-          },
-        },
-      })
-    }
-  }, [currentProvider, setDetail])
-
  return <div className={cn('px-4', subscriptionCount > 0 && 'flex items-center justify-between pr-3')}>
    {!subscriptionCount && <CreateSubscriptionButton buttonType={CreateButtonType.FULL_BUTTON} />}
    {children}
    {subscriptionCount > 0 && <SubscriptionSelectorEntry
-      selectedId={data.subscription_id}
+      selectedId={subscriptionIdSelected}
      onSelect={onSubscriptionChange}
    />}
  </div>
--- a/web/app/components/workflow/nodes/trigger-plugin/components/trigger-form/index.tsx
+++ b/web/app/components/workflow/nodes/trigger-plugin/components/trigger-form/index.tsx
@ -14,7 +14,7 @@ type Props = {
  onChange: (value: PluginTriggerVarInputs) => void
  onOpen?: (index: number) => void
  inPanel?: boolean
-  currentTrigger?: Event
+  currentEvent?: Event
  currentProvider?: TriggerWithProvider
  extraParams?: Record<string, any>
  disableVariableInsertion?: boolean
@ -27,7 +27,7 @@ const TriggerForm: FC<Props> = ({
  value,
  onChange,
  inPanel,
-  currentTrigger,
+  currentEvent,
  currentProvider,
  extraParams,
  disableVariableInsertion = false,
@ -44,7 +44,7 @@ const TriggerForm: FC<Props> = ({
            value={value}
            onChange={onChange}
            inPanel={inPanel}
-            currentTrigger={currentTrigger}
+            currentEvent={currentEvent}
            currentProvider={currentProvider}
            extraParams={extraParams}
            disableVariableInsertion={disableVariableInsertion}
--- a/web/app/components/workflow/nodes/trigger-plugin/components/trigger-form/item.tsx
+++ b/web/app/components/workflow/nodes/trigger-plugin/components/trigger-form/item.tsx
@ -22,7 +22,7 @@ type Props = {
  value: PluginTriggerVarInputs
  onChange: (value: PluginTriggerVarInputs) => void
  inPanel?: boolean
-  currentTrigger?: Event
+  currentEvent?: Event
  currentProvider?: TriggerWithProvider
  extraParams?: Record<string, any>
  disableVariableInsertion?: boolean
@ -35,7 +35,7 @@ const TriggerFormItem: FC<Props> = ({
  value,
  onChange,
  inPanel,
-  currentTrigger,
+  currentEvent,
  currentProvider,
  extraParams,
  disableVariableInsertion = false,
@ -91,7 +91,7 @@ const TriggerFormItem: FC<Props> = ({
        value={value}
        onChange={onChange}
        inPanel={inPanel}
-        currentTool={currentTrigger}
+        currentTool={currentEvent}
        currentProvider={currentProvider}
        providerType='trigger'
        extraParams={extraParams}
--- a/web/app/components/workflow/nodes/trigger-plugin/panel.tsx
+++ b/web/app/components/workflow/nodes/trigger-plugin/panel.tsx
@ -22,7 +22,8 @@ const Panel: FC<NodePanelProps<PluginTriggerNodeType>> = ({
    outputSchema,
    hasObjectOutput,
    currentProvider,
-    currentTrigger,
+    currentEvent,
+    subscriptionSelected,
  } = useConfig(id, data)
  const disableVariableInsertion = data.type === BlockEnum.TriggerPlugin

@ -36,7 +37,7 @@ const Panel: FC<NodePanelProps<PluginTriggerNodeType>> = ({
  return (
    <div className='mt-2'>
      {/* Dynamic Parameters Form - Only show when authenticated */}
-      {triggerParameterSchema.length > 0 && (
+      {triggerParameterSchema.length > 0 && subscriptionSelected && (
        <>
          <div className='px-4 pb-4'>
            <TriggerForm
@ -46,7 +47,7 @@ const Panel: FC<NodePanelProps<PluginTriggerNodeType>> = ({
              value={triggerParameterValue}
              onChange={setTriggerParameterValue}
              currentProvider={currentProvider}
-              currentTrigger={currentTrigger}
+              currentEvent={currentEvent}
              disableVariableInsertion={disableVariableInsertion}
            />
          </div>
--- a/web/app/components/workflow/nodes/trigger-plugin/use-config.ts
+++ b/web/app/components/workflow/nodes/trigger-plugin/use-config.ts
@ -86,6 +86,7 @@ const useConfig = (id: string, payload: PluginTriggerNodeType) => {
    event_name: event_name,
    config = {},
    event_parameters: rawEventParameters = {},
+    subscription_id,
  } = inputs

  const event_parameters = useMemo(
@ -97,16 +98,6 @@ const useConfig = (id: string, payload: PluginTriggerNodeType) => {
    [config],
  )

-  // Construct provider for authentication check
-  const authProvider = useMemo(() => {
-    return provider_name || ''
-  }, [provider_id, provider_name])
-
-  const { data: subscriptions = [] } = useTriggerSubscriptions(
-    authProvider,
-    !!authProvider,
-  )
-
  const currentProvider = useMemo<TriggerWithProvider | undefined>(() => {
    return triggerPlugins.find(
      provider =>
@ -116,6 +107,12 @@ const useConfig = (id: string, payload: PluginTriggerNodeType) => {
    )
  }, [triggerPlugins, provider_name, provider_id])

+  const { data: subscriptions = [] } = useTriggerSubscriptions(provider_id || '')
+
+  const subscriptionSelected = useMemo(() => {
+    return subscriptions?.find(s => s.id === subscription_id)
+  }, [subscriptions, subscription_id])
+
  const currentEvent = useMemo<Event | undefined>(() => {
    return currentProvider?.events.find(
      event => event.name === event_name,
@ -221,7 +218,7 @@ const useConfig = (id: string, payload: PluginTriggerNodeType) => {
    readOnly,
    inputs,
    currentProvider,
-    currentTrigger: currentEvent,
+    currentEvent,
    triggerParameterSchema,
    triggerParameterValue,
    setTriggerParameterValue,
@ -229,6 +226,7 @@ const useConfig = (id: string, payload: PluginTriggerNodeType) => {
    outputSchema,
    hasObjectOutput,
    subscriptions,
+    subscriptionSelected,
  }
 }