/

<ErrorView> Component

A component used to display an error view, within layouts that use g-grid-container.

Share
Code Editor


<ErrorView statusCode={404} />

useErrorPageAnalytics

This component leverages a useErrorPageAnalytics hook internally, which reports the page error using window.location.track().

Note that window.location.track() is initialized in ConsentManager.

This hook is intended for use cases where the opinionated, g-grid-container-based styles of the default ErrorView component are not suited to a project.

/**
 * eg 404.tsx or 500.tsx
 * ref: https://nextjs.org/docs/advanced-features/custom-error-page
 */
import { useErrorPageAnalytics } from '@hashicorp/react-error-view'
import s from './custom-styles.module.css'
 
export default function CustomFourOhFourPage(): React.ReactElement {
  useErrorPageAnalytics(404)
 
  return (
    <p>
      Oops, something went wrong! We logged an error. Please enjoy this "Back to
      Home" link.
    </p>
  )
}

Where it's used

Latest:0.2.0
Search with

Releases

Latest:0.2.0
registry.npmjs.org
[object Object]
0.x.x
Loading 0.x.x releases...

Props

NameDescription
statusCode
number
Integer representing an HTTP response status code. Passing 404 will render "Not Found" vibes, passing any other error code will render generic error vibes.

Examples

statusCode={404}

Share
Code Editor


<ErrorView statusCode={404} />

Fallback (for 500 pages, and any non-404 statusCode)

Share
Code Editor


<ErrorView statusCode={500} />