fix(dashboard): hide request body for HTTP methods without body support

apps/dashboard/src/components/workflow-editor/steps/http-request/curl-display.tsx

@@ -1,5 +1,5 @@
 import { cn } from '@/utils/ui';
-import { type KeyValuePair, NOVU_SIGNATURE_HEADER_KEY } from './curl-utils';
+import { canMethodHaveBody, type KeyValuePair, NOVU_SIGNATURE_HEADER_KEY } from './curl-utils';
 
 type CurlDisplayProps = {
   url: string;
@@ -17,7 +17,7 @@ export function CurlDisplay({ url, method, headers, body, className, novuSignatu
 
   const hasNovuSignature = headerEntries.some(([k]) => k.toLowerCase() === NOVU_SIGNATURE_HEADER_KEY);
 
-  const canHaveBody = method !== 'GET' && method !== 'DELETE';
+  const canHaveBody = canMethodHaveBody(method);
   let bodyObj: Record<string, unknown> | null = null;
 
   if (canHaveBody && body) {

apps/dashboard/src/components/workflow-editor/steps/http-request/curl-utils.ts

@@ -2,6 +2,12 @@ export type KeyValuePair = { key: string; value: string };
 
 export const NOVU_SIGNATURE_HEADER_KEY = 'novu-signature';
 
+const METHODS_WITH_BODY = new Set(['POST', 'PUT', 'PATCH']);
+
+export function canMethodHaveBody(method: string): boolean {
+  return METHODS_WITH_BODY.has(method.toUpperCase());
+}
+
 export function buildRawCurlString(
   url: string,
   method: string,
@@ -21,7 +27,7 @@ export function buildRawCurlString(
 
   const headerArgs = headerEntries.map(([k, v]) => `--header '${k}: ${v}'`).join(' \\\n');
 
-  const canHaveBody = method !== 'GET' && method !== 'DELETE';
+  const canHaveBody = canMethodHaveBody(method);
   let bodyObj: Record<string, unknown> | null = null;
 
   if (canHaveBody) {

apps/dashboard/src/components/workflow-editor/steps/http-request/http-request-editor.tsx

@@ -1,8 +1,10 @@
 import { EnvironmentTypeEnum, type UiSchema, UiSchemaGroupEnum } from '@novu/shared';
+import { useFormContext } from 'react-hook-form';
 import { SidebarContent } from '@/components/side-navigation/sidebar';
 import { TabsSection } from '@/components/workflow-editor/steps/tabs-section';
 import { useEnvironment } from '@/context/environment/hooks';
 import { StepEditorUnavailable } from '../step-editor-unavailable';
+import { canMethodHaveBody } from './curl-utils';
 import { KeyValuePairList } from './key-value-pair-list';
 import { RequestEndpoint } from './request-endpoint';
 import { ResponseBodySchema } from './response-body-schema';
@@ -13,6 +15,9 @@ type HttpRequestEditorProps = {
 
 export function HttpRequestEditor({ uiSchema }: HttpRequestEditorProps) {
   const { currentEnvironment } = useEnvironment();
+  const { watch } = useFormContext();
+  const method = watch('method');
+  const hasBody = canMethodHaveBody(method);
 
   if (uiSchema.group !== UiSchemaGroupEnum.HTTP_REQUEST) {
     return null;
@@ -33,11 +38,13 @@ export function HttpRequestEditor({ uiSchema }: HttpRequestEditorProps) {
           tooltip="Custom HTTP headers to include with the request"
         />
 
-        <KeyValuePairList
-          fieldName="body"
-          label="Request body"
-          tooltip="Key-value pairs to include in the request body"
-        />
+        {hasBody && (
+          <KeyValuePairList
+            fieldName="body"
+            label="Request body"
+            tooltip="Key-value pairs to include in the request body"
+          />
+        )}
 
         <p className="text-text-sub px-1 text-xs">
           <span>💡 Tip: </span>

apps/dashboard/src/components/workflow-editor/steps/http-request/use-copy-prompt.tsx

@@ -2,8 +2,7 @@ import { useCallback } from 'react';
 import { ToastClose, ToastIcon } from '@/components/primitives/sonner';
 import { showErrorToast, showToast } from '@/components/primitives/sonner-helpers';
 import { useStepEditor } from '../context/step-editor-context';
-
-type KeyValuePair = { key: string; value: string };
+import { canMethodHaveBody, type KeyValuePair } from './curl-utils';
 
 function buildLlmPrompt(
   url: string,
@@ -22,7 +21,7 @@ function buildLlmPrompt(
         '\n  novu-signature: t=<timestamp>,v1=<hmac-sha256>'
       : '  novu-signature: t=<timestamp>,v1=<hmac-sha256>';
 
-  const canHaveBody = method !== 'GET' && method !== 'DELETE';
+  const canHaveBody = canMethodHaveBody(method);
   const bodyObject =
     canHaveBody && activeBody.length > 0 ? Object.fromEntries(activeBody.map(({ key, value }) => [key, value])) : null;