diff --git a/.eslintrc.js b/.eslintrc.js index 22d8e67ea702..9c81ba6efbd2 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -55,6 +55,207 @@ module.exports = { extends: ['@elastic/eslint-config-kibana', 'plugin:@elastic/eui/recommended'], overrides: [ + /** + * Temporarily disable some react rules for specific plugins, remove in separate PRs + */ + { + files: ['packages/kbn-ui-framework/**/*.{js,ts,tsx}'], + rules: { + 'jsx-a11y/no-onchange': 'off', + }, + }, + { + files: ['src/core/public/application/**/*.{js,ts,tsx}'], + rules: { + 'react/no-danger': 'off', + }, + }, + { + files: ['src/legacy/core_plugins/console/**/*.{js,ts,tsx}'], + rules: { + 'react-hooks/exhaustive-deps': 'off', + }, + }, + { + files: ['src/legacy/core_plugins/data/**/*.{js,ts,tsx}'], + rules: { + 'react-hooks/exhaustive-deps': 'off', + }, + }, + { + files: ['src/legacy/core_plugins/expressions/**/*.{js,ts,tsx}'], + rules: { + 'react-hooks/exhaustive-deps': 'off', + }, + }, + { + files: ['src/legacy/core_plugins/kbn_vislib_vis_types/**/*.{js,ts,tsx}'], + rules: { + 'react-hooks/exhaustive-deps': 'off', + }, + }, + { + files: ['src/legacy/core_plugins/kibana/**/*.{js,ts,tsx}'], + rules: { + 'react-hooks/rules-of-hooks': 'off', + 'react-hooks/exhaustive-deps': 'off', + }, + }, + { + files: ['src/legacy/core_plugins/tile_map/**/*.{js,ts,tsx}'], + rules: { + 'react-hooks/exhaustive-deps': 'off', + }, + }, + { + files: ['src/legacy/core_plugins/vis_type_markdown/**/*.{js,ts,tsx}'], + rules: { + 'react-hooks/exhaustive-deps': 'off', + }, + }, + { + files: ['src/legacy/core_plugins/vis_type_metric/**/*.{js,ts,tsx}'], + rules: { + 'jsx-a11y/click-events-have-key-events': 'off', + }, + }, + { + files: ['src/legacy/core_plugins/vis_type_table/**/*.{js,ts,tsx}'], + rules: { + 'react-hooks/exhaustive-deps': 'off', + }, + }, + { + files: ['src/legacy/core_plugins/vis_type_vega/**/*.{js,ts,tsx}'], + rules: { + 'react-hooks/exhaustive-deps': 'off', + }, + }, + { + files: ['src/legacy/ui/public/vis/**/*.{js,ts,tsx}'], + rules: { + 'react-hooks/exhaustive-deps': 'off', + }, + }, + { + files: ['src/plugins/es_ui_shared/**/*.{js,ts,tsx}'], + rules: { + 'react-hooks/exhaustive-deps': 'off', + }, + }, + { + files: ['src/plugins/eui_utils/**/*.{js,ts,tsx}'], + rules: { + 'react-hooks/exhaustive-deps': 'off', + }, + }, + { + files: ['src/plugins/kibana_react/**/*.{js,ts,tsx}'], + rules: { + 'react-hooks/rules-of-hooks': 'off', + 'react-hooks/exhaustive-deps': 'off', + }, + }, + { + files: ['src/plugins/kibana_utils/**/*.{js,ts,tsx}'], + rules: { + 'react-hooks/exhaustive-deps': 'off', + }, + }, + { + files: ['x-pack/legacy/plugins/canvas/**/*.{js,ts,tsx}'], + rules: { + 'react-hooks/exhaustive-deps': 'off', + 'jsx-a11y/click-events-have-key-events': 'off', + }, + }, + { + files: ['x-pack/legacy/plugins/cross_cluster_replication/**/*.{js,ts,tsx}'], + rules: { + 'jsx-a11y/click-events-have-key-events': 'off', + }, + }, + { + files: ['x-pack/legacy/plugins/graph/**/*.{js,ts,tsx}'], + rules: { + 'react-hooks/exhaustive-deps': 'off', + }, + }, + { + files: ['x-pack/legacy/plugins/index_management/**/*.{js,ts,tsx}'], + rules: { + 'react-hooks/exhaustive-deps': 'off', + 'react-hooks/rules-of-hooks': 'off', + }, + }, + { + files: ['x-pack/legacy/plugins/infra/**/*.{js,ts,tsx}'], + rules: { + 'react-hooks/exhaustive-deps': 'off', + 'react-hooks/rules-of-hooks': 'off', + }, + }, + { + files: ['x-pack/legacy/plugins/lens/**/*.{js,ts,tsx}'], + rules: { + 'react-hooks/exhaustive-deps': 'off', + 'react-hooks/rules-of-hooks': 'off', + }, + }, + { + files: ['x-pack/legacy/plugins/ml/**/*.{js,ts,tsx}'], + rules: { + 'react-hooks/exhaustive-deps': 'off', + 'react-hooks/rules-of-hooks': 'off', + 'jsx-a11y/click-events-have-key-events': 'off', + }, + }, + { + files: ['x-pack/legacy/plugins/monitoring/**/*.{js,ts,tsx}'], + rules: { + 'jsx-a11y/click-events-have-key-events': 'off', + }, + }, + { + files: ['x-pack/legacy/plugins/siem/**/*.{js,ts,tsx}'], + rules: { + 'react-hooks/exhaustive-deps': 'off', + 'react-hooks/rules-of-hooks': 'off', + }, + }, + { + files: ['x-pack/legacy/plugins/snapshot_restore/**/*.{js,ts,tsx}'], + rules: { + 'react-hooks/exhaustive-deps': 'off', + }, + }, + { + files: ['x-pack/legacy/plugins/spaces/**/*.{js,ts,tsx}'], + rules: { + 'react-hooks/exhaustive-deps': 'off', + }, + }, + { + files: ['x-pack/legacy/plugins/transform/**/*.{js,ts,tsx}'], + rules: { + 'react-hooks/exhaustive-deps': 'off', + }, + }, + { + files: ['x-pack/legacy/plugins/uptime/**/*.{js,ts,tsx}'], + rules: { + 'react-hooks/exhaustive-deps': 'off', + 'react-hooks/rules-of-hooks': 'off', + }, + }, + { + files: ['x-pack/legacy/plugins/watcher/**/*.{js,ts,tsx}'], + rules: { + 'react-hooks/rules-of-hooks': 'off', + 'react-hooks/exhaustive-deps': 'off', + }, + }, + /** * Prettier */ diff --git a/packages/eslint-config-kibana/.eslintrc.js b/packages/eslint-config-kibana/.eslintrc.js index 4412ce81368a..36f0b95c8e69 100644 --- a/packages/eslint-config-kibana/.eslintrc.js +++ b/packages/eslint-config-kibana/.eslintrc.js @@ -3,6 +3,7 @@ module.exports = { './javascript.js', './typescript.js', './jest.js', + './react.js', ], plugins: ['@kbn/eslint-plugin-eslint'], diff --git a/packages/eslint-config-kibana/javascript.js b/packages/eslint-config-kibana/javascript.js index 8462da5cac80..0c79669c15e7 100644 --- a/packages/eslint-config-kibana/javascript.js +++ b/packages/eslint-config-kibana/javascript.js @@ -1,6 +1,3 @@ -const semver = require('semver'); -const { readdirSync } = require('fs'); -const PKG = require('../../package.json'); const RESTRICTED_GLOBALS = require('./restricted_globals'); const RESTRICTED_MODULES = { paths: ['gulp-util'] }; @@ -16,18 +13,12 @@ module.exports = { plugins: [ 'mocha', 'babel', - 'react', - 'react-hooks', 'import', 'no-unsanitized', 'prefer-object-spread', - 'jsx-a11y', ], settings: { - react: { - version: semver.valid(semver.coerce(PKG.dependencies.react)), - }, 'import/resolver': { '@kbn/eslint-import-resolver-kibana': { forceNode: true, @@ -120,64 +111,6 @@ module.exports = { 'object-curly-spacing': 'off', // overridden with babel/object-curly-spacing 'babel/object-curly-spacing': [ 'error', 'always' ], - 'jsx-quotes': ['error', 'prefer-double'], - 'react/jsx-uses-react': 'error', - 'react/react-in-jsx-scope': 'error', - 'react/jsx-uses-vars': 'error', - 'react/jsx-no-undef': 'error', - 'react/jsx-pascal-case': 'error', - 'react/jsx-closing-bracket-location': ['error', 'line-aligned'], - 'react/jsx-closing-tag-location': 'error', - 'react/jsx-curly-spacing': ['error', 'never', { allowMultiline: true }], - 'react/jsx-indent-props': ['error', 2], - 'react/jsx-max-props-per-line': ['error', { maximum: 1, when: 'multiline' }], - 'react/jsx-no-duplicate-props': ['error', { ignoreCase: true }], - 'react/no-danger': 'error', - 'react/self-closing-comp': 'error', - 'react/jsx-wrap-multilines': ['error', { - declaration: true, - assignment: true, - return: true, - arrow: true, - }], - 'react/jsx-first-prop-new-line': ['error', 'multiline-multiprop'], - 'react-hooks/rules-of-hooks': 'error', // Checks rules of Hooks - 'react-hooks/exhaustive-deps': 'warn', // Checks effect dependencies - 'jsx-a11y/accessible-emoji': 'error', - 'jsx-a11y/alt-text': 'error', - 'jsx-a11y/anchor-has-content': 'error', - 'jsx-a11y/aria-activedescendant-has-tabindex': 'error', - 'jsx-a11y/aria-props': 'error', - 'jsx-a11y/aria-proptypes': 'error', - 'jsx-a11y/aria-role': 'error', - 'jsx-a11y/aria-unsupported-elements': 'error', - 'jsx-a11y/heading-has-content': 'error', - 'jsx-a11y/html-has-lang': 'error', - 'jsx-a11y/iframe-has-title': 'error', - 'jsx-a11y/interactive-supports-focus': 'error', - 'jsx-a11y/media-has-caption': 'error', - 'jsx-a11y/mouse-events-have-key-events': 'error', - 'jsx-a11y/no-access-key': 'error', - 'jsx-a11y/no-distracting-elements': 'error', - 'jsx-a11y/no-interactive-element-to-noninteractive-role': 'error', - 'jsx-a11y/no-noninteractive-element-interactions': 'error', - 'jsx-a11y/no-noninteractive-element-to-interactive-role': 'error', - 'jsx-a11y/no-redundant-roles': 'error', - 'jsx-a11y/role-has-required-aria-props': 'error', - 'jsx-a11y/role-supports-aria-props': 'error', - 'jsx-a11y/scope': 'error', - 'jsx-a11y/tabindex-no-positive': 'error', - 'jsx-a11y/label-has-associated-control': 'error', - 'react/jsx-equals-spacing': ['error', 'never'], - 'react/jsx-indent': ['error', 2], - 'react/no-will-update-set-state': 'error', - 'react/no-is-mounted': 'error', - 'react/no-multi-comp': ['error', { ignoreStateless: true }], - 'react/no-unknown-property': 'error', - 'react/prefer-es6-class': ['error', 'always'], - 'react/prefer-stateless-function': ['error', { ignorePureComponents: true }], - 'react/no-unescaped-entities': 'error', - 'mocha/handle-done-callback': 'error', 'mocha/no-exclusive-tests': 'error', diff --git a/packages/eslint-config-kibana/react.js b/packages/eslint-config-kibana/react.js new file mode 100644 index 000000000000..163bd6ca73a0 --- /dev/null +++ b/packages/eslint-config-kibana/react.js @@ -0,0 +1,84 @@ +const semver = require('semver') +const PKG = require('../../package.json') + +module.exports = { + plugins: [ + 'react', + 'react-hooks', + 'jsx-a11y', + ], + + parserOptions: { + ecmaFeatures: { + jsx: true + } + }, + + settings: { + react: { + version: semver.valid(semver.coerce(PKG.dependencies.react)), + }, + }, + + rules: { + 'jsx-quotes': ['error', 'prefer-double'], + 'react/jsx-uses-react': 'error', + 'react/react-in-jsx-scope': 'error', + 'react/jsx-uses-vars': 'error', + 'react/jsx-no-undef': 'error', + 'react/jsx-pascal-case': 'error', + 'react/jsx-closing-bracket-location': ['error', 'line-aligned'], + 'react/jsx-closing-tag-location': 'error', + 'react/jsx-curly-spacing': ['error', 'never', { allowMultiline: true }], + 'react/jsx-indent-props': ['error', 2], + 'react/jsx-max-props-per-line': ['error', { maximum: 1, when: 'multiline' }], + 'react/jsx-no-duplicate-props': ['error', { ignoreCase: true }], + 'react/no-danger': 'error', + 'react/self-closing-comp': 'error', + 'react/jsx-wrap-multilines': ['error', { + declaration: true, + assignment: true, + return: true, + arrow: true, + }], + 'react/jsx-first-prop-new-line': ['error', 'multiline-multiprop'], + 'react-hooks/rules-of-hooks': 'error', // Checks rules of Hooks + 'react-hooks/exhaustive-deps': 'error', // Checks effect dependencies + 'jsx-a11y/accessible-emoji': 'error', + 'jsx-a11y/alt-text': 'error', + 'jsx-a11y/anchor-has-content': 'error', + 'jsx-a11y/aria-activedescendant-has-tabindex': 'error', + 'jsx-a11y/aria-props': 'error', + 'jsx-a11y/aria-proptypes': 'error', + 'jsx-a11y/aria-role': 'error', + 'jsx-a11y/aria-unsupported-elements': 'error', + 'jsx-a11y/click-events-have-key-events': 'error', + 'jsx-a11y/heading-has-content': 'error', + 'jsx-a11y/html-has-lang': 'error', + 'jsx-a11y/iframe-has-title': 'error', + 'jsx-a11y/interactive-supports-focus': 'error', + 'jsx-a11y/label-has-associated-control': 'error', + 'jsx-a11y/media-has-caption': 'error', + 'jsx-a11y/mouse-events-have-key-events': 'error', + 'jsx-a11y/no-access-key': 'error', + 'jsx-a11y/no-distracting-elements': 'error', + 'jsx-a11y/no-interactive-element-to-noninteractive-role': 'error', + 'jsx-a11y/no-noninteractive-element-interactions': 'error', + 'jsx-a11y/no-noninteractive-element-to-interactive-role': 'error', + 'jsx-a11y/no-onchange': 'error', + 'jsx-a11y/no-redundant-roles': 'error', + 'jsx-a11y/role-has-required-aria-props': 'error', + 'jsx-a11y/role-supports-aria-props': 'error', + 'jsx-a11y/scope': 'error', + 'jsx-a11y/tabindex-no-positive': 'error', + 'react/jsx-equals-spacing': ['error', 'never'], + 'react/jsx-indent': ['error', 2], + 'react/no-will-update-set-state': 'error', + 'react/no-is-mounted': 'error', + 'react/no-multi-comp': ['error', { ignoreStateless: true }], + 'react/no-unknown-property': 'error', + 'react/prefer-es6-class': ['error', 'always'], + 'react/prefer-stateless-function': ['error', { ignorePureComponents: true }], + 'react/no-unescaped-entities': 'error', + }, +} diff --git a/packages/eslint-config-kibana/typescript.js b/packages/eslint-config-kibana/typescript.js index 7653c9bb0c33..757616f36180 100644 --- a/packages/eslint-config-kibana/typescript.js +++ b/packages/eslint-config-kibana/typescript.js @@ -18,7 +18,6 @@ module.exports = { '@typescript-eslint', 'ban', 'import', - 'jsx-a11y', 'prefer-object-spread', ], @@ -171,33 +170,6 @@ module.exports = { {'name': ['test', 'only'], 'message': 'No exclusive tests.'}, ], - 'jsx-a11y/accessible-emoji': 'error', - 'jsx-a11y/alt-text': 'error', - 'jsx-a11y/anchor-has-content': 'error', - 'jsx-a11y/aria-activedescendant-has-tabindex': 'error', - 'jsx-a11y/aria-props': 'error', - 'jsx-a11y/aria-proptypes': 'error', - 'jsx-a11y/aria-role': 'error', - 'jsx-a11y/aria-unsupported-elements': 'error', - 'jsx-a11y/click-events-have-key-events': 'error', - 'jsx-a11y/heading-has-content': 'error', - 'jsx-a11y/html-has-lang': 'error', - 'jsx-a11y/iframe-has-title': 'error', - 'jsx-a11y/interactive-supports-focus': 'error', - 'jsx-a11y/media-has-caption': 'error', - 'jsx-a11y/mouse-events-have-key-events': 'error', - 'jsx-a11y/no-access-key': 'error', - 'jsx-a11y/no-distracting-elements': 'error', - 'jsx-a11y/no-interactive-element-to-noninteractive-role': 'error', - 'jsx-a11y/no-noninteractive-element-interactions': 'error', - 'jsx-a11y/no-noninteractive-element-to-interactive-role': 'error', - 'jsx-a11y/no-onchange': 'error', - 'jsx-a11y/no-redundant-roles': 'error', - 'jsx-a11y/role-has-required-aria-props': 'error', - 'jsx-a11y/role-supports-aria-props': 'error', - 'jsx-a11y/scope': 'error', - 'jsx-a11y/tabindex-no-positive': 'error', - 'jsx-a11y/label-has-associated-control': 'error', 'import/no-default-export': 'error', }, eslintConfigPrettierTypescriptEslintRules diff --git a/src/core/public/rendering/rendering_service.test.tsx b/src/core/public/rendering/rendering_service.test.tsx index 317ab5cc8b85..ed835574a32f 100644 --- a/src/core/public/rendering/rendering_service.test.tsx +++ b/src/core/public/rendering/rendering_service.test.tsx @@ -34,7 +34,7 @@ describe('RenderingService#start', () => { const chrome = chromeServiceMock.createStartContract(); chrome.getHeaderComponent.mockReturnValue(
Hello chrome!
); const overlays = overlayServiceMock.createStartContract(); - overlays.banners.getComponent.mockReturnValue(
I'm a banner!
); + overlays.banners.getComponent.mockReturnValue(
I'm a banner!
); const injectedMetadata = injectedMetadataServiceMock.createStartContract(); injectedMetadata.getLegacyMode.mockReturnValue(legacyMode); diff --git a/src/legacy/core_plugins/data/public/search/search_bar/components/search_bar.test.tsx b/src/legacy/core_plugins/data/public/search/search_bar/components/search_bar.test.tsx index 62b60fa262cb..9b77ec369c55 100644 --- a/src/legacy/core_plugins/data/public/search/search_bar/components/search_bar.test.tsx +++ b/src/legacy/core_plugins/data/public/search/search_bar/components/search_bar.test.tsx @@ -33,14 +33,14 @@ const timefilterSetupMock = timefilterServiceMock.createSetupContract(); jest.mock('../../../../../data/public', () => { return { - FilterBar: () =>
, - QueryBarInput: () =>
, + FilterBar: () =>
, + QueryBarInput: () =>
, }; }); jest.mock('../../../query/query_bar', () => { return { - QueryBarTopRow: () =>
, + QueryBarTopRow: () =>
, }; }); diff --git a/src/legacy/core_plugins/data/public/search/search_bar/components/search_bar.tsx b/src/legacy/core_plugins/data/public/search/search_bar/components/search_bar.tsx index a03019da4e0d..c7f8b02caf85 100644 --- a/src/legacy/core_plugins/data/public/search/search_bar/components/search_bar.tsx +++ b/src/legacy/core_plugins/data/public/search/search_bar/components/search_bar.tsx @@ -368,7 +368,7 @@ class SearchBarUI extends Component { onLoad={this.onLoadSavedQuery} savedQueryService={this.savedQueryService} onClearSavedQuery={this.props.onClearSavedQuery} - > + /> ); let queryBar; diff --git a/src/legacy/core_plugins/kbn_doc_views/public/views/table/table_row.tsx b/src/legacy/core_plugins/kbn_doc_views/public/views/table/table_row.tsx index 1d979f82d39d..045e8093124a 100644 --- a/src/legacy/core_plugins/kbn_doc_views/public/views/table/table_row.tsx +++ b/src/legacy/core_plugins/kbn_doc_views/public/views/table/table_row.tsx @@ -100,6 +100,7 @@ export function DocViewTableRow({ * Justification for dangerouslySetInnerHTML: * We just use values encoded by our field formatters */ + // eslint-disable-next-line react/no-danger dangerouslySetInnerHTML={{ __html: value as string }} /> diff --git a/src/legacy/core_plugins/kibana/public/discover/angular/doc_table/components/pager/tool_bar_pager_buttons.tsx b/src/legacy/core_plugins/kibana/public/discover/angular/doc_table/components/pager/tool_bar_pager_buttons.tsx index 6ce987028c19..3edcda8c3bea 100644 --- a/src/legacy/core_plugins/kibana/public/discover/angular/doc_table/components/pager/tool_bar_pager_buttons.tsx +++ b/src/legacy/core_plugins/kibana/public/discover/angular/doc_table/components/pager/tool_bar_pager_buttons.tsx @@ -34,7 +34,7 @@ export function ToolBarPagerButtons(props: Props) { disabled={!props.hasPreviousPage} data-test-subj="btnPrevPage" > - +
); diff --git a/src/legacy/core_plugins/navigation/public/top_nav_menu/top_nav_menu.test.tsx b/src/legacy/core_plugins/navigation/public/top_nav_menu/top_nav_menu.test.tsx index 803119bdac11..4f8c5d11f191 100644 --- a/src/legacy/core_plugins/navigation/public/top_nav_menu/top_nav_menu.test.tsx +++ b/src/legacy/core_plugins/navigation/public/top_nav_menu/top_nav_menu.test.tsx @@ -29,7 +29,7 @@ jest.mock('ui/new_platform'); const dataShim = { ui: { - SearchBar: () =>
, + SearchBar: () =>
, }, }; diff --git a/src/legacy/ui/public/capabilities/react/inject_ui_capabilities.test.tsx b/src/legacy/ui/public/capabilities/react/inject_ui_capabilities.test.tsx index dccea2f61d56..ff46b6ec34a8 100644 --- a/src/legacy/ui/public/capabilities/react/inject_ui_capabilities.test.tsx +++ b/src/legacy/ui/public/capabilities/react/inject_ui_capabilities.test.tsx @@ -77,6 +77,7 @@ describe('injectUICapabilities', () => { uiCapabilities: UICapabilities; } + // eslint-disable-next-line react/prefer-stateless-function class MyClassComponent extends React.Component { public render() { return {this.props.uiCapabilities.uiCapability2.nestedProp}; diff --git a/src/legacy/ui/public/capabilities/react/legacy/inject_ui_capabilities.test.tsx b/src/legacy/ui/public/capabilities/react/legacy/inject_ui_capabilities.test.tsx index 21f96cf918af..76f1dd801631 100644 --- a/src/legacy/ui/public/capabilities/react/legacy/inject_ui_capabilities.test.tsx +++ b/src/legacy/ui/public/capabilities/react/legacy/inject_ui_capabilities.test.tsx @@ -77,6 +77,7 @@ describe('injectUICapabilities', () => { uiCapabilities: UICapabilities; } + // eslint-disable-next-line react/prefer-stateless-function class MyClassComponent extends React.Component { public render() { return {this.props.uiCapabilities.uiCapability2.nestedProp}; diff --git a/src/legacy/ui/public/capabilities/react/ui_capabilities_provider.tsx b/src/legacy/ui/public/capabilities/react/ui_capabilities_provider.tsx index fb6a1dc55c29..387114710743 100644 --- a/src/legacy/ui/public/capabilities/react/ui_capabilities_provider.tsx +++ b/src/legacy/ui/public/capabilities/react/ui_capabilities_provider.tsx @@ -17,22 +17,14 @@ * under the License. */ -import React, { ReactNode } from 'react'; +import React from 'react'; import { UICapabilitiesContext } from './ui_capabilities_context'; import { capabilities } from '..'; -interface Props { - children: ReactNode; -} +export const UICapabilitiesProvider: React.SFC = props => ( + + {props.children} + +); -export class UICapabilitiesProvider extends React.Component { - public static displayName: string = 'UICapabilitiesProvider'; - - public render() { - return ( - - {this.props.children} - - ); - } -} +UICapabilitiesProvider.displayName = 'UICapabilitiesProvider'; diff --git a/src/legacy/ui/public/vis/editors/default/components/agg.test.tsx b/src/legacy/ui/public/vis/editors/default/components/agg.test.tsx index 5dfb14156dee..7806b1c0f78f 100644 --- a/src/legacy/ui/public/vis/editors/default/components/agg.test.tsx +++ b/src/legacy/ui/public/vis/editors/default/components/agg.test.tsx @@ -156,7 +156,7 @@ describe('DefaultEditorAgg component', () => { it('should add schema component', () => { defaultProps.agg.schema = { - editorComponent: () =>
, + editorComponent: () =>
, } as any; const comp = mount(); diff --git a/src/plugins/kibana_react/public/ui_settings/use_ui_setting.test.tsx b/src/plugins/kibana_react/public/ui_settings/use_ui_setting.test.tsx index cc2a8c3fbe1f..badf568ccc19 100644 --- a/src/plugins/kibana_react/public/ui_settings/use_ui_setting.test.tsx +++ b/src/plugins/kibana_react/public/ui_settings/use_ui_setting.test.tsx @@ -106,7 +106,7 @@ describe('useUiSetting', () => { }); describe('useUiSetting$', () => { - const TestConsumer$: React.FC<{ + const TestConsumer: React.FC<{ setting: string; newValue?: string; }> = ({ setting, newValue = '' }) => { @@ -126,7 +126,7 @@ describe('useUiSetting$', () => { ReactDOM.render( - + , container ); @@ -143,7 +143,7 @@ describe('useUiSetting$', () => { ReactDOM.render( - + , container ); @@ -159,7 +159,7 @@ describe('useUiSetting$', () => { ReactDOM.render( - + , container ); @@ -174,7 +174,7 @@ describe('useUiSetting$', () => { ReactDOM.render( - + , container ); diff --git a/test/plugin_functional/plugins/core_plugin_a/public/application.tsx b/test/plugin_functional/plugins/core_plugin_a/public/application.tsx index 5d464cf0405d..7c1406f5b20c 100644 --- a/test/plugin_functional/plugins/core_plugin_a/public/application.tsx +++ b/test/plugin_functional/plugins/core_plugin_a/public/application.tsx @@ -76,7 +76,7 @@ const PageA = () => ( - Page A's content goes here + Page A's content goes here ); diff --git a/test/plugin_functional/plugins/kbn_tp_top_nav/public/top_nav.tsx b/test/plugin_functional/plugins/kbn_tp_top_nav/public/top_nav.tsx index d56ac5f92db8..8678ab705df9 100644 --- a/test/plugin_functional/plugins/kbn_tp_top_nav/public/top_nav.tsx +++ b/test/plugin_functional/plugins/kbn_tp_top_nav/public/top_nav.tsx @@ -17,7 +17,7 @@ * under the License. */ -import React, { Component } from 'react'; +import React from 'react'; import { setup as navSetup, start as navStart, @@ -33,22 +33,21 @@ const customExtension = { navSetup.registerMenuItem(customExtension); -export class AppWithTopNav extends Component { - public render() { - const { TopNavMenu } = navStart.ui; - const config = [ - { - id: 'new', - label: 'New Button', - description: 'New Demo', - run() {}, - testId: 'demoNewButton', - }, - ]; - return ( - - Hey - - ); - } -} +export const AppWithTopNav = () => { + const { TopNavMenu } = navStart.ui; + const config = [ + { + id: 'new', + label: 'New Button', + description: 'New Demo', + run() {}, + testId: 'demoNewButton', + }, + ]; + + return ( + + Hey + + ); +}; diff --git a/test/plugin_functional/plugins/search_explorer/public/demo_strategy.tsx b/test/plugin_functional/plugins/search_explorer/public/demo_strategy.tsx index 665b3c9f0ae0..8a0dd31e3595 100644 --- a/test/plugin_functional/plugins/search_explorer/public/demo_strategy.tsx +++ b/test/plugin_functional/plugins/search_explorer/public/demo_strategy.tsx @@ -127,7 +127,7 @@ export class DemoStrategy extends React.Component { }, ]} demo={this.renderDemo()} - > + /> ); } diff --git a/test/plugin_functional/plugins/search_explorer/public/es_strategy.tsx b/test/plugin_functional/plugins/search_explorer/public/es_strategy.tsx index 20de631bc560..d35c67191a1f 100644 --- a/test/plugin_functional/plugins/search_explorer/public/es_strategy.tsx +++ b/test/plugin_functional/plugins/search_explorer/public/es_strategy.tsx @@ -139,7 +139,7 @@ export class EsSearchTest extends React.Component { }, ]} demo={this.renderDemo()} - > + /> ); } diff --git a/test/plugin_functional/plugins/search_explorer/public/guide_section.tsx b/test/plugin_functional/plugins/search_explorer/public/guide_section.tsx index fe67e4097b2a..1562e33b14c2 100644 --- a/test/plugin_functional/plugins/search_explorer/public/guide_section.tsx +++ b/test/plugin_functional/plugins/search_explorer/public/guide_section.tsx @@ -110,7 +110,7 @@ export class GuideSection extends React.Component { return code.map((codeBlock, i) => ( - +

{codeBlock.description}

{this.removeLicenseBlock(codeBlock.snippet)} diff --git a/test/plugin_functional/plugins/search_explorer/public/search_api.tsx b/test/plugin_functional/plugins/search_explorer/public/search_api.tsx index 3e4768c87006..8ec6225d1f17 100644 --- a/test/plugin_functional/plugins/search_explorer/public/search_api.tsx +++ b/test/plugin_functional/plugins/search_explorer/public/search_api.tsx @@ -83,5 +83,5 @@ export const SearchApiPage = () => ( ], }, ]} - > + /> ); diff --git a/x-pack/legacy/plugins/apm/public/components/app/ServiceNodeMetrics/index.tsx b/x-pack/legacy/plugins/apm/public/components/app/ServiceNodeMetrics/index.tsx index 2833b0476428..79874d6648d0 100644 --- a/x-pack/legacy/plugins/apm/public/components/app/ServiceNodeMetrics/index.tsx +++ b/x-pack/legacy/plugins/apm/public/components/app/ServiceNodeMetrics/index.tsx @@ -113,7 +113,7 @@ export function ServiceNodeMetrics() { ) }} - > + /> ) : ( @@ -129,7 +129,7 @@ export function ServiceNodeMetrics() { {host} } - > + /> {containerId} } - > + /> )} diff --git a/x-pack/legacy/plugins/apm/public/components/app/TraceOverview/index.tsx b/x-pack/legacy/plugins/apm/public/components/app/TraceOverview/index.tsx index 4f14c4ba8593..1ecf72f6fa3f 100644 --- a/x-pack/legacy/plugins/apm/public/components/app/TraceOverview/index.tsx +++ b/x-pack/legacy/plugins/apm/public/components/app/TraceOverview/index.tsx @@ -49,7 +49,7 @@ export function TraceOverview() { return ( - + diff --git a/x-pack/legacy/plugins/apm/public/components/shared/LocalUIFilters/Filter/FilterBadgeList.tsx b/x-pack/legacy/plugins/apm/public/components/shared/LocalUIFilters/Filter/FilterBadgeList.tsx index a1140dcbbb3f..01d2d56b6d14 100644 --- a/x-pack/legacy/plugins/apm/public/components/shared/LocalUIFilters/Filter/FilterBadgeList.tsx +++ b/x-pack/legacy/plugins/apm/public/components/shared/LocalUIFilters/Filter/FilterBadgeList.tsx @@ -32,7 +32,7 @@ const FilterBadgeList = ({ onRemove, value }: Props) => ( > {val} - + diff --git a/x-pack/legacy/plugins/apm/public/components/shared/LocalUIFilters/Filter/index.tsx b/x-pack/legacy/plugins/apm/public/components/shared/LocalUIFilters/Filter/index.tsx index aef8e5747d99..412b92d525aa 100644 --- a/x-pack/legacy/plugins/apm/public/components/shared/LocalUIFilters/Filter/index.tsx +++ b/x-pack/legacy/plugins/apm/public/components/shared/LocalUIFilters/Filter/index.tsx @@ -168,7 +168,7 @@ const Filter = ({ }} value={value} /> - + ) : null} diff --git a/x-pack/legacy/plugins/apm/public/components/shared/Stacktrace/Variables.tsx b/x-pack/legacy/plugins/apm/public/components/shared/Stacktrace/Variables.tsx index 34c46f84c76b..b66c154e4be3 100644 --- a/x-pack/legacy/plugins/apm/public/components/shared/Stacktrace/Variables.tsx +++ b/x-pack/legacy/plugins/apm/public/components/shared/Stacktrace/Variables.tsx @@ -24,29 +24,27 @@ interface Props { vars: IStackframe['vars']; } -export class Variables extends React.Component { - public render() { - if (!this.props.vars) { - return null; - } - - return ( - - - - - - - - - - ); +export const Variables: React.SFC = props => { + if (!props.vars) { + return null; } -} + + return ( + + + + + + + + + + ); +}; diff --git a/x-pack/legacy/plugins/apm/public/components/shared/Summary/TransactionSummary.tsx b/x-pack/legacy/plugins/apm/public/components/shared/Summary/TransactionSummary.tsx index 8f91b8cc5e2a..b6e783a00b5d 100644 --- a/x-pack/legacy/plugins/apm/public/components/shared/Summary/TransactionSummary.tsx +++ b/x-pack/legacy/plugins/apm/public/components/shared/Summary/TransactionSummary.tsx @@ -61,7 +61,7 @@ const TransactionSummary = ({ ) : null ]; - return ; + return ; }; export { TransactionSummary }; diff --git a/x-pack/legacy/plugins/beats_management/public/components/autocomplete_field/suggestion_item.tsx b/x-pack/legacy/plugins/beats_management/public/components/autocomplete_field/suggestion_item.tsx index 64e7bf6b7f09..2ae475475829 100644 --- a/x-pack/legacy/plugins/beats_management/public/components/autocomplete_field/suggestion_item.tsx +++ b/x-pack/legacy/plugins/beats_management/public/components/autocomplete_field/suggestion_item.tsx @@ -18,29 +18,23 @@ interface SuggestionItemProps { suggestion: AutocompleteSuggestion; } -export class SuggestionItem extends React.Component { - public static defaultProps: Partial = { - isSelected: false, - }; +export const SuggestionItem: React.SFC = props => { + const { isSelected, onClick, onMouseEnter, suggestion } = props; - public render() { - const { isSelected, onClick, onMouseEnter, suggestion } = this.props; + return ( + + + + + {suggestion.text} + {suggestion.description} + + ); +}; - return ( - - - - - {suggestion.text} - {suggestion.description} - - ); - } -} +SuggestionItem.defaultProps = { + isSelected: false, +}; const SuggestionItemContainer = styled.div<{ isSelected?: boolean; diff --git a/x-pack/legacy/plugins/beats_management/public/pages/walkthrough/initial/index.tsx b/x-pack/legacy/plugins/beats_management/public/pages/walkthrough/initial/index.tsx index 6ac664375576..26f2aa80de76 100644 --- a/x-pack/legacy/plugins/beats_management/public/pages/walkthrough/initial/index.tsx +++ b/x-pack/legacy/plugins/beats_management/public/pages/walkthrough/initial/index.tsx @@ -6,93 +6,90 @@ import { EuiBetaBadge, EuiButton, EuiFlexGroup, EuiFlexItem } from '@elastic/eui'; import { i18n } from '@kbn/i18n'; import { FormattedMessage, InjectedIntl, injectI18n } from '@kbn/i18n/react'; -import React, { Component } from 'react'; +import React from 'react'; import { NoDataLayout } from '../../../components/layouts/no_data'; import { WalkthroughLayout } from '../../../components/layouts/walkthrough'; import { ChildRoutes } from '../../../components/navigation/child_routes'; import { ConnectedLink } from '../../../components/navigation/connected_link'; import { AppPageProps } from '../../../frontend_types'; -class InitialWalkthroughPageComponent extends Component< - AppPageProps & { - intl: InjectedIntl; - } -> { - public render() { - const { intl } = this.props; +type Props = AppPageProps & { + intl: InjectedIntl; +}; - if (this.props.location.pathname === '/walkthrough/initial') { - return ( - - {'Beats central management '} - - - - - } - actionSection={ - - - {' '} - - - } - > -

- -

-
- ); - } +const InitialWalkthroughPageComponent: React.SFC = props => { + if (props.location.pathname === '/walkthrough/initial') { return ( - { - // FIXME implament goto - }} - activePath={this.props.location.pathname} + + {'Beats central management '} + + + + + } + actionSection={ + + + {' '} + + + } > - - +

+ +

+ ); } -} + return ( + { + // FIXME implament goto + }} + activePath={props.location.pathname} + > + + + ); +}; + export const InitialWalkthroughPage = injectI18n(InitialWalkthroughPageComponent); diff --git a/x-pack/legacy/plugins/canvas/public/components/workpad_header/workpad_export/flyout/snippets_step.tsx b/x-pack/legacy/plugins/canvas/public/components/workpad_header/workpad_export/flyout/snippets_step.tsx index f933d9009d36..a65ec1ddba08 100644 --- a/x-pack/legacy/plugins/canvas/public/components/workpad_header/workpad_export/flyout/snippets_step.tsx +++ b/x-pack/legacy/plugins/canvas/public/components/workpad_header/workpad_export/flyout/snippets_step.tsx @@ -58,7 +58,7 @@ export const SnippetsStep: FC<{ onCopy: OnCopyFn }> = ({ onCopy }) => ( - kbn-canvas-shareable="canvas" ({strings.getRequiredLabel()}) + kbn-canvas-shareable="canvas" ({strings.getRequiredLabel()}) {strings.getShareableParameterDescription()} diff --git a/x-pack/legacy/plugins/canvas/shareable_runtime/api/__tests__/shareable.test.tsx b/x-pack/legacy/plugins/canvas/shareable_runtime/api/__tests__/shareable.test.tsx index ea944bd30e9b..a55c87c2d74a 100644 --- a/x-pack/legacy/plugins/canvas/shareable_runtime/api/__tests__/shareable.test.tsx +++ b/x-pack/legacy/plugins/canvas/shareable_runtime/api/__tests__/shareable.test.tsx @@ -32,7 +32,7 @@ describe('Canvas Shareable Workpad API', () => { test('Placed successfully with default properties', async () => { const container = document.createElement('div'); document.body.appendChild(container); - const wrapper = mount(
, { + const wrapper = mount(
, { attachTo: container, }); @@ -46,11 +46,7 @@ describe('Canvas Shareable Workpad API', () => { const container = document.createElement('div'); document.body.appendChild(container); const wrapper = mount( -
, +
, { attachTo: container, } @@ -69,11 +65,7 @@ describe('Canvas Shareable Workpad API', () => { const container = document.createElement('div'); document.body.appendChild(container); const wrapper = mount( -
, +
, { attachTo: container, } @@ -97,7 +89,7 @@ describe('Canvas Shareable Workpad API', () => { kbn-canvas-width="350" kbn-canvas-height="350" kbn-canvas-url="workpad.json" - >
, + />, { attachTo: container, } @@ -116,7 +108,7 @@ describe('Canvas Shareable Workpad API', () => { const container = document.createElement('div'); document.body.appendChild(container); const wrapper = mount( -
, +
, { attachTo: container, } diff --git a/x-pack/legacy/plugins/graph/public/components/settings/blacklist_form.tsx b/x-pack/legacy/plugins/graph/public/components/settings/blacklist_form.tsx index b321ea3a0d8e..f7ae04ef9dbc 100644 --- a/x-pack/legacy/plugins/graph/public/components/settings/blacklist_form.tsx +++ b/x-pack/legacy/plugins/graph/public/components/settings/blacklist_form.tsx @@ -39,7 +39,7 @@ export function BlacklistForm({ }} + values={{ stopSign: }} /> } /> diff --git a/x-pack/legacy/plugins/index_management/public/sections/home/template_list/template_details/tabs/tab_aliases.tsx b/x-pack/legacy/plugins/index_management/public/sections/home/template_list/template_details/tabs/tab_aliases.tsx index d1ed816bebd4..3a1dcbc7e762 100644 --- a/x-pack/legacy/plugins/index_management/public/sections/home/template_list/template_details/tabs/tab_aliases.tsx +++ b/x-pack/legacy/plugins/index_management/public/sections/home/template_list/template_details/tabs/tab_aliases.tsx @@ -34,6 +34,6 @@ export const TabAliases: React.FunctionComponent = ({ templateDetails }) } iconType="pin" data-test-subj="noAliasesCallout" - > + /> ); }; diff --git a/x-pack/legacy/plugins/index_management/public/sections/home/template_list/template_details/tabs/tab_mappings.tsx b/x-pack/legacy/plugins/index_management/public/sections/home/template_list/template_details/tabs/tab_mappings.tsx index 91f84a5ecf72..9439b0e31ae8 100644 --- a/x-pack/legacy/plugins/index_management/public/sections/home/template_list/template_details/tabs/tab_mappings.tsx +++ b/x-pack/legacy/plugins/index_management/public/sections/home/template_list/template_details/tabs/tab_mappings.tsx @@ -34,6 +34,6 @@ export const TabMappings: React.FunctionComponent = ({ templateDetails }) } iconType="pin" data-test-subj="noMappingsCallout" - > + /> ); }; diff --git a/x-pack/legacy/plugins/index_management/public/sections/home/template_list/template_details/tabs/tab_settings.tsx b/x-pack/legacy/plugins/index_management/public/sections/home/template_list/template_details/tabs/tab_settings.tsx index 6a83b714519d..0370a8985072 100644 --- a/x-pack/legacy/plugins/index_management/public/sections/home/template_list/template_details/tabs/tab_settings.tsx +++ b/x-pack/legacy/plugins/index_management/public/sections/home/template_list/template_details/tabs/tab_settings.tsx @@ -34,6 +34,6 @@ export const TabSettings: React.FunctionComponent = ({ templateDetails }) } iconType="pin" data-test-subj="noSettingsCallout" - > + /> ); }; diff --git a/x-pack/legacy/plugins/infra/public/components/autocomplete_field/suggestion_item.tsx b/x-pack/legacy/plugins/infra/public/components/autocomplete_field/suggestion_item.tsx index ca67aec9642a..d7c9876a07a8 100644 --- a/x-pack/legacy/plugins/infra/public/components/autocomplete_field/suggestion_item.tsx +++ b/x-pack/legacy/plugins/infra/public/components/autocomplete_field/suggestion_item.tsx @@ -11,36 +11,30 @@ import React from 'react'; import { AutocompleteSuggestion } from '../../../../../../../src/plugins/data/public'; import euiStyled from '../../../../../common/eui_styled_components'; -interface SuggestionItemProps { +interface Props { isSelected?: boolean; onClick?: React.MouseEventHandler; onMouseEnter?: React.MouseEventHandler; suggestion: AutocompleteSuggestion; } -export class SuggestionItem extends React.Component { - public static defaultProps: Partial = { - isSelected: false, - }; +export const SuggestionItem: React.SFC = props => { + const { isSelected, onClick, onMouseEnter, suggestion } = props; - public render() { - const { isSelected, onClick, onMouseEnter, suggestion } = this.props; + return ( + + + + + {suggestion.text} + {suggestion.description} + + ); +}; - return ( - - - - - {suggestion.text} - {suggestion.description} - - ); - } -} +SuggestionItem.defaultProps = { + isSelected: false, +}; const SuggestionItemContainer = euiStyled.div<{ isSelected?: boolean; diff --git a/x-pack/legacy/plugins/infra/public/components/logging/log_text_stream/loading_item_view.tsx b/x-pack/legacy/plugins/infra/public/components/logging/log_text_stream/loading_item_view.tsx index 218b42b48c9b..752a0d6e27a7 100644 --- a/x-pack/legacy/plugins/infra/public/components/logging/log_text_stream/loading_item_view.tsx +++ b/x-pack/legacy/plugins/infra/public/components/logging/log_text_stream/loading_item_view.tsx @@ -114,29 +114,28 @@ interface ProgressEntryProps { isLoading: boolean; } -class ProgressEntry extends React.PureComponent { - public render() { - const { alignment, children, className, color, isLoading } = this.props; - // NOTE: styled-components seems to make all props in EuiProgress required, so this - // style attribute hacking replaces styled-components here for now until that can be fixed - // see: https://github.com/elastic/eui/issues/1655 - const alignmentStyle = - alignment === 'top' ? { top: 0, bottom: 'initial' } : { top: 'initial', bottom: 0 }; +const ProgressEntry: React.SFC = props => { + const { alignment, children, className, color, isLoading } = props; - return ( - - - {children} - - ); - } -} + // NOTE: styled-components seems to make all props in EuiProgress required, so this + // style attribute hacking replaces styled-components here for now until that can be fixed + // see: https://github.com/elastic/eui/issues/1655 + const alignmentStyle = + alignment === 'top' ? { top: 0, bottom: 'initial' } : { top: 'initial', bottom: 0 }; + + return ( + + + {children} + + ); +}; const ProgressEntryWrapper = euiStyled.div` align-items: center; diff --git a/x-pack/legacy/plugins/infra/public/pages/link_to/link_to.tsx b/x-pack/legacy/plugins/infra/public/pages/link_to/link_to.tsx index abb3aa6b26b1..1318e9ca6c2c 100644 --- a/x-pack/legacy/plugins/infra/public/pages/link_to/link_to.tsx +++ b/x-pack/legacy/plugins/infra/public/pages/link_to/link_to.tsx @@ -16,27 +16,21 @@ interface LinkToPageProps { match: RouteMatch<{}>; } -export class LinkToPage extends React.Component { - public render() { - const { match } = this.props; - - return ( - - - - - - - - ); - } -} +export const LinkToPage: React.SFC = props => ( + + + + + + + +); diff --git a/x-pack/legacy/plugins/infra/public/pages/logs/analysis/sections/anomalies/index.tsx b/x-pack/legacy/plugins/infra/public/pages/logs/analysis/sections/anomalies/index.tsx index 745db984afbd..c340de4ad384 100644 --- a/x-pack/legacy/plugins/infra/public/pages/logs/analysis/sections/anomalies/index.tsx +++ b/x-pack/legacy/plugins/infra/public/pages/logs/analysis/sections/anomalies/index.tsx @@ -231,7 +231,7 @@ const AnnotationTooltip: React.FunctionComponent<{ details: string }> = ({ detai const renderAnnotationTooltip = (details?: string) => { // Note: Seems to be necessary to get things typed correctly all the way through to elastic-charts components if (!details) { - return
; + return
; } return ; }; diff --git a/x-pack/legacy/plugins/lens/public/indexpattern_plugin/dimension_panel/popover_editor.tsx b/x-pack/legacy/plugins/lens/public/indexpattern_plugin/dimension_panel/popover_editor.tsx index b9baa489f338..2a0fcfc214e4 100644 --- a/x-pack/legacy/plugins/lens/public/indexpattern_plugin/dimension_panel/popover_editor.tsx +++ b/x-pack/legacy/plugins/lens/public/indexpattern_plugin/dimension_panel/popover_editor.tsx @@ -354,7 +354,7 @@ export function PopoverEditor(props: PopoverEditorProps) { defaultMessage: 'To use this function, select a field.', })} iconType="sortUp" - > + /> )} {!incompatibleSelectedOperationType && ParamEditor && ( <> diff --git a/x-pack/legacy/plugins/ml/public/components/anomalies_table/severity_cell/severity_cell.tsx b/x-pack/legacy/plugins/ml/public/components/anomalies_table/severity_cell/severity_cell.tsx index c2d60f94e144..e74d1a73b333 100644 --- a/x-pack/legacy/plugins/ml/public/components/anomalies_table/severity_cell/severity_cell.tsx +++ b/x-pack/legacy/plugins/ml/public/components/anomalies_table/severity_cell/severity_cell.tsx @@ -36,7 +36,7 @@ export const SeverityCell: FC = memo(({ score, multiBucketImp + /> {severity} diff --git a/x-pack/legacy/plugins/ml/public/datavisualizer/index_based/components/actions_panel/actions_panel.tsx b/x-pack/legacy/plugins/ml/public/datavisualizer/index_based/components/actions_panel/actions_panel.tsx index c8295a1e3d8d..fca2508cb5d1 100644 --- a/x-pack/legacy/plugins/ml/public/datavisualizer/index_based/components/actions_panel/actions_panel.tsx +++ b/x-pack/legacy/plugins/ml/public/datavisualizer/index_based/components/actions_panel/actions_panel.tsx @@ -64,7 +64,7 @@ export const ActionsPanel: FC = ({ indexPattern }) => { - +
diff --git a/x-pack/legacy/plugins/ml/public/jobs/new_job_new/pages/components/job_details_step/components/additional_section/additional_section.tsx b/x-pack/legacy/plugins/ml/public/jobs/new_job_new/pages/components/job_details_step/components/additional_section/additional_section.tsx index 4efac7b9ebf1..ac2d57ea7c8a 100644 --- a/x-pack/legacy/plugins/ml/public/jobs/new_job_new/pages/components/job_details_step/components/additional_section/additional_section.tsx +++ b/x-pack/legacy/plugins/ml/public/jobs/new_job_new/pages/components/job_details_step/components/additional_section/additional_section.tsx @@ -31,7 +31,7 @@ export const AdditionalSection: FC = ({ additionalExpanded, setAdditional - + diff --git a/x-pack/legacy/plugins/ml/public/jobs/new_job_new/pages/components/pick_fields_step/components/advanced_view/settings.tsx b/x-pack/legacy/plugins/ml/public/jobs/new_job_new/pages/components/pick_fields_step/components/advanced_view/settings.tsx index 429457792d55..bae9767a3907 100644 --- a/x-pack/legacy/plugins/ml/public/jobs/new_job_new/pages/components/pick_fields_step/components/advanced_view/settings.tsx +++ b/x-pack/legacy/plugins/ml/public/jobs/new_job_new/pages/components/pick_fields_step/components/advanced_view/settings.tsx @@ -44,7 +44,7 @@ export const AdvancedSettings: FC = ({ setIsValid }) => { - + ); diff --git a/x-pack/legacy/plugins/ml/public/jobs/new_job_new/pages/components/validation_step/validation.tsx b/x-pack/legacy/plugins/ml/public/jobs/new_job_new/pages/components/validation_step/validation.tsx index b60e225cdff4..a543dbaaf3c5 100644 --- a/x-pack/legacy/plugins/ml/public/jobs/new_job_new/pages/components/validation_step/validation.tsx +++ b/x-pack/legacy/plugins/ml/public/jobs/new_job_new/pages/components/validation_step/validation.tsx @@ -78,7 +78,7 @@ export const ValidationStep: FC = ({ setCurrentStep, isCurrentStep }) /> )} - {isCurrentStep === false && } + {isCurrentStep === false && } ); }; diff --git a/x-pack/legacy/plugins/security/public/components/authentication_state_page/authentication_state_page.tsx b/x-pack/legacy/plugins/security/public/components/authentication_state_page/authentication_state_page.tsx index f28696eb8406..2e02275b3961 100644 --- a/x-pack/legacy/plugins/security/public/components/authentication_state_page/authentication_state_page.tsx +++ b/x-pack/legacy/plugins/security/public/components/authentication_state_page/authentication_state_page.tsx @@ -5,32 +5,26 @@ */ import { EuiIcon, EuiSpacer, EuiTitle } from '@elastic/eui'; -import React, { Component } from 'react'; +import React from 'react'; interface Props { title: React.ReactNode; } -export class AuthenticationStatePage extends Component { - public render() { - return ( -
-
-
- - - - - -

{this.props.title}

-
- -
-
-
- {this.props.children} -
+export const AuthenticationStatePage: React.SFC = props => ( +
+
+
+ + + + + +

{props.title}

+
+
- ); - } -} +
+
{props.children}
+
+); diff --git a/x-pack/legacy/plugins/security/public/views/account/components/account_management_page.tsx b/x-pack/legacy/plugins/security/public/views/account/components/account_management_page.tsx index e66b37f8cfe5..94a42166fbb9 100644 --- a/x-pack/legacy/plugins/security/public/views/account/components/account_management_page.tsx +++ b/x-pack/legacy/plugins/security/public/views/account/components/account_management_page.tsx @@ -4,7 +4,7 @@ * you may not use this file except in compliance with the Elastic License. */ import { EuiPage, EuiPageBody, EuiPanel, EuiSpacer, EuiText } from '@elastic/eui'; -import React, { Component } from 'react'; +import React from 'react'; import { getUserDisplayName, AuthenticatedUser } from '../../../../common/model'; import { ChangePassword } from './change_password'; import { PersonalInfo } from './personal_info'; @@ -13,28 +13,20 @@ interface Props { user: AuthenticatedUser; } -export class AccountManagementPage extends Component { - constructor(props: Props) { - super(props); - } +export const AccountManagementPage: React.SFC = props => ( + + + + +

{getUserDisplayName(props.user)}

+
- public render() { - return ( - - - - -

{getUserDisplayName(this.props.user)}

-
+ - + - - - -
-
-
- ); - } -} + +
+
+
+); diff --git a/x-pack/legacy/plugins/security/public/views/login/components/disabled_login_form/disabled_login_form.tsx b/x-pack/legacy/plugins/security/public/views/login/components/disabled_login_form/disabled_login_form.tsx index 1b28023b6e3e..012c16c57716 100644 --- a/x-pack/legacy/plugins/security/public/views/login/components/disabled_login_form/disabled_login_form.tsx +++ b/x-pack/legacy/plugins/security/public/views/login/components/disabled_login_form/disabled_login_form.tsx @@ -5,24 +5,20 @@ */ import { EuiPanel, EuiText } from '@elastic/eui'; -import React, { Component, ReactNode } from 'react'; +import React, { ReactNode } from 'react'; interface Props { title: ReactNode; message: ReactNode; } -export class DisabledLoginForm extends Component { - public render() { - return ( - - -

{this.props.title}

-
- -

{this.props.message}

-
-
- ); - } -} +export const DisabledLoginForm: React.SFC = props => ( + + +

{props.title}

+
+ +

{props.message}

+
+
+); diff --git a/x-pack/legacy/plugins/siem/public/components/field_renderers/field_renderers.tsx b/x-pack/legacy/plugins/siem/public/components/field_renderers/field_renderers.tsx index ffad36c7f939..5df961dfceeb 100644 --- a/x-pack/legacy/plugins/siem/public/components/field_renderers/field_renderers.tsx +++ b/x-pack/legacy/plugins/siem/public/components/field_renderers/field_renderers.tsx @@ -271,7 +271,7 @@ export const DefaultFieldRendererOverflow = React.memo + /> )} diff --git a/x-pack/legacy/plugins/siem/public/components/matrix_over_time/index.test.tsx b/x-pack/legacy/plugins/siem/public/components/matrix_over_time/index.test.tsx index e52d44173f65..3334447739fc 100644 --- a/x-pack/legacy/plugins/siem/public/components/matrix_over_time/index.test.tsx +++ b/x-pack/legacy/plugins/siem/public/components/matrix_over_time/index.test.tsx @@ -12,13 +12,13 @@ import { MatrixOverTimeHistogram } from '.'; jest.mock('@elastic/eui', () => { return { EuiPanel: (children: JSX.Element) => <>{children}, - EuiLoadingContent: () =>
, + EuiLoadingContent: () =>
, }; }); jest.mock('../loader', () => { return { - Loader: () =>
, + Loader: () =>
, }; }); @@ -28,13 +28,13 @@ jest.mock('../../lib/settings/use_kibana_ui_setting', () => { jest.mock('../header_panel', () => { return { - HeaderPanel: () =>
, + HeaderPanel: () =>
, }; }); jest.mock('../charts/barchart', () => { return { - BarChart: () =>
, + BarChart: () =>
, }; }); diff --git a/x-pack/legacy/plugins/siem/public/components/skeleton_row/index.tsx b/x-pack/legacy/plugins/siem/public/components/skeleton_row/index.tsx index 4859dc0d0555..6359063798ba 100644 --- a/x-pack/legacy/plugins/siem/public/components/skeleton_row/index.tsx +++ b/x-pack/legacy/plugins/siem/public/components/skeleton_row/index.tsx @@ -54,7 +54,7 @@ export interface SkeletonRowProps extends CellProps, RowProps { export const SkeletonRow = React.memo( ({ cellColor, cellCount = 4, cellMargin, rowHeight, rowPadding, style }) => { const cells = [...Array(cellCount)].map((_, i) => ( - + )); return ( diff --git a/x-pack/legacy/plugins/siem/public/components/stat_items/index.test.tsx b/x-pack/legacy/plugins/siem/public/components/stat_items/index.test.tsx index 8453ec1cfb5d..ed3eaa6cf1e9 100644 --- a/x-pack/legacy/plugins/siem/public/components/stat_items/index.test.tsx +++ b/x-pack/legacy/plugins/siem/public/components/stat_items/index.test.tsx @@ -38,11 +38,11 @@ const from = new Date('2019-06-15T06:00:00.000Z').valueOf(); const to = new Date('2019-06-18T06:00:00.000Z').valueOf(); jest.mock('../charts/areachart', () => { - return { AreaChart: () =>
}; + return { AreaChart: () =>
}; }); jest.mock('../charts/barchart', () => { - return { BarChart: () =>
}; + return { BarChart: () =>
}; }); describe('Stat Items Component', () => { diff --git a/x-pack/legacy/plugins/siem/public/components/timeline/body/renderers/file_draggable.test.tsx b/x-pack/legacy/plugins/siem/public/components/timeline/body/renderers/file_draggable.test.tsx index 68acc5897237..80be9fd339f5 100644 --- a/x-pack/legacy/plugins/siem/public/components/timeline/body/renderers/file_draggable.test.tsx +++ b/x-pack/legacy/plugins/siem/public/components/timeline/body/renderers/file_draggable.test.tsx @@ -22,7 +22,7 @@ describe('FileDraggable', () => { eventId="1" fileName="[fileName]" filePath="[filePath]" - > + /> ); expect(wrapper.text()).toEqual('[fileName]in[filePath]'); @@ -38,7 +38,7 @@ describe('FileDraggable', () => { eventId="1" fileName={undefined} filePath={undefined} - > + /> ); expect(wrapper.text()).toEqual(''); diff --git a/x-pack/legacy/plugins/spaces/public/views/management/edit_space/confirm_alter_active_space_modal/confirm_alter_active_space_modal.tsx b/x-pack/legacy/plugins/spaces/public/views/management/edit_space/confirm_alter_active_space_modal/confirm_alter_active_space_modal.tsx index d8e06c68af73..d75b8abbe592 100644 --- a/x-pack/legacy/plugins/spaces/public/views/management/edit_space/confirm_alter_active_space_modal/confirm_alter_active_space_modal.tsx +++ b/x-pack/legacy/plugins/spaces/public/views/management/edit_space/confirm_alter_active_space_modal/confirm_alter_active_space_modal.tsx @@ -6,7 +6,7 @@ import { EuiConfirmModal, EuiOverlayMask } from '@elastic/eui'; import { FormattedMessage, InjectedIntl, injectI18n } from '@kbn/i18n/react'; -import React, { Component } from 'react'; +import React from 'react'; interface Props { onCancel: () => void; @@ -14,39 +14,35 @@ interface Props { intl: InjectedIntl; } -class ConfirmAlterActiveSpaceModalUI extends Component { - public render() { - return ( - - - } - defaultFocusedButton={'confirm'} - cancelButtonText={this.props.intl.formatMessage({ - id: 'xpack.spaces.management.confirmAlterActiveSpaceModal.cancelButton', - defaultMessage: 'Cancel', - })} - confirmButtonText={this.props.intl.formatMessage({ - id: 'xpack.spaces.management.confirmAlterActiveSpaceModal.updateSpaceButton', - defaultMessage: 'Update space', - })} - > -

- -

-
-
- ); - } -} +const ConfirmAlterActiveSpaceModalUI: React.SFC = props => ( + + + } + defaultFocusedButton={'confirm'} + cancelButtonText={props.intl.formatMessage({ + id: 'xpack.spaces.management.confirmAlterActiveSpaceModal.cancelButton', + defaultMessage: 'Cancel', + })} + confirmButtonText={props.intl.formatMessage({ + id: 'xpack.spaces.management.confirmAlterActiveSpaceModal.updateSpaceButton', + defaultMessage: 'Update space', + })} + > +

+ +

+
+
+); export const ConfirmAlterActiveSpaceModal = injectI18n(ConfirmAlterActiveSpaceModalUI); diff --git a/x-pack/legacy/plugins/spaces/public/views/nav_control/components/spaces_header_nav_button.tsx b/x-pack/legacy/plugins/spaces/public/views/nav_control/components/spaces_header_nav_button.tsx index 45bb79ee749e..2fa0f8ca605b 100644 --- a/x-pack/legacy/plugins/spaces/public/views/nav_control/components/spaces_header_nav_button.tsx +++ b/x-pack/legacy/plugins/spaces/public/views/nav_control/components/spaces_header_nav_button.tsx @@ -8,22 +8,18 @@ import { // @ts-ignore EuiHeaderSectionItemButton, } from '@elastic/eui'; -import React, { Component } from 'react'; +import React from 'react'; import { ButtonProps } from '../types'; -export class SpacesHeaderNavButton extends Component { - public render() { - return ( - - {this.props.linkIcon} - - ); - } -} +export const SpacesHeaderNavButton: React.SFC = props => ( + + {props.linkIcon} + +); diff --git a/x-pack/legacy/plugins/spaces/public/views/nav_control/nav_control_popover.tsx b/x-pack/legacy/plugins/spaces/public/views/nav_control/nav_control_popover.tsx index 4669bd3608e4..f0e365c27b8e 100644 --- a/x-pack/legacy/plugins/spaces/public/views/nav_control/nav_control_popover.tsx +++ b/x-pack/legacy/plugins/spaces/public/views/nav_control/nav_control_popover.tsx @@ -5,7 +5,7 @@ */ import { EuiAvatar, EuiPopover, PopoverAnchorPosition } from '@elastic/eui'; -import React, { Component, ComponentClass } from 'react'; +import React, { Component } from 'react'; import { Space } from '../../../common/model/space'; import { SpaceAvatar } from '../../components'; import { SpacesManager } from '../../lib/spaces_manager'; @@ -21,7 +21,7 @@ interface Props { space: Space; }; anchorPosition: PopoverAnchorPosition; - buttonClass: ComponentClass; + buttonClass: React.ComponentType; } interface State { diff --git a/x-pack/legacy/plugins/upgrade_assistant/public/components/tabs/checkup/deprecations/reindex/flyout/warnings_step.tsx b/x-pack/legacy/plugins/upgrade_assistant/public/components/tabs/checkup/deprecations/reindex/flyout/warnings_step.tsx index d4602b99c94b..12e57fdf6c01 100644 --- a/x-pack/legacy/plugins/upgrade_assistant/public/components/tabs/checkup/deprecations/reindex/flyout/warnings_step.tsx +++ b/x-pack/legacy/plugins/upgrade_assistant/public/components/tabs/checkup/deprecations/reindex/flyout/warnings_step.tsx @@ -195,8 +195,8 @@ export class WarningsFlyoutStep extends React.Component< values={{ true: true, false: false, - yes: "yes", - on: "on", + yes: "yes", + on: "on", one: 1, }} /> diff --git a/x-pack/legacy/plugins/upgrade_assistant/public/components/types.ts b/x-pack/legacy/plugins/upgrade_assistant/public/components/types.ts index c2181b783a08..dc31308a1ea3 100644 --- a/x-pack/legacy/plugins/upgrade_assistant/public/components/types.ts +++ b/x-pack/legacy/plugins/upgrade_assistant/public/components/types.ts @@ -21,6 +21,7 @@ export interface UpgradeAssistantTabProps { setSelectedTabIndex: (tabIndex: number) => void; } +// eslint-disable-next-line react/prefer-stateless-function export class UpgradeAssistantTabComponent< T extends UpgradeAssistantTabProps = UpgradeAssistantTabProps, S = {} diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/empty_state/__tests__/empty_state.test.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/empty_state/__tests__/empty_state.test.tsx index 9bb21a3ef5c7..0077292d91a4 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/empty_state/__tests__/empty_state.test.tsx +++ b/x-pack/legacy/plugins/uptime/public/components/functional/empty_state/__tests__/empty_state.test.tsx @@ -36,7 +36,7 @@ describe('EmptyState component', () => { it(`doesn't render child components when count is falsey`, () => { const component = mountWithIntl( -
Shouldn't be rendered
+
Shouldn't be rendered
); expect(component).toMatchSnapshot(); @@ -58,7 +58,7 @@ describe('EmptyState component', () => { ]; const component = mountWithIntl( -
Shouldn't appear...
+
Shouldn't appear...
); expect(component).toMatchSnapshot(); diff --git a/x-pack/legacy/plugins/uptime/public/lib/adapters/framework/kibana_global_help.tsx b/x-pack/legacy/plugins/uptime/public/lib/adapters/framework/kibana_global_help.tsx index 7896764d3596..8e730dcc2931 100644 --- a/x-pack/legacy/plugins/uptime/public/lib/adapters/framework/kibana_global_help.tsx +++ b/x-pack/legacy/plugins/uptime/public/lib/adapters/framework/kibana_global_help.tsx @@ -11,7 +11,7 @@ import React from 'react'; export const renderUptimeKibanaGlobalHelp = (docsSiteUrl: string, docLinkVersion: string) => ( - + For Uptime specific information diff --git a/x-pack/plugins/reporting/public/components/general_error.tsx b/x-pack/plugins/reporting/public/components/general_error.tsx index 8a84b3d1741f..dc65800ecf11 100644 --- a/x-pack/plugins/reporting/public/components/general_error.tsx +++ b/x-pack/plugins/reporting/public/components/general_error.tsx @@ -21,7 +21,7 @@ export const getGeneralErrorToast = (errorText: string, err: Error): ToastInput + /> ), iconType: undefined,