diff --git a/x-pack/plugins/enterprise_search/public/applications/app_search/components/result_settings/result_settings_table/column_headers.test.tsx b/x-pack/plugins/enterprise_search/public/applications/app_search/components/result_settings/result_settings_table/column_headers.test.tsx
new file mode 100644
index 000000000000..a2ef43908776
--- /dev/null
+++ b/x-pack/plugins/enterprise_search/public/applications/app_search/components/result_settings/result_settings_table/column_headers.test.tsx
@@ -0,0 +1,21 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+import React from 'react';
+
+import { shallow } from 'enzyme';
+
+import { EuiTableHeaderCell } from '@elastic/eui';
+
+import { ColumnHeaders } from './column_headers';
+
+describe('ColumnHeaders', () => {
+ it('renders', () => {
+ const wrapper = shallow();
+ expect(wrapper.find(EuiTableHeaderCell).length).toBe(3);
+ });
+});
diff --git a/x-pack/plugins/enterprise_search/public/applications/app_search/components/result_settings/result_settings_table/column_headers.tsx b/x-pack/plugins/enterprise_search/public/applications/app_search/components/result_settings/result_settings_table/column_headers.tsx
new file mode 100644
index 000000000000..b36d71a49de1
--- /dev/null
+++ b/x-pack/plugins/enterprise_search/public/applications/app_search/components/result_settings/result_settings_table/column_headers.tsx
@@ -0,0 +1,52 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+import React from 'react';
+
+import { EuiIconTip, EuiTableHeader, EuiTableHeaderCell } from '@elastic/eui';
+import { i18n } from '@kbn/i18n';
+
+export const ColumnHeaders: React.FC = () => {
+ return (
+
+
+
+ {i18n.translate('xpack.enterpriseSearch.appSearch.engine.resultSettings.table.rawTitle', {
+ defaultMessage: 'Raw',
+ })}
+
+
+
+ {i18n.translate(
+ 'xpack.enterpriseSearch.appSearch.engine.resultSettings.table.highlightingTitle',
+ {
+ defaultMessage: 'Highlighting',
+ }
+ )}
+ tags for highlighting. Fallback will look for a snippet match, but fallback to an escaped raw value if none is found. Range is between 20-1000. Defaults to 100.',
+ }
+ )}
+ />
+
+
+ );
+};
diff --git a/x-pack/plugins/enterprise_search/public/applications/app_search/components/result_settings/result_settings_table/disabled_fields_body.tsx b/x-pack/plugins/enterprise_search/public/applications/app_search/components/result_settings/result_settings_table/disabled_fields_body.tsx
index fd4646bf9a9f..2f4ba0892784 100644
--- a/x-pack/plugins/enterprise_search/public/applications/app_search/components/result_settings/result_settings_table/disabled_fields_body.tsx
+++ b/x-pack/plugins/enterprise_search/public/applications/app_search/components/result_settings/result_settings_table/disabled_fields_body.tsx
@@ -9,7 +9,7 @@ import React from 'react';
import { useValues } from 'kea';
-import { EuiTableBody, EuiTableRow, EuiTableRowCell, EuiText, EuiHealth } from '@elastic/eui';
+import { EuiTableRow, EuiTableRowCell, EuiText, EuiHealth } from '@elastic/eui';
import { i18n } from '@kbn/i18n';
import { ResultSettingsLogic } from '..';
@@ -17,7 +17,7 @@ import { ResultSettingsLogic } from '..';
export const DisabledFieldsBody: React.FC = () => {
const { schemaConflicts } = useValues(ResultSettingsLogic);
return (
-
+ <>
{Object.keys(schemaConflicts).map((fieldName) => (
@@ -35,6 +35,6 @@ export const DisabledFieldsBody: React.FC = () => {
))}
-
+ >
);
};
diff --git a/x-pack/plugins/enterprise_search/public/applications/app_search/components/result_settings/result_settings_table/disabled_fields_header.tsx b/x-pack/plugins/enterprise_search/public/applications/app_search/components/result_settings/result_settings_table/disabled_fields_header.tsx
index 0c82477814da..1c0c1da3e4ef 100644
--- a/x-pack/plugins/enterprise_search/public/applications/app_search/components/result_settings/result_settings_table/disabled_fields_header.tsx
+++ b/x-pack/plugins/enterprise_search/public/applications/app_search/components/result_settings/result_settings_table/disabled_fields_header.tsx
@@ -12,7 +12,7 @@ import { i18n } from '@kbn/i18n';
export const DisabledFieldsHeader: React.FC = () => {
return (
-
+
{i18n.translate(
'xpack.enterpriseSearch.appSearch.engine.resultSettings.table.column.disabledFieldsTitle',
diff --git a/x-pack/plugins/enterprise_search/public/applications/app_search/components/result_settings/result_settings_table/non_text_fields_body.tsx b/x-pack/plugins/enterprise_search/public/applications/app_search/components/result_settings/result_settings_table/non_text_fields_body.tsx
index 57dd2d5fdb97..145654be2046 100644
--- a/x-pack/plugins/enterprise_search/public/applications/app_search/components/result_settings/result_settings_table/non_text_fields_body.tsx
+++ b/x-pack/plugins/enterprise_search/public/applications/app_search/components/result_settings/result_settings_table/non_text_fields_body.tsx
@@ -9,13 +9,7 @@ import React, { useMemo } from 'react';
import { useValues, useActions } from 'kea';
-import {
- EuiTableBody,
- EuiTableRow,
- EuiTableRowCell,
- EuiCheckbox,
- EuiTableRowCellCheckbox,
-} from '@elastic/eui';
+import { EuiTableRow, EuiTableRowCell, EuiCheckbox, EuiTableRowCellCheckbox } from '@elastic/eui';
import { ResultSettingsLogic } from '..';
import { FieldResultSetting } from '../types';
@@ -31,7 +25,7 @@ export const NonTextFieldsBody: React.FC = () => {
}, [nonTextResultFields]);
return (
-
+ <>
{resultSettingsArray.map(([fieldName, fieldSettings]) => (
@@ -50,6 +44,6 @@ export const NonTextFieldsBody: React.FC = () => {
))}
-
+ >
);
};
diff --git a/x-pack/plugins/enterprise_search/public/applications/app_search/components/result_settings/result_settings_table/non_text_fields_header.tsx b/x-pack/plugins/enterprise_search/public/applications/app_search/components/result_settings/result_settings_table/non_text_fields_header.tsx
index 6024f736899d..b929187780e1 100644
--- a/x-pack/plugins/enterprise_search/public/applications/app_search/components/result_settings/result_settings_table/non_text_fields_header.tsx
+++ b/x-pack/plugins/enterprise_search/public/applications/app_search/components/result_settings/result_settings_table/non_text_fields_header.tsx
@@ -12,7 +12,7 @@ import { i18n } from '@kbn/i18n';
export const NonTextFieldsHeader: React.FC = () => {
return (
-
+
{i18n.translate(
'xpack.enterpriseSearch.appSearch.engine.resultSettings.table.column.nonTextFieldsTitle',
diff --git a/x-pack/plugins/enterprise_search/public/applications/app_search/components/result_settings/result_settings_table/result_settings_table.tsx b/x-pack/plugins/enterprise_search/public/applications/app_search/components/result_settings/result_settings_table/result_settings_table.tsx
index 2da334e1f2ae..092a4beee0c8 100644
--- a/x-pack/plugins/enterprise_search/public/applications/app_search/components/result_settings/result_settings_table/result_settings_table.tsx
+++ b/x-pack/plugins/enterprise_search/public/applications/app_search/components/result_settings/result_settings_table/result_settings_table.tsx
@@ -8,10 +8,11 @@ import React from 'react';
import { useValues } from 'kea';
-import { EuiTable } from '@elastic/eui';
+import { EuiTable, EuiTableBody } from '@elastic/eui';
import { ResultSettingsLogic } from '..';
+import { ColumnHeaders } from './column_headers';
import { DisabledFieldsBody } from './disabled_fields_body';
import { DisabledFieldsHeader } from './disabled_fields_header';
import { NonTextFieldsBody } from './non_text_fields_body';
@@ -28,23 +29,24 @@ export const ResultSettingsTable: React.FC = () => {
// to alleviate the issue.
return (
+
{!!Object.keys(textResultFields).length && (
- <>
+
- >
+
)}
{!!Object.keys(nonTextResultFields).length && (
- <>
+
- >
+
)}
{!!Object.keys(schemaConflicts).length && (
- <>
+
- >
+
)}
);
diff --git a/x-pack/plugins/enterprise_search/public/applications/app_search/components/result_settings/result_settings_table/text_fields_body.tsx b/x-pack/plugins/enterprise_search/public/applications/app_search/components/result_settings/result_settings_table/text_fields_body.tsx
index af01ced81f7d..0f7e6f5e0eb1 100644
--- a/x-pack/plugins/enterprise_search/public/applications/app_search/components/result_settings/result_settings_table/text_fields_body.tsx
+++ b/x-pack/plugins/enterprise_search/public/applications/app_search/components/result_settings/result_settings_table/text_fields_body.tsx
@@ -9,13 +9,7 @@ import React, { useMemo } from 'react';
import { useValues, useActions } from 'kea';
-import {
- EuiTableBody,
- EuiTableRow,
- EuiTableRowCell,
- EuiTableRowCellCheckbox,
- EuiCheckbox,
-} from '@elastic/eui';
+import { EuiTableRow, EuiTableRowCell, EuiTableRowCellCheckbox, EuiCheckbox } from '@elastic/eui';
import { ResultSettingsLogic } from '../result_settings_logic';
import { FieldResultSetting } from '../types';
@@ -41,7 +35,7 @@ export const TextFieldsBody: React.FC = () => {
}, [textResultFields]);
return (
-
+ <>
{resultSettingsArray.map(([fieldName, fieldSettings]) => (
@@ -100,6 +94,6 @@ export const TextFieldsBody: React.FC = () => {
))}
-
+ >
);
};
diff --git a/x-pack/plugins/enterprise_search/public/applications/app_search/components/result_settings/result_settings_table/text_fields_header.tsx b/x-pack/plugins/enterprise_search/public/applications/app_search/components/result_settings/result_settings_table/text_fields_header.tsx
index 3810570b3e3a..cf4dfa946278 100644
--- a/x-pack/plugins/enterprise_search/public/applications/app_search/components/result_settings/result_settings_table/text_fields_header.tsx
+++ b/x-pack/plugins/enterprise_search/public/applications/app_search/components/result_settings/result_settings_table/text_fields_header.tsx
@@ -7,49 +7,13 @@
import React from 'react';
-import { EuiTableRow, EuiTableHeader, EuiTableHeaderCell, EuiIconTip } from '@elastic/eui';
+import { EuiTableRow, EuiTableHeaderCell } from '@elastic/eui';
import { i18n } from '@kbn/i18n';
export const TextFieldsHeader: React.FC = () => {
return (
<>
-
-
-
- {i18n.translate('xpack.enterpriseSearch.appSearch.engine.resultSettings.table.rawTitle', {
- defaultMessage: 'Raw',
- })}
-
-
-
- {i18n.translate(
- 'xpack.enterpriseSearch.appSearch.engine.resultSettings.table.highlightingTitle',
- {
- defaultMessage: 'Highlighting',
- }
- )}
- tags for highlighting. Fallback will look for a snippet match, but fallback to an escaped raw value if none is found. Range is between 20-1000. Defaults to 100.',
- }
- )}
- />
-
-
{i18n.translate(