Skip to content

fix: move developer error toasts out of render path#1046

Open
Venkat-Kolasani wants to merge 2 commits into
flexprice:mainfrom
Venkat-Kolasani:fix/1041-developer-error-toasts
Open

fix: move developer error toasts out of render path#1046
Venkat-Kolasani wants to merge 2 commits into
flexprice:mainfrom
Venkat-Kolasani:fix/1041-developer-error-toasts

Conversation

@Venkat-Kolasani

@Venkat-Kolasani Venkat-Kolasani commented Jun 24, 2026

Copy link
Copy Markdown

Summary

Fixes duplicate/stacked error toasts on Developers pages by moving toast.error() from the render path into useEffect when React Query error flags are set.

This is batch 1 of #1041 (Developers pages only). The remaining ~24 files with the same render-time toast pattern can follow the identical useEffect approach in a follow-up PR if maintainers prefer smaller, incremental merges.

Changes

  • src/pages/developer/developer.tsx — API Keys fetch error toast
  • src/pages/developer/ServiceAccounts.tsx — Service Accounts fetch error toast

Why

Calling toast.error() during render triggers re-render side effects, duplicate toasts, and React HotToaster warnings. This matches existing patterns in SettingsDashboard.tsx and InvoicesWidget.tsx.

Test plan

  • Block secret keys API → Developers → API Keys → one toast only
  • Click Add while still in error state → no second toast
  • Block service accounts API → Service Accounts → one toast only
  • npm run lint passes
  • npm run build passes (pre-commit hook)

Closes #1041

Summary by CodeRabbit

  • Bug Fixes
    • Improved developer page error handling so query failures surface via toast notifications more reliably.
    • Reduced unnecessary toast triggers during component rendering by emitting error toasts from lifecycle effects instead.

Move query error toasts in API Keys and Service Accounts pages from
render body to useEffect to prevent duplicate stacked toasts.

Fixes flexprice#1041
@coderabbitai

coderabbitai Bot commented Jun 24, 2026

Copy link
Copy Markdown
Contributor

Review Change Stack

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info
⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: b3d52cef-78ab-483f-8ae2-aa0a88d7378a

📥 Commits

Reviewing files that changed from the base of the PR and between e34c4ff and cdf9fdd.

📒 Files selected for processing (2)
  • src/pages/developer/ServiceAccounts.tsx
  • src/pages/developer/developer.tsx
🚧 Files skipped from review as they are similar to previous changes (2)
  • src/pages/developer/developer.tsx
  • src/pages/developer/ServiceAccounts.tsx

Walkthrough

Two developer page components move query error toasts from render-time conditionals into useEffect callbacks. Both pages import useEffect, trigger translated error toasts from query error flags, and remove the prior inline toast logic.

Changes

Error toast side-effect migration

Layer / File(s) Summary
ServiceAccounts error toast moved to useEffect
src/pages/developer/ServiceAccounts.tsx
Adds an error-toast effect keyed by the service-accounts error flag and translation function, and removes the render-time toast conditional.
DeveloperPage error toast moved to useEffect
src/pages/developer/developer.tsx
Adds an error-toast effect keyed by the secret-keys error flag and translation function, and removes the render-time toast conditional.

Estimated code review effort: 1 (Trivial) | ~3 minutes

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name Status Explanation Resolution
Title check ⚠️ Warning The title is related to the change, but it does not follow the required type(module): message format or allowed module list. Use a title in the required convention, with an approved module and present-tense message, such as fix(payments): move query error to useEffect.
✅ Passed checks (4 passed)
Check name Status Explanation
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Linked Issues check ✅ Passed The changes move query-error toasts for API Keys and Service Accounts into useEffect, matching the fix requested in #1041 for those pages.
Out of Scope Changes check ✅ Passed Only the two developer pages touched by #1041 were changed, and no unrelated code paths appear to have been added.
Docstring Coverage ✅ Passed No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests

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.

❤️ Share

Comment @coderabbitai help to get the list of available commands.

@Venkat-Kolasani

Copy link
Copy Markdown
Author

@omkar273 could you review when you have a moment? Thanks!

@diffsniff

diffsniff Bot commented Jul 18, 2026

Copy link
Copy Markdown

DiffSniff Summary

No security issues found in this PR.

Reviewed by DiffSniff

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

bug: move query error toasts out of render path

1 participant