import { Component , ErrorInfo , PropsWithChildren , PropsWithRef , ReactNode } from 'react' ; import { traceError } from '@proton/shared/lib/helpers/sentry' ; import GenericError from '../error/GenericError' ; import { classnames } from '../../helpers' ; interface Props { className ? : string ; small ? : boolean ; resetKey ? : string ; component ? : ReactNode ; onError ? : ( error : Error , info : ErrorInfo ) => void ; } interface State { hasError : boolean ; error ? : Error ; } const initialState = { hasError : false , } ; class ErrorBoundary extends Component < PropsWithRef < PropsWithChildren < Props > > , State > { constructor ( props ) { super ( props ) ; this . state = initialState ; } static getDerivedStateFromError ( error ) { return { hasError : true , error } ; } componentDidUpdate ( prevProps ) { const { props , state } = this ; if ( state . hasError && prevProps . resetKey !== props . resetKey ) { this . setState ( initialState ) ; } } componentDidCatch ( error , info ) { const { props } = this ; props . onError ?. ( error , info ) ; traceError ( error ) ; console . error ( error ) ; } render ( ) { const { state , props } = this ; if ( ! state . hasError ) { return props . children ; } return ( props . component || ( < GenericError className = { classnames ( [ props . small ? 'p1' : 'p2' , props . className ] ) } small = { props . small } / > ) ) ; } } export default ErrorBoundary ;