diff --git a/x-pack/plugins/enterprise_search/public/applications/app_search/__mocks__/engine_logic.mock.ts b/x-pack/plugins/enterprise_search/public/applications/app_search/__mocks__/engine_logic.mock.ts
index 23d638d5f25f3d..b38659b7a9a797 100644
--- a/x-pack/plugins/enterprise_search/public/applications/app_search/__mocks__/engine_logic.mock.ts
+++ b/x-pack/plugins/enterprise_search/public/applications/app_search/__mocks__/engine_logic.mock.ts
@@ -6,7 +6,7 @@
*/
import { EngineDetails } from '../components/engine/types';
-import { ENGINES_TITLE } from '../components/engines';
+import { ENGINES_TITLE } from '../components/engines/constants';
import { generateEncodedPath } from '../utils/encode_path_params';
export const mockEngineValues = {
diff --git a/x-pack/plugins/enterprise_search/public/applications/app_search/components/engine_creation/engine_creation.tsx b/x-pack/plugins/enterprise_search/public/applications/app_search/components/engine_creation/engine_creation.tsx
index 250c941009ecb9..913aa4f0ec8452 100644
--- a/x-pack/plugins/enterprise_search/public/applications/app_search/components/engine_creation/engine_creation.tsx
+++ b/x-pack/plugins/enterprise_search/public/applications/app_search/components/engine_creation/engine_creation.tsx
@@ -16,15 +16,13 @@ import {
EuiFlexItem,
EuiFieldText,
EuiSelect,
- EuiPageHeader,
- EuiPageContent,
+ EuiPanel,
EuiSpacer,
EuiTitle,
EuiButton,
} from '@elastic/eui';
-import { FlashMessages } from '../../../shared/flash_messages';
-import { SetAppSearchChrome as SetPageChrome } from '../../../shared/kibana_chrome';
+import { AppSearchPageTemplate } from '../layout';
import {
ALLOWED_CHARS_NOTE,
@@ -44,77 +42,77 @@ export const EngineCreation: React.FC = () => {
const { setLanguage, setRawName, submitEngine } = useActions(EngineCreationLogic);
return (
-
-
-
-
-
-
-
+ data-test-subj="EngineCreationNameInput"
+ placeholder={ENGINE_CREATION_FORM_ENGINE_NAME_PLACEHOLDER}
+ autoFocus
+ />
+
+
+
+
+ setLanguage(event.currentTarget.value)}
+ />
+
+
+
+
+
+ {ENGINE_CREATION_FORM_SUBMIT_BUTTON_LABEL}
+
-
-
+
+
);
};
diff --git a/x-pack/plugins/enterprise_search/public/applications/app_search/components/engines/components/empty_state.tsx b/x-pack/plugins/enterprise_search/public/applications/app_search/components/engines/components/empty_state.tsx
index e6a7c03d2aab48..df17d22d387d90 100644
--- a/x-pack/plugins/enterprise_search/public/applications/app_search/components/engines/components/empty_state.tsx
+++ b/x-pack/plugins/enterprise_search/public/applications/app_search/components/engines/components/empty_state.tsx
@@ -9,7 +9,7 @@ import React from 'react';
import { useValues, useActions } from 'kea';
-import { EuiPageContent, EuiEmptyPrompt, EuiSpacer } from '@elastic/eui';
+import { EuiEmptyPrompt, EuiSpacer } from '@elastic/eui';
import { i18n } from '@kbn/i18n';
import { EuiButtonTo } from '../../../../shared/react_router_helpers';
@@ -20,86 +20,72 @@ import { ENGINE_CREATION_PATH } from '../../../routes';
import { SampleEngineCreationCta } from '../../sample_engine_creation_cta/sample_engine_creation_cta';
-import { EnginesOverviewHeader } from './header';
-
export const EmptyState: React.FC = () => {
const {
myRole: { canManageEngines },
} = useValues(AppLogic);
const { sendAppSearchTelemetry } = useActions(TelemetryLogic);
- return (
- <>
-
-
- {canManageEngines ? (
-
- {i18n.translate('xpack.enterpriseSearch.appSearch.emptyState.title', {
- defaultMessage: 'Create your first engine',
- })}
-
- }
- titleSize="l"
- body={
-
- {i18n.translate('xpack.enterpriseSearch.appSearch.emptyState.description1', {
- defaultMessage:
- 'An App Search engine stores the documents for your search experience.',
- })}
-
- }
- actions={
- <>
-
- sendAppSearchTelemetry({
- action: 'clicked',
- metric: 'create_first_engine_button',
- })
- }
- >
- {i18n.translate(
- 'xpack.enterpriseSearch.appSearch.emptyState.createFirstEngineCta',
- { defaultMessage: 'Create an engine' }
- )}
-
-
-
- >
- }
- />
- ) : (
-
- {i18n.translate('xpack.enterpriseSearch.appSearch.emptyState.nonAdmin.title', {
- defaultMessage: 'No engines available',
- })}
-
- }
- body={
-
- {i18n.translate(
- 'xpack.enterpriseSearch.appSearch.emptyState.nonAdmin.description',
- {
- defaultMessage:
- 'Contact your App Search administrator to either create or grant you access to an engine.',
- }
- )}
-
+ return canManageEngines ? (
+
+ {i18n.translate('xpack.enterpriseSearch.appSearch.emptyState.title', {
+ defaultMessage: 'Create your first engine',
+ })}
+
+ }
+ titleSize="l"
+ body={
+
+ {i18n.translate('xpack.enterpriseSearch.appSearch.emptyState.description1', {
+ defaultMessage: 'An App Search engine stores the documents for your search experience.',
+ })}
+
+ }
+ actions={
+ <>
+
+ sendAppSearchTelemetry({
+ action: 'clicked',
+ metric: 'create_first_engine_button',
+ })
}
- />
- )}
-
- >
+ >
+ {i18n.translate('xpack.enterpriseSearch.appSearch.emptyState.createFirstEngineCta', {
+ defaultMessage: 'Create an engine',
+ })}
+
+
+
+ >
+ }
+ />
+ ) : (
+
+ {i18n.translate('xpack.enterpriseSearch.appSearch.emptyState.nonAdmin.title', {
+ defaultMessage: 'No engines available',
+ })}
+
+ }
+ body={
+
+ {i18n.translate('xpack.enterpriseSearch.appSearch.emptyState.nonAdmin.description', {
+ defaultMessage:
+ 'Contact your App Search administrator to either create or grant you access to an engine.',
+ })}
+
+ }
+ />
);
};
diff --git a/x-pack/plugins/enterprise_search/public/applications/app_search/components/engines/components/header.tsx b/x-pack/plugins/enterprise_search/public/applications/app_search/components/engines/components/header.tsx
deleted file mode 100644
index bab67fd0e4bb50..00000000000000
--- a/x-pack/plugins/enterprise_search/public/applications/app_search/components/engines/components/header.tsx
+++ /dev/null
@@ -1,54 +0,0 @@
-/*
- * 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 { useActions } from 'kea';
-
-import { EuiPageHeader, EuiButton } from '@elastic/eui';
-import { i18n } from '@kbn/i18n';
-
-import { getAppSearchUrl } from '../../../../shared/enterprise_search_url';
-import { SetAppSearchChrome as SetPageChrome } from '../../../../shared/kibana_chrome';
-import { TelemetryLogic } from '../../../../shared/telemetry';
-
-import { ENGINES_TITLE } from '../constants';
-
-export const EnginesOverviewHeader: React.FC = () => {
- const { sendAppSearchTelemetry } = useActions(TelemetryLogic);
-
- return (
- <>
-
-
- sendAppSearchTelemetry({
- action: 'clicked',
- metric: 'header_launch_button',
- })
- }
- data-test-subj="launchButton"
- >
- {i18n.translate('xpack.enterpriseSearch.appSearch.productCta', {
- defaultMessage: 'Launch App Search',
- })}
- ,
- ]}
- />
- >
- );
-};
diff --git a/x-pack/plugins/enterprise_search/public/applications/app_search/components/engines/components/index.ts b/x-pack/plugins/enterprise_search/public/applications/app_search/components/engines/components/index.ts
index 234d3ba31f44bc..1d8e578e0edf20 100644
--- a/x-pack/plugins/enterprise_search/public/applications/app_search/components/engines/components/index.ts
+++ b/x-pack/plugins/enterprise_search/public/applications/app_search/components/engines/components/index.ts
@@ -5,7 +5,6 @@
* 2.0.
*/
-export { EnginesOverviewHeader } from './header';
-export { LoadingState } from './loading_state';
+export { LaunchAppSearchButton } from './launch_as_button';
export { EmptyState } from './empty_state';
export { EmptyMetaEnginesState } from './empty_meta_engines_state';
diff --git a/x-pack/plugins/enterprise_search/public/applications/app_search/components/engines/components/header.test.tsx b/x-pack/plugins/enterprise_search/public/applications/app_search/components/engines/components/launch_as_button.test.tsx
similarity index 64%
rename from x-pack/plugins/enterprise_search/public/applications/app_search/components/engines/components/header.test.tsx
rename to x-pack/plugins/enterprise_search/public/applications/app_search/components/engines/components/launch_as_button.test.tsx
index 9b245a468b0838..93c91cc3830f4e 100644
--- a/x-pack/plugins/enterprise_search/public/applications/app_search/components/engines/components/header.test.tsx
+++ b/x-pack/plugins/enterprise_search/public/applications/app_search/components/engines/components/launch_as_button.test.tsx
@@ -12,23 +12,11 @@ import React from 'react';
import { shallow } from 'enzyme';
-import { EuiPageHeader } from '@elastic/eui';
-
-import { EnginesOverviewHeader } from './';
-
-describe('EnginesOverviewHeader', () => {
- const wrapper = shallow()
- .find(EuiPageHeader)
- .dive()
- .children()
- .dive();
-
- it('renders', () => {
- expect(wrapper.find('h1').text()).toEqual('Engines overview');
- });
+import { LaunchAppSearchButton } from './';
+describe('LaunchAppSearchButton', () => {
it('renders a launch app search button that sends telemetry on click', () => {
- const button = wrapper.find('[data-test-subj="launchButton"]');
+ const button = shallow();
expect(button.prop('href')).toBe('http://localhost:3002/as');
expect(button.prop('isDisabled')).toBeFalsy();
diff --git a/x-pack/plugins/enterprise_search/public/applications/app_search/components/engines/components/launch_as_button.tsx b/x-pack/plugins/enterprise_search/public/applications/app_search/components/engines/components/launch_as_button.tsx
new file mode 100644
index 00000000000000..41102cb4fba2ec
--- /dev/null
+++ b/x-pack/plugins/enterprise_search/public/applications/app_search/components/engines/components/launch_as_button.tsx
@@ -0,0 +1,41 @@
+/*
+ * 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 { useActions } from 'kea';
+
+import { EuiButton } from '@elastic/eui';
+import { i18n } from '@kbn/i18n';
+
+import { getAppSearchUrl } from '../../../../shared/enterprise_search_url';
+import { TelemetryLogic } from '../../../../shared/telemetry';
+
+export const LaunchAppSearchButton: React.FC = () => {
+ const { sendAppSearchTelemetry } = useActions(TelemetryLogic);
+
+ return (
+ // eslint-disable-next-line @elastic/eui/href-or-on-click
+
+ sendAppSearchTelemetry({
+ action: 'clicked',
+ metric: 'header_launch_button',
+ })
+ }
+ data-test-subj="launchButton"
+ >
+ {i18n.translate('xpack.enterpriseSearch.appSearch.productCta', {
+ defaultMessage: 'Launch App Search',
+ })}
+
+ );
+};
diff --git a/x-pack/plugins/enterprise_search/public/applications/app_search/components/engines/components/loading_state.test.tsx b/x-pack/plugins/enterprise_search/public/applications/app_search/components/engines/components/loading_state.test.tsx
deleted file mode 100644
index f7ccfea4bb4d46..00000000000000
--- a/x-pack/plugins/enterprise_search/public/applications/app_search/components/engines/components/loading_state.test.tsx
+++ /dev/null
@@ -1,22 +0,0 @@
-/*
- * 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 { EuiLoadingContent } from '@elastic/eui';
-
-import { LoadingState } from './';
-
-describe('LoadingState', () => {
- it('renders', () => {
- const wrapper = shallow();
-
- expect(wrapper.find(EuiLoadingContent)).toHaveLength(2);
- });
-});
diff --git a/x-pack/plugins/enterprise_search/public/applications/app_search/components/engines/components/loading_state.tsx b/x-pack/plugins/enterprise_search/public/applications/app_search/components/engines/components/loading_state.tsx
deleted file mode 100644
index 875c47378d1fb0..00000000000000
--- a/x-pack/plugins/enterprise_search/public/applications/app_search/components/engines/components/loading_state.tsx
+++ /dev/null
@@ -1,25 +0,0 @@
-/*
- * 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 { EuiPageContent, EuiSpacer, EuiLoadingContent } from '@elastic/eui';
-
-import { EnginesOverviewHeader } from './header';
-
-export const LoadingState: React.FC = () => {
- return (
- <>
-
-
-
-
-
-
- >
- );
-};
diff --git a/x-pack/plugins/enterprise_search/public/applications/app_search/components/engines/constants.ts b/x-pack/plugins/enterprise_search/public/applications/app_search/components/engines/constants.ts
index 8d03e3d23ae237..d01e89e004d28d 100644
--- a/x-pack/plugins/enterprise_search/public/applications/app_search/components/engines/constants.ts
+++ b/x-pack/plugins/enterprise_search/public/applications/app_search/components/engines/constants.ts
@@ -11,6 +11,11 @@ export const ENGINES_TITLE = i18n.translate('xpack.enterpriseSearch.appSearch.en
defaultMessage: 'Engines',
});
+export const ENGINES_OVERVIEW_TITLE = i18n.translate(
+ 'xpack.enterpriseSearch.appSearch.enginesOverview.title',
+ { defaultMessage: 'Engines overview' }
+);
+
export const META_ENGINES_TITLE = i18n.translate(
'xpack.enterpriseSearch.appSearch.metaEngines.title',
{ defaultMessage: 'Meta Engines' }
diff --git a/x-pack/plugins/enterprise_search/public/applications/app_search/components/engines/engines_overview.test.tsx b/x-pack/plugins/enterprise_search/public/applications/app_search/components/engines/engines_overview.test.tsx
index 27fe65fe518ebc..8825c322fb8d5f 100644
--- a/x-pack/plugins/enterprise_search/public/applications/app_search/components/engines/engines_overview.test.tsx
+++ b/x-pack/plugins/enterprise_search/public/applications/app_search/components/engines/engines_overview.test.tsx
@@ -14,7 +14,6 @@ import { shallow, ShallowWrapper } from 'enzyme';
import { rerender } from '../../../test_helpers';
-import { LoadingState, EmptyState } from './components';
import { EnginesTable } from './components/tables/engines_table';
import { MetaEnginesTable } from './components/tables/meta_engines_table';
@@ -61,135 +60,117 @@ describe('EnginesOverview', () => {
setMockActions(actions);
});
- describe('non-happy-path states', () => {
- it('isLoading', () => {
- setMockValues({ ...values, dataLoading: true });
- const wrapper = shallow();
+ const valuesWithEngines = {
+ ...values,
+ dataLoading: false,
+ engines: ['test-engine'],
+ enginesMeta: {
+ page: {
+ current: 1,
+ size: 10,
+ total_results: 100,
+ },
+ },
+ };
- expect(wrapper.find(LoadingState)).toHaveLength(1);
- });
+ beforeEach(() => {
+ jest.clearAllMocks();
+ setMockValues(valuesWithEngines);
+ });
- it('isEmpty', () => {
- setMockValues({ ...values, engines: [] });
- const wrapper = shallow();
+ it('renders and calls the engines API', () => {
+ const wrapper = shallow();
- expect(wrapper.find(EmptyState)).toHaveLength(1);
- });
+ expect(wrapper.find(EnginesTable)).toHaveLength(1);
+ expect(actions.loadEngines).toHaveBeenCalled();
});
- describe('happy-path states', () => {
- const valuesWithEngines = {
- ...values,
- dataLoading: false,
- engines: ['test-engine'],
- enginesMeta: {
- page: {
- current: 1,
- size: 10,
- total_results: 100,
- },
- },
- };
+ describe('when the user can manage/create engines', () => {
+ it('renders a create engine button which takes users to the create engine page', () => {
+ setMockValues({
+ ...valuesWithEngines,
+ myRole: { canManageEngines: true },
+ });
+ const wrapper = shallow();
- beforeEach(() => {
- jest.clearAllMocks();
- setMockValues(valuesWithEngines);
+ expect(
+ wrapper.find('[data-test-subj="appSearchEnginesEngineCreationButton"]').prop('to')
+ ).toEqual('/engine_creation');
});
+ });
- it('renders and calls the engines API', () => {
+ describe('when the account has a platinum license', () => {
+ it('renders a 2nd meta engines table & makes a 2nd meta engines call', () => {
+ setMockValues({
+ ...valuesWithEngines,
+ hasPlatinumLicense: true,
+ });
const wrapper = shallow();
- expect(wrapper.find(EnginesTable)).toHaveLength(1);
- expect(actions.loadEngines).toHaveBeenCalled();
+ expect(wrapper.find(MetaEnginesTable)).toHaveLength(1);
+ expect(actions.loadMetaEngines).toHaveBeenCalled();
});
describe('when the user can manage/create engines', () => {
- it('renders a create engine button which takes users to the create engine page', () => {
+ it('renders a create engine button which takes users to the create meta engine page', () => {
setMockValues({
...valuesWithEngines,
+ hasPlatinumLicense: true,
myRole: { canManageEngines: true },
});
const wrapper = shallow();
expect(
- wrapper.find('[data-test-subj="appSearchEnginesEngineCreationButton"]').prop('to')
- ).toEqual('/engine_creation');
+ wrapper.find('[data-test-subj="appSearchEnginesMetaEngineCreationButton"]').prop('to')
+ ).toEqual('/meta_engine_creation');
});
});
+ });
- describe('when the account has a platinum license', () => {
- it('renders a 2nd meta engines table & makes a 2nd meta engines call', () => {
- setMockValues({
- ...valuesWithEngines,
- hasPlatinumLicense: true,
- });
- const wrapper = shallow();
+ describe('pagination', () => {
+ const getTablePagination = (wrapper: ShallowWrapper) =>
+ wrapper.find(EnginesTable).prop('pagination');
- expect(wrapper.find(MetaEnginesTable)).toHaveLength(1);
- expect(actions.loadMetaEngines).toHaveBeenCalled();
- });
+ it('passes down page data from the API', () => {
+ const wrapper = shallow();
+ const pagination = getTablePagination(wrapper);
- describe('when the user can manage/create engines', () => {
- it('renders a create engine button which takes users to the create meta engine page', () => {
- setMockValues({
- ...valuesWithEngines,
- hasPlatinumLicense: true,
- myRole: { canManageEngines: true },
- });
- const wrapper = shallow();
-
- expect(
- wrapper.find('[data-test-subj="appSearchEnginesMetaEngineCreationButton"]').prop('to')
- ).toEqual('/meta_engine_creation');
- });
- });
+ expect(pagination.totalItemCount).toEqual(100);
+ expect(pagination.pageIndex).toEqual(0);
});
- describe('pagination', () => {
- const getTablePagination = (wrapper: ShallowWrapper) =>
- wrapper.find(EnginesTable).prop('pagination');
-
- it('passes down page data from the API', () => {
- const wrapper = shallow();
- const pagination = getTablePagination(wrapper);
+ it('re-polls the API on page change', () => {
+ const wrapper = shallow();
- expect(pagination.totalItemCount).toEqual(100);
- expect(pagination.pageIndex).toEqual(0);
+ setMockValues({
+ ...valuesWithEngines,
+ enginesMeta: {
+ page: {
+ ...valuesWithEngines.enginesMeta.page,
+ current: 51,
+ },
+ },
});
+ rerender(wrapper);
- it('re-polls the API on page change', () => {
- const wrapper = shallow();
-
- setMockValues({
- ...valuesWithEngines,
- enginesMeta: {
- page: {
- ...valuesWithEngines.enginesMeta.page,
- current: 51,
- },
- },
- });
- rerender(wrapper);
+ expect(actions.loadEngines).toHaveBeenCalledTimes(2);
+ expect(getTablePagination(wrapper).pageIndex).toEqual(50);
+ });
- expect(actions.loadEngines).toHaveBeenCalledTimes(2);
- expect(getTablePagination(wrapper).pageIndex).toEqual(50);
+ it('calls onPagination handlers', () => {
+ setMockValues({
+ ...valuesWithEngines,
+ hasPlatinumLicense: true,
+ metaEngines: ['test-meta-engine'],
});
+ const wrapper = shallow();
+ const pageEvent = { page: { index: 0 } };
- it('calls onPagination handlers', () => {
- setMockValues({
- ...valuesWithEngines,
- hasPlatinumLicense: true,
- metaEngines: ['test-meta-engine'],
- });
- const wrapper = shallow();
- const pageEvent = { page: { index: 0 } };
-
- wrapper.find(EnginesTable).simulate('change', pageEvent);
- expect(actions.onEnginesPagination).toHaveBeenCalledWith(1);
+ wrapper.find(EnginesTable).simulate('change', pageEvent);
+ expect(actions.onEnginesPagination).toHaveBeenCalledWith(1);
- wrapper.find(MetaEnginesTable).simulate('change', pageEvent);
- expect(actions.onMetaEnginesPagination).toHaveBeenCalledWith(1);
- });
+ wrapper.find(MetaEnginesTable).simulate('change', pageEvent);
+ expect(actions.onMetaEnginesPagination).toHaveBeenCalledWith(1);
});
});
});
diff --git a/x-pack/plugins/enterprise_search/public/applications/app_search/components/engines/engines_overview.tsx b/x-pack/plugins/enterprise_search/public/applications/app_search/components/engines/engines_overview.tsx
index 7001ecada999a9..44111a5ecbe66f 100644
--- a/x-pack/plugins/enterprise_search/public/applications/app_search/components/engines/engines_overview.tsx
+++ b/x-pack/plugins/enterprise_search/public/applications/app_search/components/engines/engines_overview.tsx
@@ -12,7 +12,7 @@ import { useValues, useActions } from 'kea';
import {
EuiFlexGroup,
EuiFlexItem,
- EuiPageContent,
+ EuiPanel,
EuiPageContentHeader,
EuiPageContentHeaderSection,
EuiPageContentBody,
@@ -20,24 +20,19 @@ import {
EuiSpacer,
} from '@elastic/eui';
-import { FlashMessages } from '../../../shared/flash_messages';
import { LicensingLogic } from '../../../shared/licensing';
import { EuiButtonTo } from '../../../shared/react_router_helpers';
import { convertMetaToPagination, handlePageChange } from '../../../shared/table_pagination';
-import { SendAppSearchTelemetry as SendTelemetry } from '../../../shared/telemetry';
import { AppLogic } from '../../app_logic';
import { EngineIcon, MetaEngineIcon } from '../../icons';
import { ENGINE_CREATION_PATH, META_ENGINE_CREATION_PATH } from '../../routes';
+import { AppSearchPageTemplate } from '../layout';
-import {
- EnginesOverviewHeader,
- LoadingState,
- EmptyState,
- EmptyMetaEnginesState,
-} from './components';
+import { LaunchAppSearchButton, EmptyState, EmptyMetaEnginesState } from './components';
import { EnginesTable } from './components/tables/engines_table';
import { MetaEnginesTable } from './components/tables/meta_engines_table';
import {
+ ENGINES_OVERVIEW_TITLE,
CREATE_AN_ENGINE_BUTTON_LABEL,
CREATE_A_META_ENGINE_BUTTON_LABEL,
ENGINES_TITLE,
@@ -73,16 +68,19 @@ export const EnginesOverview: React.FC = () => {
if (hasPlatinumLicense) loadMetaEngines();
}, [hasPlatinumLicense, metaEnginesMeta.page.current]);
- if (dataLoading) return ;
- if (!engines.length) return ;
-
return (
- <>
-
-
-
-
-
+ ],
+ }}
+ isLoading={dataLoading}
+ isEmptyState={!engines.length}
+ emptyState={}
+ >
+
@@ -168,7 +166,7 @@ export const EnginesOverview: React.FC = () => {
>
)}
-
- >
+
+
);
};
diff --git a/x-pack/plugins/enterprise_search/public/applications/app_search/components/meta_engine_creation/meta_engine_creation.tsx b/x-pack/plugins/enterprise_search/public/applications/app_search/components/meta_engine_creation/meta_engine_creation.tsx
index 02a1768a7528ea..325e557acec0cd 100644
--- a/x-pack/plugins/enterprise_search/public/applications/app_search/components/meta_engine_creation/meta_engine_creation.tsx
+++ b/x-pack/plugins/enterprise_search/public/applications/app_search/components/meta_engine_creation/meta_engine_creation.tsx
@@ -18,16 +18,14 @@ import {
EuiFormRow,
EuiFlexItem,
EuiFieldText,
- EuiPageContent,
- EuiPageHeader,
+ EuiPanel,
EuiSpacer,
EuiTitle,
EuiButton,
} from '@elastic/eui';
-import { FlashMessages } from '../../../shared/flash_messages';
-import { SetAppSearchChrome as SetPageChrome } from '../../../shared/kibana_chrome';
import { AppLogic } from '../../app_logic';
+import { AppSearchPageTemplate } from '../layout';
import {
ALLOWED_CHARS_NOTE,
@@ -74,20 +72,21 @@ export const MetaEngineCreation: React.FC = () => {
}, []);
return (
-
-
-
{META_ENGINE_CREATION_FORM_META_ENGINE_DESCRIPTION}
{META_ENGINE_CREATION_FORM_DOCUMENTATION_DESCRIPTION}
>
- }
- />
-
-
+ ),
+ }}
+ data-test-subj="MetaEngineCreation"
+ >
+
{
{META_ENGINE_CREATION_FORM_SUBMIT_BUTTON_LABEL}
-
-
+
+
);
};
diff --git a/x-pack/plugins/enterprise_search/public/applications/app_search/index.tsx b/x-pack/plugins/enterprise_search/public/applications/app_search/index.tsx
index caf0f805e8ca7e..b2cd3d7b54a1a9 100644
--- a/x-pack/plugins/enterprise_search/public/applications/app_search/index.tsx
+++ b/x-pack/plugins/enterprise_search/public/applications/app_search/index.tsx
@@ -92,6 +92,22 @@ export const AppSearchConfigured: React.FC> = (props) =
)}
+
+
+
+
+
+
+ {canManageEngines && (
+
+
+
+ )}
+ {canManageMetaEngines && (
+
+
+
+ )}
{canViewRoleMappings && (
@@ -100,12 +116,6 @@ export const AppSearchConfigured: React.FC> = (props) =
} readOnlyMode={readOnlyMode}>
-
-
-
-
-
-
@@ -115,16 +125,6 @@ export const AppSearchConfigured: React.FC> = (props) =
- {canManageEngines && (
-
-
-
- )}
- {canManageMetaEngines && (
-
-
-
- )}