Overview

In v1 of Coder, we use a React error boundary to capture runtime exceptions for better presentation and support.

For a demonstration of what this looks like, see the screenshot on our v1 documentation at https://coder.com/docs/coder/latest/feedback#reporting-a-problem

Details

The code for the error boundary is located at product/coder/site/src/AppProviderErrorBoundary.tsx in v1.

This code can't be ported directly, there are some providers and contexts we don't have in v2. For example, the user now comes from xstate.

The error boundary is kept light and just passes information to a pure presentational component. In V1 we called this component Fallback.

Fallback Component

There's a component definition, test and storybook located at product/coder/site/src/pages in V1. There are some fetches and additional logs we populate that may not be applicable yet in V2.

A good start to have the error boundary in place would list just the error and information about the user, and nothing else. Therefore this component can be greatly simplified.