diff --git a/packages/core/src/layout/ErrorBoundary/ErrorBoundary.js b/packages/core/src/layout/ErrorBoundary/ErrorBoundary.tsx similarity index 67% rename from packages/core/src/layout/ErrorBoundary/ErrorBoundary.js rename to packages/core/src/layout/ErrorBoundary/ErrorBoundary.tsx index f9d5ec052a..34a903480e 100644 --- a/packages/core/src/layout/ErrorBoundary/ErrorBoundary.js +++ b/packages/core/src/layout/ErrorBoundary/ErrorBoundary.tsx @@ -14,16 +14,28 @@ * limitations under the License. */ -import React, { Component } from 'react'; +import React, { ComponentClass, Component, SFC } from 'react'; -export default class ErrorBoundary extends Component { +type Props = { + slackChannel: string; + onError?: (error: Error, errorInfo: string) => null; +}; + +type State = { + error?: Error; + errorInfo?: string; +}; + +const ErrorBoundary: ComponentClass< + Props, + State +> = class ErrorBoundary extends Component { constructor(props) { super(props); this.state = { - error: null, - errorInfo: null, - onError: props.onError, + error: undefined, + errorInfo: undefined, }; } @@ -33,8 +45,8 @@ export default class ErrorBoundary extends Component { this.setState({ error, errorInfo }); // Exposed for testing - if (ErrorBoundary.onError) { - ErrorBoundary.onError(error, errorInfo); + if (this.props.onError) { + this.props.onError(error, errorInfo); } } @@ -50,11 +62,17 @@ export default class ErrorBoundary extends Component { ); } -} +}; -// Importing Error would mean importing a lot of stuff -// will take it up in a separate PR -const Error = ({ slackChannel }) => { +export default ErrorBoundary; + +type EProps = { + error?: Error; + errorInfo?: string; + slackChannel: string; +}; + +const Error: SFC = ({ slackChannel }) => { return (
Something went wrong here. Please contact {slackChannel} for help.