<!-- BADGES -->
npm install @stoplight/react-error-boundaryThe React error boundary tailored to Stoplight needs, inspired by react-error-boundary.
- Explore the components: Storybook
- View the changelog: Releases
- all the great features provided by react-error-boundary,
- built-in error reporting powered by Sentry,
- supports recovering,
- fallback component can try to recover error boundary.
Supported in modern browsers and node.
``bash`latest stable
yarn add @stoplight/react-error-boundary
You can either make use of:
- withErrorBoundary HOC
`tsx
import { withErrorBoundary } from '@stoplight/react-error-boundary';
const SchemaViewer: React.FunctionComponent<{ schema: unknown }> = ({ schema }) => {
if (typeof schema !== 'object' || schema === null) {
throw new Error('Schema must be an object');
}
if (Object.keys(schema).length === 0) {
throw new Error('Schema cannot be empty');
}
return This is fine.;
};
const MyWrappedComponent = withErrorBoundary(SchemaViewer, {
recoverableProps: ['schema'],
});
const Page = () => (
- ErrorBoundary component
`tsx
import { ErrorBoundary } from '@stoplight/react-error-boundary';const SchemaViewer: React.FunctionComponent<{ schema: unknown }> = ({ schema }) => {
if (typeof schema !== 'object' || schema === null) {
throw new Error('Schema must be an object');
}
if (Object.keys(schema).length === 0) {
throw new Error('Schema cannot be empty');
}
return This is fine.;
};
const Page = () => (
Schema Viewer
);
`$3
1. Clone repo.
2. Create / checkout
feature/{name}, chore/{name}, or fix/{name} branch.
3. Install deps: yarn.
4. Make your changes.
5. Run tests: yarn test.prod.
6. Stage relevant files to git.
7. Commit: yarn commit. _NOTE: Commits that don't follow the conventional format will be rejected. yarn commit creates this format for you, or you can put it together manually and then do a regular git commit._
8. Push: git push.
9. Open PR targeting the master` branch.