fix(dashboard): hide request body for HTTP methods without body support#10282
fix(dashboard): hide request body for HTTP methods without body support#10282
Conversation
GET, HEAD, OPTIONS, and DELETE methods don't support request bodies. Hide the 'Request body' section in the HTTP Request Editor when one of these methods is selected. Also updated curl-utils and copy-prompt to be consistent. Co-authored-by: Dima Grossman <dima@grossman.io>
|
Cursor Agent can help with this pull request. Just |
✅ Deploy preview added
To edit notification comments on pull requests, go to your Netlify project configuration. |
|
Hey there and thank you for opening this pull request! 👋 We require pull request titles to follow specific formatting rules and it looks like your proposed title needs to be adjusted. Your PR title is: Requirements:
Expected format: Details: PR title must end with 'fixes TICKET-ID' (e.g., 'fixes NOV-123') or include ticket ID in branch name |
scopsy
changed the title
|
No actionable comments were generated in the recent review. 🎉 ℹ️ Recent review info⚙️ Run configurationConfiguration used: Repository UI Review profile: CHILL Plan: Pro Run ID: 📒 Files selected for processing (2)
🚧 Files skipped from review as they are similar to previous changes (1)
WalkthroughAdds a centralized helper 🚥 Pre-merge checks | ✅ 2 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (2 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. 📝 Coding Plan
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (1)
apps/dashboard/src/components/workflow-editor/steps/http-request/use-copy-prompt.tsx (1)
25-79:⚠️ Potential issue | 🟠 MajorPrompt text is still body-specific for methods without a body.
After Line 25, GET/DELETE/HEAD/OPTIONS no longer include body data, but the prompt still instructs to parse JSON body (Line 77) and references
JSON.stringify(requestBody)(Line 67). This produces inconsistent prompts for bodyless methods.Suggested fix
const canHaveBody = method !== 'GET' && method !== 'DELETE' && method !== 'HEAD' && method !== 'OPTIONS'; + const bodyHandlingInstruction = canHaveBody + ? '3. Parses the JSON body and extracts relevant fields' + : '3. Skips JSON body parsing for this method'; + const signedPayloadInstruction = canHaveBody + ? '2. Build the signed string: `${timestamp}.${JSON.stringify(requestBody)}`' + : '2. Build the signed string using an empty payload representation for this method'; @@ -To verify: -1. Parse the header: split on `,`, extract `t` (timestamp) and `v1` (HMAC) -2. Build the signed string: `${timestamp}.${JSON.stringify(requestBody)}` +To verify: +1. Parse the header: split on `,`, extract `t` (timestamp) and `v1` (HMAC) +${signedPayloadInstruction} @@ -3. Parses the JSON body and extracts relevant fields +${bodyHandlingInstruction}🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@apps/dashboard/src/components/workflow-editor/steps/http-request/use-copy-prompt.tsx` around lines 25 - 79, The prompt currently assumes a JSON body even for methods that cannot have one; update the returned template string to conditionally include body-related instructions based on the canHaveBody variable: keep bodyBlock as-is but only include steps that reference parsing JSON, JSON.stringify(requestBody) and "Parses the JSON body" when canHaveBody is true, and otherwise change those steps to refer to reading/verifying the raw request body or note "no body expected"; adjust the signature verification step (where it builds `${timestamp}.${JSON.stringify(requestBody)}`) to use a rawBody variable or conditional fragment so it doesn't call JSON.stringify for bodyless methods; modify the returned template around the signature and "What to generate" sections to branch on canHaveBody (referencing canHaveBody, bodyBlock, and the template string that contains JSON.stringify(requestBody)).
🧹 Nitpick comments (1)
apps/dashboard/src/components/workflow-editor/steps/http-request/curl-utils.ts (1)
24-24: Extract HTTP body-eligibility logic into a shared helper.Line 24 duplicates logic now also present in
use-copy-prompt.tsxandhttp-request-editor.tsx. Centralizing this into one utility (e.g.,canMethodHaveBody(method)) will prevent future behavior drift.As per coding guidelines, “Prefer iteration and modularization over code duplication.”
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@apps/dashboard/src/components/workflow-editor/steps/http-request/curl-utils.ts` at line 24, Extract the duplicated HTTP body-eligibility check into a single exported helper function named canMethodHaveBody(method) (returns boolean) and replace the inline constant in curl-utils.ts (const canHaveBody = ...), use-copy-prompt.tsx, and http-request-editor.tsx to call that helper; update the three files to import the helper from the new utility module and ensure the function treats GET, DELETE, HEAD, and OPTIONS as non-body methods to preserve existing behavior.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Outside diff comments:
In
`@apps/dashboard/src/components/workflow-editor/steps/http-request/use-copy-prompt.tsx`:
- Around line 25-79: The prompt currently assumes a JSON body even for methods
that cannot have one; update the returned template string to conditionally
include body-related instructions based on the canHaveBody variable: keep
bodyBlock as-is but only include steps that reference parsing JSON,
JSON.stringify(requestBody) and "Parses the JSON body" when canHaveBody is true,
and otherwise change those steps to refer to reading/verifying the raw request
body or note "no body expected"; adjust the signature verification step (where
it builds `${timestamp}.${JSON.stringify(requestBody)}`) to use a rawBody
variable or conditional fragment so it doesn't call JSON.stringify for bodyless
methods; modify the returned template around the signature and "What to
generate" sections to branch on canHaveBody (referencing canHaveBody, bodyBlock,
and the template string that contains JSON.stringify(requestBody)).
---
Nitpick comments:
In
`@apps/dashboard/src/components/workflow-editor/steps/http-request/curl-utils.ts`:
- Line 24: Extract the duplicated HTTP body-eligibility check into a single
exported helper function named canMethodHaveBody(method) (returns boolean) and
replace the inline constant in curl-utils.ts (const canHaveBody = ...),
use-copy-prompt.tsx, and http-request-editor.tsx to call that helper; update the
three files to import the helper from the new utility module and ensure the
function treats GET, DELETE, HEAD, and OPTIONS as non-body methods to preserve
existing behavior.
ℹ️ Review info
⚙️ Run configuration
Configuration used: Repository UI
Review profile: CHILL
Plan: Pro
Run ID: 73b709d7-0192-42db-ad83-e69c0c884199
📒 Files selected for processing (3)
apps/dashboard/src/components/workflow-editor/steps/http-request/curl-utils.tsapps/dashboard/src/components/workflow-editor/steps/http-request/http-request-editor.tsxapps/dashboard/src/components/workflow-editor/steps/http-request/use-copy-prompt.tsx
|
@cursoragent |
|
Done. Here's what I changed: • Extracted All three files now share one source of truth for body eligibility.   |
…curl-utils Centralizes the HTTP body-eligibility logic into a single exported function in curl-utils.ts. Both use-copy-prompt.tsx and http-request-editor.tsx now import and reuse it, removing duplication. Also reuses the KeyValuePair type from curl-utils in use-copy-prompt. Co-authored-by: George Djabarov <djabarovgeorge@users.noreply.github.com>
cursor
bot
changed the title
There was a problem hiding this comment.
Actionable comments posted: 2
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In
`@apps/dashboard/src/components/workflow-editor/steps/http-request/curl-utils.ts`:
- Around line 7-9: canMethodHaveBody currently performs a case-sensitive lookup
against METHODS_WITHOUT_BODY, so inputs like "get" or "Head" are misclassified;
update canMethodHaveBody to normalize the incoming method (e.g.,
method?.toUpperCase()) before checking METHODS_WITHOUT_BODY.has(method) and
ensure it safely handles null/undefined inputs (treat non-strings as not having
a body or return false) so lookups are consistent regardless of caller casing.
- Around line 7-9: Replace the duplicated method-body check in curl-display.tsx
(currently using "method !== 'GET' && method !== 'DELETE'") with the canonical
helper canMethodHaveBody; import canMethodHaveBody from curl-utils and use it
wherever the component decides whether to show/send a request body so
HEAD/OPTIONS and any future rules follow the centralized logic in
canMethodHaveBody.
ℹ️ Review info
⚙️ Run configuration
Configuration used: Repository UI
Review profile: CHILL
Plan: Pro
Run ID: 845d7e29-5c49-42d6-ae17-663bfda230d2
📒 Files selected for processing (3)
apps/dashboard/src/components/workflow-editor/steps/http-request/curl-utils.tsapps/dashboard/src/components/workflow-editor/steps/http-request/http-request-editor.tsxapps/dashboard/src/components/workflow-editor/steps/http-request/use-copy-prompt.tsx
🚧 Files skipped from review as they are similar to previous changes (2)
- apps/dashboard/src/components/workflow-editor/steps/http-request/use-copy-prompt.tsx
- apps/dashboard/src/components/workflow-editor/steps/http-request/http-request-editor.tsx
apps/dashboard/src/components/workflow-editor/steps/http-request/curl-utils.ts
Show resolved
Hide resolved
Replaces the inline logic for determining if an HTTP method can have a body with the newly extracted canMethodHaveBody function from curl-utils. This change enhances code clarity and maintains consistency across components using this logic.
3 participants
What changed? Why was the change needed?
This change hides the "Request body" section in the HTTP step editor when an HTTP method that does not support a body is selected. This improves the user experience by only showing relevant fields and ensures adherence to HTTP specifications.
Specifically:
http-request-editor.tsxis now conditionally rendered, appearing only for POST, PUT, and PATCH methods.canHaveBodylogic incurl-utils.tsanduse-copy-prompt.tsxhas been updated for consistency to exclude GET, HEAD, OPTIONS, and DELETE methods.Screenshots
Slack Thread