diff --git a/web/app/components/workflow/nodes/human-input/components/delivery-method/email-configure-modal.tsx b/web/app/components/workflow/nodes/human-input/components/delivery-method/email-configure-modal.tsx index a11c6f1786..1d29b4de41 100644 --- a/web/app/components/workflow/nodes/human-input/components/delivery-method/email-configure-modal.tsx +++ b/web/app/components/workflow/nodes/human-input/components/delivery-method/email-configure-modal.tsx @@ -1,8 +1,4 @@ import type { EmailConfig } from '../../types' -import type { - Node, - NodeOutPutVar, -} from '@/app/components/workflow/types' import { RiBugLine, RiCloseLine } from '@remixicon/react' import { noop } from 'es-toolkit/compat' import { memo, useCallback, useState } from 'react' @@ -24,8 +20,6 @@ type EmailConfigureModalProps = { onClose: () => void onConfirm: (data: any) => void config?: EmailConfig - nodesOutputVars?: NodeOutPutVar[] - availableNodes?: Node[] } const EmailConfigureModal = ({ @@ -33,8 +27,6 @@ const EmailConfigureModal = ({ onClose, onConfirm, config, - nodesOutputVars = [], - availableNodes = [], }: EmailConfigureModalProps) => { const { t } = useTranslation() const { userProfile } = useAppContext() @@ -43,7 +35,7 @@ const EmailConfigureModal = ({ const [body, setBody] = useState(config?.body || '') const [debugMode, setDebugMode] = useState(config?.debug_mode || false) - const checkValidConfig = () => { + const checkValidConfig = useCallback(() => { if (!subject.trim()) { Toast.notify({ type: 'error', @@ -73,7 +65,7 @@ const EmailConfigureModal = ({ return false } return true - } + }, [recipients, subject, body, t]) const handleConfirm = useCallback(() => { if (!checkValidConfig()) @@ -84,7 +76,7 @@ const EmailConfigureModal = ({ body, debug_mode: debugMode, }) - }, [recipients, subject, body, debugMode, onConfirm]) + }, [checkValidConfig, onConfirm, recipients, subject, body, debugMode]) return (
diff --git a/web/app/components/workflow/nodes/human-input/components/delivery-method/index.tsx b/web/app/components/workflow/nodes/human-input/components/delivery-method/index.tsx index 87d91bc728..381d0971f5 100644 --- a/web/app/components/workflow/nodes/human-input/components/delivery-method/index.tsx +++ b/web/app/components/workflow/nodes/human-input/components/delivery-method/index.tsx @@ -17,6 +17,7 @@ type Props = { value: DeliveryMethod[] nodesOutputVars?: NodeOutPutVar[] availableNodes?: Node[] + formContent?: string onChange: (value: DeliveryMethod[]) => void } @@ -25,6 +26,7 @@ const DeliveryMethodForm: React.FC = ({ value, nodesOutputVars, availableNodes, + formContent, onChange, }) => { const { t } = useTranslation() @@ -78,6 +80,7 @@ const DeliveryMethodForm: React.FC = ({ onDelete={handleMethodDelete} nodesOutputVars={nodesOutputVars} availableNodes={availableNodes} + formContent={formContent} /> ))}
diff --git a/web/app/components/workflow/nodes/human-input/components/delivery-method/mail-body-input.tsx b/web/app/components/workflow/nodes/human-input/components/delivery-method/mail-body-input.tsx index 4da82703bf..ced2579b50 100644 --- a/web/app/components/workflow/nodes/human-input/components/delivery-method/mail-body-input.tsx +++ b/web/app/components/workflow/nodes/human-input/components/delivery-method/mail-body-input.tsx @@ -1,30 +1,18 @@ -import type { - Node, - NodeOutPutVar, -} from '@/app/components/workflow/types' -import { useTranslation } from 'react-i18next' import PromptEditor from '@/app/components/base/prompt-editor' import Placeholder from '@/app/components/workflow/nodes/tool/components/mixed-variable-text-input/placeholder' -import { BlockEnum } from '@/app/components/workflow/types' import { cn } from '@/utils/classnames' type MailBodyInputProps = { readOnly?: boolean - nodesOutputVars?: NodeOutPutVar[] - availableNodes?: Node[] value?: string onChange?: (text: string) => void } const MailBodyInput = ({ readOnly = false, - nodesOutputVars, - availableNodes = [], value = '', onChange, }: MailBodyInputProps) => { - const { t } = useTranslation() - return ( { - acc[node.id] = { - title: node.data.title, - type: node.data.type, - } - if (node.data.type === BlockEnum.Start) { - acc.sys = { - title: t('blocks.start', { ns: 'workflow' }), - type: BlockEnum.Start, - } - } - return acc - }, {} as any), - }} requestURLBlock={{ show: true, selectable: true, diff --git a/web/app/components/workflow/nodes/human-input/components/delivery-method/method-item.tsx b/web/app/components/workflow/nodes/human-input/components/delivery-method/method-item.tsx index c9d65b33c7..d7e758dabc 100644 --- a/web/app/components/workflow/nodes/human-input/components/delivery-method/method-item.tsx +++ b/web/app/components/workflow/nodes/human-input/components/delivery-method/method-item.tsx @@ -29,6 +29,7 @@ type Props = { method: DeliveryMethod nodesOutputVars?: NodeOutPutVar[] availableNodes?: Node[] + formContent?: string onChange: (method: DeliveryMethod) => void onDelete: (type: DeliveryMethodType) => void } @@ -38,6 +39,7 @@ const DeliveryMethodItem: React.FC = ({ method, nodesOutputVars, availableNodes, + formContent, onChange, onDelete, }) => { @@ -125,8 +127,6 @@ const DeliveryMethodItem: React.FC = ({ setShowEmailModal(false)} onConfirm={(data) => { handleConfigChange(data) @@ -140,13 +140,10 @@ const DeliveryMethodItem: React.FC = ({ deliveryId={method.id} isShow={showTestEmailModal} config={method.config as EmailConfig} + formContent={formContent} nodesOutputVars={nodesOutputVars} availableNodes={availableNodes} onClose={() => setShowTestEmailModal(false)} - onConfirm={(data) => { - handleConfigChange(data) - setShowTestEmailModal(false) - }} /> )} diff --git a/web/app/components/workflow/nodes/human-input/components/delivery-method/test-email-sender.tsx b/web/app/components/workflow/nodes/human-input/components/delivery-method/test-email-sender.tsx index 8c1e6eee95..b462f60d4c 100644 --- a/web/app/components/workflow/nodes/human-input/components/delivery-method/test-email-sender.tsx +++ b/web/app/components/workflow/nodes/human-input/components/delivery-method/test-email-sender.tsx @@ -34,8 +34,8 @@ type EmailConfigureModalProps = { deliveryId: string isShow: boolean onClose: () => void - onConfirm: (data: any) => void config?: EmailConfig + formContent?: string nodesOutputVars?: NodeOutPutVar[] availableNodes?: Node[] } @@ -67,8 +67,8 @@ const EmailSenderModal = ({ deliveryId, isShow, onClose, - onConfirm, config, + formContent, nodesOutputVars = [], availableNodes = [], }: EmailConfigureModalProps) => { @@ -86,7 +86,7 @@ const EmailSenderModal = ({ const accounts = members?.accounts || [] const generatedInputs = useMemo(() => { - const valueSelectors = doGetInputVars(config?.body || '') + const valueSelectors = doGetInputVars(formContent || '') const variables = unionBy(valueSelectors, item => item.join('.')).map((item) => { const varInfo = getNodeInfoById(availableNodes, item[0])?.data @@ -120,7 +120,7 @@ const EmailSenderModal = ({ } }) return varInputs - }, [availableNodes, config?.body, nodesOutputVars]) + }, [availableNodes, formContent, nodesOutputVars]) const [inputs, setInputs] = useState>({}) const [collapsed, setCollapsed] = useState(true) @@ -147,7 +147,7 @@ const EmailSenderModal = ({ finally { setSendingEmail(false) } - }, [appDetail, onConfirm, nodeId, deliveryId, testEmailSender]) + }, [appDetail, nodeId, deliveryId, testEmailSender]) if (done) { return ( diff --git a/web/app/components/workflow/nodes/human-input/panel.tsx b/web/app/components/workflow/nodes/human-input/panel.tsx index 7b02124094..1a40dcaaec 100644 --- a/web/app/components/workflow/nodes/human-input/panel.tsx +++ b/web/app/components/workflow/nodes/human-input/panel.tsx @@ -78,6 +78,7 @@ const Panel: FC> = ({