diff --git a/web/app/components/workflow/nodes/trigger-webhook/panel.tsx b/web/app/components/workflow/nodes/trigger-webhook/panel.tsx index 4a6dfb77a0..81786e4fe2 100644 --- a/web/app/components/workflow/nodes/trigger-webhook/panel.tsx +++ b/web/app/components/workflow/nodes/trigger-webhook/panel.tsx @@ -51,6 +51,7 @@ const Panel: FC> = ({ handleParamsChange, handleBodyChange, handleStatusCodeChange, + handleStatusCodeBlur, handleResponseBodyChange, generateWebhookUrl, } = useConfig(id, data) @@ -189,6 +190,7 @@ const Panel: FC> = ({ type="number" value={inputs.status_code} onChange={(e: React.ChangeEvent) => handleStatusCodeChange(Number(e.target.value))} + onBlur={(e: React.FocusEvent) => handleStatusCodeBlur(Number(e.target.value))} disabled={readOnly} wrapperClassName="w-[120px]" className="h-8" diff --git a/web/app/components/workflow/nodes/trigger-webhook/use-config.ts b/web/app/components/workflow/nodes/trigger-webhook/use-config.ts index 4faf139ccf..9023631704 100644 --- a/web/app/components/workflow/nodes/trigger-webhook/use-config.ts +++ b/web/app/components/workflow/nodes/trigger-webhook/use-config.ts @@ -136,6 +136,15 @@ const useConfig = (id: string, payload: WebhookTriggerNodeType) => { })) }, [inputs, setInputs]) + const handleStatusCodeBlur = useCallback((statusCode: number) => { + // Only clamp when user finishes editing (on blur) + const clampedStatusCode = Math.min(Math.max(statusCode, 200), 399) + + setInputs(produce(inputs, (draft) => { + draft.status_code = clampedStatusCode + })) + }, [inputs, setInputs]) + const handleResponseBodyChange = useCallback((responseBody: string) => { setInputs(produce(inputs, (draft) => { draft.response_body = responseBody @@ -182,6 +191,7 @@ const useConfig = (id: string, payload: WebhookTriggerNodeType) => { handleBodyChange, handleAsyncModeChange, handleStatusCodeChange, + handleStatusCodeBlur, handleResponseBodyChange, generateWebhookUrl, }