+ {i18n.translate('xpack.enterpriseSearch.appSearch.engine.searchUI.empty.title', {
+ defaultMessage: 'Add documents to generate a Search UI',
+ })}
+
+ }
+ body={
+
+ {i18n.translate('xpack.enterpriseSearch.appSearch.engine.searchUI.empty.description', {
+ defaultMessage:
+ 'A schema will be automatically created for you after you index some documents.',
+ })}
+
+ }
+ actions={
+
+ {i18n.translate('xpack.enterpriseSearch.appSearch.engine.searchUI.empty.buttonLabel', {
+ defaultMessage: 'Read the Search UI guide',
+ })}
+
+ }
+ />
+);
diff --git a/x-pack/plugins/enterprise_search/public/applications/app_search/components/search_ui/search_ui.test.tsx b/x-pack/plugins/enterprise_search/public/applications/app_search/components/search_ui/search_ui.test.tsx
index edec376dd3edd1..f9f0dd611b9539 100644
--- a/x-pack/plugins/enterprise_search/public/applications/app_search/components/search_ui/search_ui.test.tsx
+++ b/x-pack/plugins/enterprise_search/public/applications/app_search/components/search_ui/search_ui.test.tsx
@@ -6,14 +6,17 @@
*/
import '../../../__mocks__/shallow_useeffect.mock';
-import '../../__mocks__/engine_logic.mock';
-import { setMockActions } from '../../../__mocks__/kea_logic';
+import { setMockActions, setMockValues } from '../../../__mocks__/kea_logic';
+import { mockEngineValues } from '../../__mocks__/engine_logic.mock';
import React from 'react';
import { shallow } from 'enzyme';
+import { SearchUIForm } from './components/search_ui_form';
+import { SearchUIGraphic } from './components/search_ui_graphic';
+
import { SearchUI } from './';
describe('SearchUI', () => {
@@ -24,11 +27,13 @@ describe('SearchUI', () => {
beforeEach(() => {
jest.clearAllMocks();
setMockActions(actions);
+ setMockValues(mockEngineValues);
});
it('renders', () => {
- shallow();
- // TODO: Check for form
+ const wrapper = shallow();
+ expect(wrapper.find(SearchUIForm).exists()).toBe(true);
+ expect(wrapper.find(SearchUIGraphic).exists()).toBe(true);
});
it('initializes data on mount', () => {
diff --git a/x-pack/plugins/enterprise_search/public/applications/app_search/components/search_ui/search_ui.tsx b/x-pack/plugins/enterprise_search/public/applications/app_search/components/search_ui/search_ui.tsx
index e75bc36177151f..0ac59a33068baf 100644
--- a/x-pack/plugins/enterprise_search/public/applications/app_search/components/search_ui/search_ui.tsx
+++ b/x-pack/plugins/enterprise_search/public/applications/app_search/components/search_ui/search_ui.tsx
@@ -7,25 +7,16 @@
import React, { useEffect } from 'react';
-import { useActions } from 'kea';
+import { useActions, useValues } from 'kea';
-import {
- EuiPageHeader,
- EuiPageContentBody,
- EuiText,
- EuiFlexItem,
- EuiFlexGroup,
- EuiSpacer,
- EuiLink,
-} from '@elastic/eui';
+import { EuiText, EuiFlexItem, EuiFlexGroup, EuiSpacer, EuiLink } from '@elastic/eui';
import { FormattedMessage } from '@kbn/i18n/react';
-import { FlashMessages } from '../../../shared/flash_messages';
-import { SetAppSearchChrome as SetPageChrome } from '../../../shared/kibana_chrome';
-
import { DOCS_PREFIX } from '../../routes';
-import { getEngineBreadcrumbs } from '../engine';
+import { EngineLogic, getEngineBreadcrumbs } from '../engine';
+import { AppSearchPageTemplate } from '../layout';
+import { EmptyState } from './components/empty_state';
import { SearchUIForm } from './components/search_ui_form';
import { SearchUIGraphic } from './components/search_ui_graphic';
import { SEARCH_UI_TITLE } from './i18n';
@@ -33,61 +24,62 @@ import { SearchUILogic } from './search_ui_logic';
export const SearchUI: React.FC = () => {
const { loadFieldData } = useActions(SearchUILogic);
+ const { engine } = useValues(EngineLogic);
useEffect(() => {
loadFieldData();
}, []);
return (
- <>
-
-
-
-
-
-
-
-
-
-
-
- ),
- }}
- />
-
-
-
-
-
- ),
- }}
- />
-
-
-
-
-
-
-
-
-
-
- >
+ }
+ >
+
+
+
+
+
+
+
+ ),
+ }}
+ />
+
+
+
+
+
+ ),
+ }}
+ />
+
+
+
+
+
+
+
+
+
+
);
};