delivery methods

web/app/components/workflow/nodes/human-input/components/delivery-method/index.tsx

@@ -0,0 +1,36 @@
+import React from 'react'
+import { useTranslation } from 'react-i18next'
+import {
+  RiAddLine,
+} from '@remixicon/react'
+import Tooltip from '@/app/components/base/tooltip'
+import ActionButton from '@/app/components/base/action-button'
+
+const i18nPrefix = 'workflow.nodes.humanInput'
+
+const DeliveryMethod: React.FC = () => {
+  const { t } = useTranslation()
+
+  return (
+    <div className='px-4 py-2'>
+        <div className='mb-1 flex items-center justify-between'>
+          <div className='flex items-center gap-0.5'>
+            <div className='system-sm-semibold-uppercase text-text-secondary'>{t(`${i18nPrefix}.deliveryMethod.title`)}</div>
+            <Tooltip
+              popupContent={t(`${i18nPrefix}.deliveryMethod.tooltip`)}
+            />
+          </div>
+          <div className='flex items-center px-1'>
+            <ActionButton
+              onClick={() => { /* Add new user action logic here */ }}
+            >
+              <RiAddLine className='h-4 w-4' />
+            </ActionButton>
+          </div>
+        </div>
+        <div className='system-xs-regular flex items-center justify-center rounded-[10px] bg-background-section p-3 text-text-tertiary'>{t(`${i18nPrefix}.deliveryMethod.emptyTip`)}</div>
+      </div>
+  )
+}
+
+export default DeliveryMethod

web/app/components/workflow/nodes/human-input/panel.tsx

@@ -11,6 +11,7 @@ import type { NodePanelProps } from '@/app/components/workflow/types'
 import ActionButton from '@/app/components/base/action-button'
 import Tooltip from '@/app/components/base/tooltip'
 import Divider from '@/app/components/base/divider'
+import DeliveryMethod from './components/delivery-method'
 import UserActionItem from './components/user-action'
 import TimeoutInput from './components/timeout'
 import { v4 as uuid4 } from 'uuid'
@@ -31,6 +32,12 @@ const Panel: FC<NodePanelProps<HumanInputNodeType>> = ({
   } = useConfig(id, data)
   return (
     <div className='py-2'>
+      {/* delivery methods */}
+      <DeliveryMethod />
+      <div className='px-4 py-2'>
+        <Divider className='!my-0 !h-px !bg-divider-subtle' />
+      </div>
+      {/* user actions */}
       <div className='px-4 py-2'>
         <div className='mb-1 flex items-center justify-between'>
           <div className='flex items-center gap-0.5'>
@@ -73,6 +80,7 @@ const Panel: FC<NodePanelProps<HumanInputNodeType>> = ({
       <div className='px-4 py-2'>
         <Divider className='!my-0 !h-px !bg-divider-subtle' />
       </div>
+      {/* timeout */}
       <div className='flex items-center justify-between px-4 py-2'>
         <div className='system-sm-semibold-uppercase text-text-secondary'>{t(`${i18nPrefix}.timeout.title`)}</div>
         <TimeoutInput

web/i18n/en-US/workflow.ts

@@ -907,6 +907,8 @@ const translation = {
     humanInput: {
       deliveryMethod: {
         title: 'Delivery Method',
+        tooltip: 'How the human input form is delivered to the user.',
+        emptyTip: 'No delivery method added, the operation cannot be triggered.',
       },
       formContent: 'form content',
       userActions: {

web/i18n/zh-Hans/workflow.ts

@@ -908,6 +908,8 @@ const translation = {
     humanInput: {
       deliveryMethod: {
         title: '提交方式',
+        tooltip: '人类输入表单如何传递给用户。',
+        emptyTip: '未添加提交方式，无法触发操作。',
       },
       formContent: '表单内容',
       userActions: {