import { css } from "emotion" ; import React from "react" ; interface Props { errorMsg : string ; } interface State { hasError : boolean ; } class ErrorBoundary extends React . Component < Props , State > { state : State = { hasError : false , } ; static getDerivedStateFromError ( _error ) { return { hasError : true } ; } componentDidCatch ( error , errorInfo ) { console . log ( error , errorInfo ) ; } render ( ) { if ( this . state . hasError ) { return ( < div className = { css `
            padding: 1rem;
            text-align: center;
          ` } > < h4 > Something went wrong < /h4> < p > { this . props . errorMsg } < /p> < /div>); } return this . props . children ; } } export default ErrorBoundary ;