Feature/wrap logging * feat: change all logging to go through our own logger function so that we can control log levels * move packages/trpc to using our own logger * merge Approved-by: Linus Flood
44 lines
1.0 KiB
TypeScript
44 lines
1.0 KiB
TypeScript
import * as Sentry from "@sentry/nextjs"
|
|
import React from "react"
|
|
|
|
import { logger } from "@scandic-hotels/common/logger"
|
|
|
|
type ErrorBoundaryProps = {
|
|
children: React.ReactNode
|
|
fallback?: React.ReactNode
|
|
}
|
|
type ErrorBoundaryState = { hasError: boolean; error?: Error }
|
|
|
|
class ErrorBoundary extends React.Component<
|
|
ErrorBoundaryProps,
|
|
ErrorBoundaryState
|
|
> {
|
|
constructor(props: ErrorBoundaryProps) {
|
|
super(props)
|
|
this.state = { hasError: false }
|
|
}
|
|
|
|
static getDerivedStateFromError(error: Error) {
|
|
return { hasError: true, error }
|
|
}
|
|
|
|
componentDidCatch(error: Error, errorInfo: React.ErrorInfo) {
|
|
logger.error("ErrorBoundary caught an error:", error, errorInfo)
|
|
Sentry.captureException(error, { extra: { errorInfo } })
|
|
}
|
|
|
|
render() {
|
|
if (this.state.hasError) {
|
|
if (this.props.fallback) {
|
|
return this.props.fallback
|
|
}
|
|
|
|
// eslint-disable-next-line formatjs/no-literal-string-in-jsx
|
|
return <h2>Something went wrong.</h2>
|
|
}
|
|
return this.props.children
|
|
}
|
|
}
|
|
|
|
export default ErrorBoundary
|