import React from 'react'

import type{ ReactNode } from 'react'

import * as Sentry from '@sentry/react'

import { Error } from '../Error'

interface Props {
  children?: ReactNode,
}

export const ErrorBoundary = ({ children }: Props) => (
  <Sentry.ErrorBoundary fallback={(
    <>
      {children}
      <Error />
    </>
  )}
  >
    { children }
  </Sentry.ErrorBoundary>
)