# `react-hooks-js/error-boundaries`

Validates usage of error boundaries instead of try/catch for errors in child components

- **Category:** React Compiler
- **Severity:** error
- **Source:** eslint-plugin-react-hooks
- **Framework:** global
- **Enabled when:** eslint-plugin-react-hooks v6+ installed AND React Compiler detected in project
- **Documentation:** <https://react.dev/reference/eslint-plugin-react-hooks/lints/error-boundaries>

## Validation prompt

Use this to decide whether a fired diagnostic is real or a false positive.

Fires when a try/catch wraps a child component render (try { return <Child /> }) or wraps a use(promise) call — render errors and Suspense thenables bubble through the catch block invisibly, so neither pattern actually handles failure. False positive: try/catch around imperative work inside an event handler, useEffect body, or async helper — not around the JSX return statement itself.

## Fix prompt

Use this once validation confirms the diagnostic is real.

For render errors, wrap the subtree in a real React error boundary — react-error-boundary's <ErrorBoundary fallback={...}> or your own class with componentDidCatch + getDerivedStateFromError. Pair it with <Suspense> around use(promise) so loading (Suspense) and error (boundary) states each have a fallback. See https://react.dev/reference/eslint-plugin-react-hooks/lints/error-boundaries