feat: added error boundary

[sarthakNITT]

Description

• Added a global React Error Boundary to prevent full white-screen crashes in production.
• Without an error boundary, any runtime error inside a component (e.g., NavBar, Layout, page components) caused the entire app to break with no fallback UI.
• The new ErrorBoundary now catches these errors and displays a friendly fallback screen with a refresh option.

Summary by CodeRabbit

• New Features
  • Added an app-wide error boundary that displays a friendly fallback UI when unexpected errors occur.
  • Includes a "Refresh Page" button to let users quickly recover from an error state.
  • Wrapped the application root so the entire app benefits from centralized error handling.

_{✏️ Tip: You can customize this high-level summary in your review settings.}

[coderabbitai[bot]]

Walkthrough

Adds a React ErrorBoundary component and wraps the entire app root in pages/_app.tsx so runtime rendering errors show a fallback UI with a refresh action instead of crashing the app.

Changes

Cohort / File(s)	Summary
Error Boundary component components/ErrorBoundary.tsx	New React class component ErrorBoundary with ErrorBoundaryState { hasError: boolean }, constructor, static getDerivedStateFromError, componentDidCatch, and render that displays a fallback UI including a "Refresh Page" button when an error occurs.
App root integration pages/_app.tsx	Imports ErrorBoundary and wraps the application root with it, moving existing app children inside the boundary.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

• Review focus: lifecycle correctness (getDerivedStateFromError, componentDidCatch) and correct typing of props/state.
• Verify fallback UI accessibility and that wrapping does not disrupt existing context/providers or props passed to the app.
• Confirm logging in componentDidCatch follows project conventions.

Possibly related issues

• asyncapi/website#4688 — Implements an application-level React ErrorBoundary and root wrapping requested by the issue.

Poem

🐇 I nibble bugs in code so bright,
I catch the crash and set things right.
A gentle button, refresh and play —
I patch the night and greet the day. 🥕✨

Pre-merge checks and finishing touches

✅ Passed checks (3 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title 'feat: added error boundary' clearly and directly summarizes the main change—adding an error boundary component to the application.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

✨ Finishing touches

• [ ] 📝 Generate docstrings

🧪 Generate unit tests (beta)

• [ ] Create PR with unit tests
• [ ] Post copyable unit tests in a comment

---

📜 Recent review details

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 5f866a58c3edcf1884bf3fa0b2f3b1eb7dcc4a12 and b6a1bd8659d9737583da4dc656240d3c27777b69.

📒 Files selected for processing (1)

• components/ErrorBoundary.tsx (1 hunks)

🚧 Files skipped from review as they are similar to previous changes (1)

• components/ErrorBoundary.tsx

⏰ Context from checks skipped due to timeout of 180000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (1)

• GitHub Check: cypress-run

---

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

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[netlify[bot]]

✅ Deploy Preview for asyncapi-website ready!

Built without sensitive environment variables

Name	Link
🔨 Latest commit	b6a1bd8659d9737583da4dc656240d3c27777b69
🔍 Latest deploy log	https://app.netlify.com/projects/asyncapi-website/deploys/69340cb065c08d00081f1d19
😎 Deploy Preview	https://deploy-preview-4689--asyncapi-website.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify project configuration.

[codecov[bot]]

Codecov Report

:white_check_mark: All modified and coverable lines are covered by tests. :white_check_mark: Project coverage is 100.00%. Comparing base (a677dc6) to head (b6a1bd8). :warning: Report is 23 commits behind head on master.

Additional details and impacted files

@@            Coverage Diff            @@
##            master     #4689   +/-   ##
=========================================
  Coverage   100.00%   100.00%           
=========================================
  Files           22        22           
  Lines          799       799           
  Branches       146       146           
=========================================
  Hits           799       799           

:umbrella: View full report in Codecov by Sentry.
:loudspeaker: Have feedback on the report? Share it here.

:rocket: New features to boost your workflow:

• :snowflake: Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
• :package: JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

[asyncapi-bot]

⚡️ Lighthouse report for the changes in this PR:

Category	Score
🔴 Performance	47
🟢 Accessibility	98
🟢 Best practices	92
🟢 SEO	100
🔴 PWA	33

Lighthouse ran on https://deploy-preview-4689--asyncapi-website.netlify.app/