zidanecomponents/ErrorBoundary
import { … } from 'zidane-ui'ui/src/components/ErrorBoundary.tsx
Components#
ErrorDetailsComponent#
The error message; with stacks on (configureErrorReports) the JS and component stacks under a disclosure.
function ErrorDetails(props: ErrorDetailsProps): ElementParameters
| Name | Type | Description |
|---|---|---|
| props | ErrorDetailsProps | The error and its component stack. |
Returns
ElementProps
| Name | Type | Description |
|---|---|---|
| componentStack | string | null | React's component stack, once known. |
| error | unknown | What was thrown. |
ErrorFallbackComponent#
The default fallback: what failed, why, and a way back.
function ErrorFallback(props: ErrorFallbackFrameProps): ElementParameters
| Name | Type | Description |
|---|---|---|
| props | ErrorFallbackFrameProps | The error, the region and the reset. |
Returns
ElementProps
| Name | Type | Description |
|---|---|---|
| actions? | ReactNode | Extra buttons next to "Try again". |
| className? | string | The container's classes. |
componentStackfrom ErrorFallbackProps | string | null | React's component stack, once known. |
errorfrom ErrorFallbackProps | unknown | What was thrown. |
| framed? | boolean | Drawn as a tray (default true). |
| region | string | Names the region ("Sidebar"). |
resetfrom ErrorFallbackProps | () => void | Clears the error and renders the region again. |
Classes#
ErrorBoundaryClass#
Catches a throw in its children and shows a fallback in their place (see the top of this file).
class ErrorBoundary extends Component<ErrorBoundaryProps, State>Constructor
new ErrorBoundary(props: ErrorBoundaryProps)Parameters
| Name | Type | Description |
|---|---|---|
| props | ErrorBoundaryProps | The region's name, its children and the fallback. |
Returns
Properties
| Name | Type | Description |
|---|---|---|
| state | State | Whether it caught, what, and the |
Methods
componentDidCatch()
componentDidCatch(error: unknown, info: ErrorInfo): voidReact's hook: logs the caught error once, with the region.
Parameters
| Name | Type | Description |
|---|---|---|
| error | unknown | What was thrown. |
| info | ErrorInfo | React's component stack. |
render()
render(): ReactNodeThe children, or the fallback after a throw.
Returns
ReactNodereset()
reset(): voidClears the error and renders the region again.
ErrorBoundary.getDerivedStateFromError()
ErrorBoundary.getDerivedStateFromError(error: unknown): Partial<State>React's hook: a child threw.
Parameters
| Name | Type | Description |
|---|---|---|
| error | unknown | What was thrown. |
Returns
Partial<State>ErrorBoundary.getDerivedStateFromProps()
ErrorBoundary.getDerivedStateFromProps(
props: ErrorBoundaryProps,
state: State,
): Partial<State> | nullReact's hook: a new resetKey clears a caught error.
Parameters
| Name | Type | Description |
|---|---|---|
| props | ErrorBoundaryProps | The new props. |
| state | State | The state now. |
Returns
Partial<State> | nullInterfaces#
ErrorBoundaryPropsInterface#
Props for ErrorBoundary.
interface ErrorBoundaryPropsProperties
| Name | Type | Description |
|---|---|---|
| actions? | ReactNode | Extra buttons next to "Try again" in the default fallback (the root's "Reload window"). |
| children | ReactNode | The region. |
| className? | string | The default fallback's container classes: it takes the region's place in the layout. |
| fallback? | ((props: ErrorFallbackProps) => ReactNode) | null | Replaces the default fallback. |
| framed? | boolean | Default fallback drawn as a tray; off on a surface that already is one. |
| region | string | Names the region in the log and in the fallback ("Sidebar", "Side panel"). |
| resetKey? | unknown | Clears a caught error when it changes (compared with |
ErrorDetailsPropsInterface#
Props for ErrorDetails.
interface ErrorDetailsPropsProperties
| Name | Type | Description |
|---|---|---|
| componentStack | string | null | React's component stack, once known. |
| error | unknown | What was thrown. |
ErrorFallbackFramePropsInterface#
Props for ErrorFallback.
interface ErrorFallbackFrameProps extends ErrorFallbackPropsProperties
| Name | Type | Description |
|---|---|---|
| actions? | ReactNode | Extra buttons next to "Try again". |
| className? | string | The container's classes. |
componentStackfrom ErrorFallbackProps | string | null | React's component stack, once known. |
errorfrom ErrorFallbackProps | unknown | What was thrown. |
| framed? | boolean | Drawn as a tray (default true). |
| region | string | Names the region ("Sidebar"). |
resetfrom ErrorFallbackProps | () => void | Clears the error and renders the region again. |
ErrorFallbackPropsInterface#
What a fallback receives.
interface ErrorFallbackPropsProperties
| Name | Type | Description |
|---|---|---|
| componentStack | string | null | React's component stack, once known. |
| error | unknown | What was thrown. |
| reset | () => void | Clears the error and renders the region again. |