From 1ddd11f045915a5b089086ec4e492ae03f982455 Mon Sep 17 00:00:00 2001 From: balibabu Date: Mon, 15 Dec 2025 11:09:08 +0800 Subject: [PATCH] Feat: Set the return value of the webhook to a string. #10427 (#11945) ### What problem does this PR solve? Feat: Set the return value of the webhook to a string. #10427 ### Type of change - [x] New Feature (non-breaking change which adds functionality) --- web/src/locales/en.ts | 24 ++-- web/src/pages/agent/constant/index.tsx | 6 + web/src/pages/agent/form/begin-form/index.tsx | 2 +- web/src/pages/agent/form/begin-form/schema.ts | 8 +- .../form/begin-form/use-handle-mode-change.ts | 2 + .../begin-form/webhook/dynamic-request.tsx | 18 ++- .../begin-form/webhook/dynamic-response.tsx | 109 +++++------------- .../agent/form/begin-form/webhook/index.tsx | 38 ++---- .../begin-form/webhook/request-schema.tsx | 12 ++ .../form/begin-form/webhook/response.tsx | 53 +++++++-- web/src/pages/agent/utils.ts | 7 -- 11 files changed, 132 insertions(+), 147 deletions(-) diff --git a/web/src/locales/en.ts b/web/src/locales/en.ts index fd9977257..3c72a8f31 100644 --- a/web/src/locales/en.ts +++ b/web/src/locales/en.ts @@ -2006,28 +2006,28 @@ Important structured information may include: names, dates, locations, events, k schema: 'Schema', response: 'Response', executionMode: 'Execution mode', - authMethods: 'Authentication Methods', - authType: 'Authentication Type', - limit: 'Request Limit', - per: 'Time Period', - maxBodySize: 'Maximum Body Size', - ipWhitelist: 'IP Whitelist', - tokenHeader: 'Token Header', - tokenValue: 'Token Value', + authMethods: 'Authentication methods', + authType: 'Authentication type', + limit: 'Request limit', + per: 'Time period', + maxBodySize: 'Maximum body size', + ipWhitelist: 'Ip whitelist', + tokenHeader: 'Token header', + tokenValue: 'Token value', username: 'Username', password: 'Password', algorithm: 'Algorithm', secret: 'Secret', issuer: 'Issuer', audience: 'Audience', - requiredClaims: 'Required Claims', + requiredClaims: 'Required claims', header: 'Header', status: 'Status', - headersTemplate: 'Headers Template', - bodyTemplate: 'Body Template', + headersTemplate: 'Headers template', + bodyTemplate: 'Body template', basic: 'Basic', bearer: 'Bearer', - apiKey: 'Api Key', + apiKey: 'Api key', queryParameters: 'Query parameters', headerParameters: 'Header parameters', requestBodyParameters: 'Request body parameters', diff --git a/web/src/pages/agent/constant/index.tsx b/web/src/pages/agent/constant/index.tsx index d096afa5f..44d152127 100644 --- a/web/src/pages/agent/constant/index.tsx +++ b/web/src/pages/agent/constant/index.tsx @@ -1037,3 +1037,9 @@ export enum WebhookRequestParameters { Number = TypesWithArray.Number, Boolean = TypesWithArray.Boolean, } + +export enum WebhookStatus { + Testing = 'testing', + Live = 'live', + Stopped = 'stopped', +} diff --git a/web/src/pages/agent/form/begin-form/index.tsx b/web/src/pages/agent/form/begin-form/index.tsx index b7bcd549b..785b8ea57 100644 --- a/web/src/pages/agent/form/begin-form/index.tsx +++ b/web/src/pages/agent/form/begin-form/index.tsx @@ -83,7 +83,7 @@ function BeginForm({ node }: INextOperatorForm) { }); return ( -
+
{ field.onChange(val); }} - options={buildParametersOptions(isObject)} + options={buildParametersOptions( + isObject && isFormDataContentType, + )} > )} diff --git a/web/src/pages/agent/form/begin-form/webhook/dynamic-response.tsx b/web/src/pages/agent/form/begin-form/webhook/dynamic-response.tsx index 18030feff..d4a3a4c91 100644 --- a/web/src/pages/agent/form/begin-form/webhook/dynamic-response.tsx +++ b/web/src/pages/agent/form/begin-form/webhook/dynamic-response.tsx @@ -11,13 +11,9 @@ import { Editor, loader } from '@monaco-editor/react'; import { X } from 'lucide-react'; import { ReactNode, useCallback } from 'react'; import { useFieldArray, useFormContext } from 'react-hook-form'; -import { InputMode, TypesWithArray } from '../../../constant'; -import { - InputModeOptions, - buildConversationVariableSelectOptions, -} from '../../../utils'; +import { TypesWithArray } from '../../../constant'; +import { buildConversationVariableSelectOptions } from '../../../utils'; import { DynamicFormHeader } from '../../components/dynamic-fom-header'; -import { QueryVariable } from '../../components/query-variable'; loader.config({ paths: { vs: '/vs' } }); @@ -33,8 +29,6 @@ type SelectKeysProps = { const VariableTypeOptions = buildConversationVariableSelectOptions(); -const modeField = 'input_mode'; - const ConstantValueMap = { [TypesWithArray.Boolean]: true, [TypesWithArray.Number]: 0, @@ -63,71 +57,46 @@ export function DynamicResponse({ }); const initializeValue = useCallback( - (mode: string, variableType: string, valueFieldAlias: string) => { - if (mode === InputMode.Variable) { - form.setValue(valueFieldAlias, '', { shouldDirty: true }); - } else { - const val = ConstantValueMap[variableType as TypesWithArray]; - form.setValue(valueFieldAlias, val, { shouldDirty: true }); - } + (variableType: string, valueFieldAlias: string) => { + const val = ConstantValueMap[variableType as TypesWithArray]; + form.setValue(valueFieldAlias, val, { shouldDirty: true }); }, [form], ); - const handleModeChange = useCallback( - (mode: string, valueFieldAlias: string, operatorFieldAlias: string) => { - const variableType = form.getValues(operatorFieldAlias); - initializeValue(mode, variableType, valueFieldAlias); - }, - [form, initializeValue], - ); - const handleVariableTypeChange = useCallback( - (variableType: string, valueFieldAlias: string, modeFieldAlias: string) => { - const mode = form.getValues(modeFieldAlias); - - initializeValue(mode, variableType, valueFieldAlias); + (variableType: string, valueFieldAlias: string) => { + initializeValue(variableType, valueFieldAlias); }, - [form, initializeValue], + [initializeValue], ); const renderParameter = useCallback( - (operatorFieldName: string, modeFieldName: string) => { - const mode = form.getValues(modeFieldName); + (operatorFieldName: string) => { const logicalOperator = form.getValues(operatorFieldName); - if (mode === InputMode.Constant) { - if (logicalOperator === TypesWithArray.Boolean) { - return ; - } + if (logicalOperator === TypesWithArray.Boolean) { + return ; + } - if (logicalOperator === TypesWithArray.Number) { - return ; - } + if (logicalOperator === TypesWithArray.Number) { + return ; + } - if (logicalOperator === TypesWithArray.String) { - return ; - } - - return ( - - ); + if (logicalOperator === TypesWithArray.String) { + return ; } return ( - + ); }, [form, isDarkTheme], @@ -142,7 +111,6 @@ export function DynamicResponse({ append({ [keyField]: '', [valueField]: '', - [modeField]: InputMode.Constant, [operatorField]: TypesWithArray.String, }) } @@ -152,7 +120,6 @@ export function DynamicResponse({ const keyFieldAlias = `${name}.${index}.${keyField}`; const valueFieldAlias = `${name}.${index}.${valueField}`; const operatorFieldAlias = `${name}.${index}.${operatorField}`; - const modeFieldAlias = `${name}.${index}.${modeField}`; return (
@@ -167,11 +134,7 @@ export function DynamicResponse({ { - handleVariableTypeChange( - val, - valueFieldAlias, - modeFieldAlias, - ); + handleVariableTypeChange(val, valueFieldAlias); field.onChange(val); }} options={VariableTypeOptions} @@ -179,25 +142,9 @@ export function DynamicResponse({ )} - - {(field) => ( - { - handleModeChange( - val, - valueFieldAlias, - operatorFieldAlias, - ); - field.onChange(val); - }} - options={InputModeOptions} - > - )} - - {renderParameter(operatorFieldAlias, modeFieldAlias)} + {renderParameter(operatorFieldAlias)} diff --git a/web/src/pages/agent/form/begin-form/webhook/index.tsx b/web/src/pages/agent/form/begin-form/webhook/index.tsx index e32af973b..8bcae0f29 100644 --- a/web/src/pages/agent/form/begin-form/webhook/index.tsx +++ b/web/src/pages/agent/form/begin-form/webhook/index.tsx @@ -1,16 +1,15 @@ import { Collapse } from '@/components/collapse'; +import CopyToClipboard from '@/components/copy-to-clipboard'; import { SelectWithSearch } from '@/components/originui/select-with-search'; import { RAGFlowFormItem } from '@/components/ragflow-form'; import { Input } from '@/components/ui/input'; import { MultiSelect } from '@/components/ui/multi-select'; import { Textarea } from '@/components/ui/textarea'; import { buildOptions } from '@/utils/form'; -import { useFormContext, useWatch } from 'react-hook-form'; import { useTranslation } from 'react-i18next'; +import { useParams } from 'umi'; import { RateLimitPerList, - WebhookContentType, - WebhookExecutionMode, WebhookMaxBodySize, WebhookMethod, WebhookSecurityAuthType, @@ -24,15 +23,16 @@ const RateLimitPerOptions = buildOptions(RateLimitPerList); export function WebHook() { const { t } = useTranslation(); - const form = useFormContext(); + const { id } = useParams(); - const executionMode = useWatch({ - control: form.control, - name: 'execution_mode', - }); + const text = `${location.protocol}//${location.host}/api/v1/webhook/${id}`; return ( <> +
+ {text} + +
{(field) => ( )} - - - + Security}>
- - - - {executionMode === WebhookExecutionMode.Immediately && ( - - )} + + ); } diff --git a/web/src/pages/agent/form/begin-form/webhook/request-schema.tsx b/web/src/pages/agent/form/begin-form/webhook/request-schema.tsx index 9ab77b9d0..230bed11f 100644 --- a/web/src/pages/agent/form/begin-form/webhook/request-schema.tsx +++ b/web/src/pages/agent/form/begin-form/webhook/request-schema.tsx @@ -1,4 +1,8 @@ import { Collapse } from '@/components/collapse'; +import { SelectWithSearch } from '@/components/originui/select-with-search'; +import { RAGFlowFormItem } from '@/components/ragflow-form'; +import { WebhookContentType } from '@/pages/agent/constant'; +import { buildOptions } from '@/utils/form'; import { useTranslation } from 'react-i18next'; import { DynamicRequest } from './dynamic-request'; @@ -8,6 +12,14 @@ export function WebhookRequestSchema() { return ( {t('flow.webhook.schema')}}>
+ + + Response}>
- + - - + {executionMode === WebhookExecutionMode.Immediately && ( + <> + + + + {/* */} + {/* */} + + + + + )}
); diff --git a/web/src/pages/agent/utils.ts b/web/src/pages/agent/utils.ts index efa0a3a33..4f3df85c3 100644 --- a/web/src/pages/agent/utils.ts +++ b/web/src/pages/agent/utils.ts @@ -355,13 +355,6 @@ function transformBeginParams(params: BeginFormSchemaType) { ...params.security, ip_whitelist: params.security?.ip_whitelist.map((x) => x.value), }, - response: { - ...params.response, - headers_template: transformArrayToObject( - params.response?.headers_template, - ), - body_template: transformArrayToObject(params.response?.body_template), - }, }; }