diff --git a/web/src/components/webhook-response-status.tsx b/web/src/components/webhook-response-status.tsx new file mode 100644 index 000000000..5c6725c4e --- /dev/null +++ b/web/src/components/webhook-response-status.tsx @@ -0,0 +1,19 @@ +import { useTranslation } from 'react-i18next'; +import { RAGFlowFormItem } from './ragflow-form'; +import { Input } from './ui/input'; + +type WebHookResponseStatusFormFieldProps = { + name: string; +}; + +export function WebHookResponseStatusFormField({ + name, +}: WebHookResponseStatusFormFieldProps) { + const { t } = useTranslation(); + + return ( + + + + ); +} diff --git a/web/src/pages/agent/form/begin-form/webhook/response.tsx b/web/src/pages/agent/form/begin-form/webhook/response.tsx index a3813bd8e..69fb8f09b 100644 --- a/web/src/pages/agent/form/begin-form/webhook/response.tsx +++ b/web/src/pages/agent/form/begin-form/webhook/response.tsx @@ -1,8 +1,8 @@ import { Collapse } from '@/components/collapse'; import { SelectWithSearch } from '@/components/originui/select-with-search'; import { RAGFlowFormItem } from '@/components/ragflow-form'; -import { Input } from '@/components/ui/input'; import { Textarea } from '@/components/ui/textarea'; +import { WebHookResponseStatusFormField } from '@/components/webhook-response-status'; import { WebhookExecutionMode } from '@/pages/agent/constant'; import { buildOptions } from '@/utils/form'; import { useFormContext, useWatch } from 'react-hook-form'; @@ -31,12 +31,9 @@ export function WebhookResponse() { {executionMode === WebhookExecutionMode.Immediately && ( <> - - - + > {/* + {showWebhookResponseStatus && ( + + )} {t('flow.msg')} diff --git a/web/src/pages/agent/form/message-form/use-show-response-status.ts b/web/src/pages/agent/form/message-form/use-show-response-status.ts new file mode 100644 index 000000000..75ba1fb64 --- /dev/null +++ b/web/src/pages/agent/form/message-form/use-show-response-status.ts @@ -0,0 +1,30 @@ +import { isEmpty } from 'lodash'; +import { useEffect, useMemo } from 'react'; +import { UseFormReturn } from 'react-hook-form'; +import { + AgentDialogueMode, + BeginId, + WebhookExecutionMode, +} from '../../constant'; +import useGraphStore from '../../store'; +import { BeginFormSchemaType } from '../begin-form/schema'; + +export function useShowWebhookResponseStatus(form: UseFormReturn) { + const getNode = useGraphStore((state) => state.getNode); + + const showWebhookResponseStatus = useMemo(() => { + const formData: BeginFormSchemaType = getNode(BeginId)?.data.form; + return ( + formData.mode === AgentDialogueMode.Webhook && + formData.execution_mode === WebhookExecutionMode.Streaming + ); + }, []); + + useEffect(() => { + if (showWebhookResponseStatus && isEmpty(form.getValues('status'))) { + form.setValue('status', 200, { shouldValidate: true, shouldDirty: true }); + } + }, []); + + return showWebhookResponseStatus; +}