[Enterprise Search] Product 404 polish pass

x-pack/plugins/enterprise_search/public/applications/app_search/components/not_found/index.ts

@@ -0,0 +1,8 @@
+/*
+ * 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.
+ */
+
+export { NotFound } from './not_found';

x-pack/plugins/enterprise_search/public/applications/app_search/components/not_found/not_found.test.tsx

@@ -0,0 +1,38 @@
+/*
+ * 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 { NotFoundPrompt } from '../../../shared/not_found';
+import { SendAppSearchTelemetry } from '../../../shared/telemetry';
+import { AppSearchPageTemplate } from '../layout';
+
+import { NotFound } from './';
+
+describe('NotFound', () => {
+  const wrapper = shallow(<NotFound />);
+
+  it('renders the shared not found prompt', () => {
+    expect(wrapper.find(NotFoundPrompt)).toHaveLength(1);
+  });
+
+  it('renders a telemetry error event', () => {
+    expect(wrapper.find(SendAppSearchTelemetry).prop('action')).toEqual('error');
+  });
+
+  it('passes optional preceding page chrome', () => {
+    wrapper.setProps({ pageChrome: ['Engines', 'some-engine'] });
+
+    expect(wrapper.find(AppSearchPageTemplate).prop('pageChrome')).toEqual([
+      'Engines',
+      'some-engine',
+      '404',
+    ]);
+  });
+});

x-pack/plugins/enterprise_search/public/applications/app_search/components/not_found/not_found.tsx

@@ -0,0 +1,24 @@
+/*
+ * 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 { APP_SEARCH_PLUGIN } from '../../../../../common/constants';
+import { PageTemplateProps } from '../../../shared/layout';
+import { NotFoundPrompt } from '../../../shared/not_found';
+import { AppSearchLogo } from '../../../shared/not_found/logos';
+import { SendAppSearchTelemetry } from '../../../shared/telemetry';
+import { AppSearchPageTemplate } from '../layout';
+
+export const NotFound: React.FC<PageTemplateProps> = ({ pageChrome = [] }) => {
+  return (
+    <AppSearchPageTemplate pageChrome={[...pageChrome, '404']} template="centeredContent">
+      <SendAppSearchTelemetry action="error" metric="not_found" />
+      <NotFoundPrompt logo={AppSearchLogo} productSupportUrl={APP_SEARCH_PLUGIN.SUPPORT_URL} />
+    </AppSearchPageTemplate>
+  );
+};

x-pack/plugins/enterprise_search/public/applications/shared/not_found/index.ts

@@ -5,4 +5,4 @@
  * 2.0.
  */
 
-export { NotFound } from './not_found';
+export { NotFoundPrompt } from './not_found_prompt';

x-pack/plugins/enterprise_search/public/applications/shared/not_found/logos/index.ts

@@ -0,0 +1,9 @@
+/*
+ * 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.
+ */
+
+export { AppSearchLogo } from './app_search_logo';
+export { WorkplaceSearchLogo } from './workplace_search_logo';

x-pack/plugins/enterprise_search/public/applications/shared/not_found/logos/logos.test.tsx

@@ -0,0 +1,25 @@
+/*
+ * 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 { AppSearchLogo } from './app_search_logo';
+import { WorkplaceSearchLogo } from './workplace_search_logo';
+
+describe('product 404 logos', () => {
+  it('renders an App Search logo', () => {
+    const wrapper = shallow(<AppSearchLogo />);
+    expect(wrapper.hasClass('logo404')).toBe(true);
+  });
+
+  it('renders a Workplace Search logo', () => {
+    const wrapper = shallow(<WorkplaceSearchLogo />);
+    expect(wrapper.hasClass('logo404')).toBe(true);
+  });
+});

x-pack/plugins/enterprise_search/public/applications/shared/not_found/not_found_prompt.test.tsx

@@ -0,0 +1,54 @@
+/*
+ * 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 { setMockValues } from '../../__mocks__/kea_logic';
+
+import React from 'react';
+
+import { shallow } from 'enzyme';
+
+import { EuiEmptyPrompt, EuiIcon, EuiButton } from '@elastic/eui';
+
+import { EuiButtonTo } from '../react_router_helpers';
+
+import { NotFoundPrompt } from './';
+
+describe('NotFoundPrompt', () => {
+  const subject = (props?: object) =>
+    shallow(<NotFoundPrompt logo="" productSupportUrl="" {...props} />)
+      .find(EuiEmptyPrompt)
+      .dive();
+
+  it('renders', () => {
+    const wrapper = subject({
+      logo: 'logoAppSearch',
+      productSupportUrl: 'https://discuss.elastic.co/c/enterprise-search/app-search/',
+    });
+
+    expect(wrapper.find('h1').text()).toEqual('404 error');
+    expect(wrapper.find(EuiIcon).prop('type')).toEqual('logoAppSearch');
+    expect(wrapper.find(EuiButtonTo).prop('to')).toEqual('/');
+    expect(wrapper.find(EuiButton).prop('href')).toEqual(expect.stringContaining('//discuss'));
+  });
+
+  it('renders with a custom "Back to dashboard" link if passed', () => {
+    const wrapper = subject({
+      logo: 'logoWorkplaceSearch',
+      productSupportUrl: 'https://discuss.elastic.co/c/enterprise-search/workplace-search/',
+      backToLink: '/workplace_search/p/sources',
+    });
+
+    expect(wrapper.find(EuiButtonTo).prop('to')).toEqual('/workplace_search/p/sources');
+  });
+
+  it('renders with a link to our licensed support URL for gold+ licenses', () => {
+    setMockValues({ hasGoldLicense: true });
+    const wrapper = subject();
+
+    expect(wrapper.find(EuiButton).prop('href')).toEqual('https://support.elastic.co');
+  });
+});