Skip to content

fix: add proper error handling to fetch calls #4687

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
sarthakNITT wants to merge 3 commits into
base: master
Choose a base branch
from
Open

fix: add proper error handling to fetch calls #4687

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
e52851f
fix: add proper error handling to fetch calls
sarthakNITT Dec 6, 2025
42f30e5
fix: lint error
sarthakNITT Dec 6, 2025
d013e5d
fix: update branch
sarthakNITT Dec 6, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
25 changes: 14 additions & 11 deletions components/Feedback.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -36,21 +36,24 @@ export default function Feedback({ className }: IFeedbackProps) {
feedback
};

fetch('/.netlify/functions/github_discussions', {
method: 'POST',
body: JSON.stringify(data),
headers: {
'Content-Type': 'application/json'
}
}).then((response) => {
try {
const response = await fetch('/.netlify/functions/github_discussions', {
method: 'POST',
body: JSON.stringify(data),
headers: {
'Content-Type': 'application/json'
}
});

if (response.status === 200) {
setSubmitted(true);
}
if (response.status !== 200) {
} else {
setError(true);
}
response.json();
});
await response.json();
} catch (err) {
setError(true);
}
Comment on lines +39 to +56
Copy link
Contributor

@coderabbitai coderabbitai bot Dec 6, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue | 🟡 Minor

Align success/error state with JSON parsing and remove unused response.json()

The new async/await + try/catch structure is a good improvement, but there’s a subtle edge case:

  • For a 200 response, you call setSubmitted(true) and then await response.json().
  • If response.json() throws (e.g., invalid JSON body), the catch runs and setError(true) is called.
  • Final state is submitted === true and error === true, and because the render checks if (submitted) before if (error), the user sees the success UI even though an error occurred.

Since the parsed body is not used, this extra await response.json() only introduces this failure mode without adding value.

Consider simplifying to something like:

-      if (response.status === 200) {
-        setSubmitted(true);
-      } else {
-        setError(true);
-      }
-      await response.json();
+      if (response.status === 200) {
+        setSubmitted(true);
+      } else {
+        setError(true);
+      }

Or, if you later need the body, only parse it when required and handle parse failures in a way that keeps submitted/error consistent with the UI you want.

📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change
try {
const response = await fetch('/.netlify/functions/github_discussions', {
method: 'POST',
body: JSON.stringify(data),
headers: {
'Content-Type': 'application/json'
}
});
if (response.status === 200) {
setSubmitted(true);
}
if (response.status !== 200) {
} else {
setError(true);
}
response.json();
});
await response.json();
} catch (err) {
setError(true);
}
try {
const response = await fetch('/.netlify/functions/github_discussions', {
method: 'POST',
body: JSON.stringify(data),
headers: {
'Content-Type': 'application/json'
}
});
if (response.status === 200) {
setSubmitted(true);
} else {
setError(true);
}
} catch (err) {
setError(true);
}
🤖 Prompt for AI Agents 
In components/Feedback.tsx around lines 39 to 56, the code sets submitted=true
before awaiting response.json(), so if JSON parsing fails the catch flips
error=true and leaves submitted=true (showing success and error); remove the
unused await response.json() (or if you need the body, await and parse it before
calling setSubmitted, catching parse errors and setting setError(true) instead
of setSubmitted) so submitted and error remain mutually consistent.

}

if (submitted) {
Expand Down
24 changes: 14 additions & 10 deletions components/NewsletterSubscribe.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -64,7 +64,7 @@ export default function NewsletterSubscribe({
}, 10000);
};

const handleSubmit = (event: React.FormEvent<HTMLFormElement>) => {
const handleSubmit = async (event: React.FormEvent<HTMLFormElement>) => {
setStatus(FormStatus.LOADING);
event.preventDefault();
const data = {
Expand All @@ -73,21 +73,25 @@ export default function NewsletterSubscribe({
interest: type
};

fetch('/.netlify/functions/newsletter_subscription', {
method: 'POST',
body: JSON.stringify(data),
headers: {
'Content-Type': 'application/json'
}
}).then((res) => {
try {
const res = await fetch('/.netlify/functions/newsletter_subscription', {
method: 'POST',
body: JSON.stringify(data),
headers: {
'Content-Type': 'application/json'
}
});

if (res.status === 200) {
setFormStatus(FormStatus.SUCCESS);
} else {
setFormStatus(FormStatus.ERROR);
}

return res.json();
});
await res.json();
} catch (err) {
setFormStatus(FormStatus.ERROR);
}
};

if (status === FormStatus.SUCCESS) {
Expand Down