EuiErrorBoundary: converted to Typescript (#2690)

* Converts EuiErrorBoundary to Typescript * Adds PR number to the CHANGELOG line * Fixes as requested in PR review * Fixes as requested in the review * Removes Error interface * Fixes what was asked in the review * Exports EuiErrorBoundaryProps
elastic · Dec 26, 2019 · cc2ee15 · cc2ee15
1 parent e1a7c10
commit cc2ee15
Show file tree

Hide file tree

Showing 8 changed files with 21 additions and 16 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -2,6 +2,7 @@
 
 - Added `nested` glyph to `EuiIcon` ([#2707](https://github.com/elastic/eui/pull/2707))
 - Added `tableLayout` prop to `EuiTable`, `EuiBasicTable` and `EuiInMemoryTable` to provide the option of auto layout ([#2697](https://github.com/elastic/eui/pull/2697))
+- Converted `EuiErrorBoundary` to Typescript  ([#2690](https://github.com/elastic/eui/pull/2690))
 
 **Bug fixes**
 

diff --git a/...__snapshots__/error_boundary.test.js.snap → ..._snapshots__/error_boundary.test.tsx.snap b/...__snapshots__/error_boundary.test.js.snap → ..._snapshots__/error_boundary.test.tsx.snap
diff --git a/...nts/error_boundary/error_boundary.test.js → ...ts/error_boundary/error_boundary.test.tsx b/...nts/error_boundary/error_boundary.test.js → ...ts/error_boundary/error_boundary.test.tsx
diff --git a/...mponents/error_boundary/error_boundary.js → ...ponents/error_boundary/error_boundary.tsx b/...mponents/error_boundary/error_boundary.js → ...ponents/error_boundary/error_boundary.tsx
@@ -1,23 +1,37 @@
-import React, { Component } from 'react';
+import React, { Component, HTMLAttributes } from 'react';
+import { CommonProps } from '../common';
 import PropTypes from 'prop-types';
 
 import { EuiText } from '../text';
 
-export class EuiErrorBoundary extends Component {
+interface EuiErrorBoundaryState {
+  hasError: boolean;
+  error?: Error;
+}
+
+export type EuiErrorBoundaryProps = CommonProps &
+  HTMLAttributes<HTMLDivElement>;
+
+export class EuiErrorBoundary extends Component<
+  EuiErrorBoundaryProps,
+  EuiErrorBoundaryState
+> {
   static propTypes = {
     children: PropTypes.node,
   };
 
-  constructor(props) {
+  constructor(props: EuiErrorBoundaryProps) {
     super(props);
 
-    this.state = {
+    const errorState: EuiErrorBoundaryState = {
       hasError: false,
       error: undefined,
     };
+
+    this.state = errorState;
   }
 
-  componentDidCatch(error) {
+  componentDidCatch(error: Error) {
     // Display fallback UI
     this.setState({
       hasError: true,

diff --git a/src/components/error_boundary/index.d.ts b/src/components/error_boundary/index.d.ts
diff --git a/src/components/error_boundary/index.js b/src/components/error_boundary/index.js
diff --git a/src/components/error_boundary/index.ts b/src/components/error_boundary/index.ts
@@ -0,0 +1 @@
+export { EuiErrorBoundary, EuiErrorBoundaryProps } from './error_boundary';
diff --git a/src/components/index.d.ts b/src/components/index.d.ts
@@ -1,7 +1,6 @@
 /// <reference path="./code/index.d.ts" />
 /// <reference path="./combo_box/index.d.ts" />
 /// <reference path="./date_picker/index.d.ts" />
-/// <reference path="./error_boundary/index.d.ts" />
 /// <reference path="./filter_group/index.d.ts" />
 /// <reference path="./form/index.d.ts" />
 /// <reference path="./modal/index.d.ts" />
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1 @@
		export { EuiErrorBoundary, EuiErrorBoundaryProps } from './error_boundary';