diff --git a/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/connector_detail/connector_detail.tsx b/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/connector_detail/connector_detail.tsx index f0bcf63ca6f12..924d62adb3359 100644 --- a/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/connector_detail/connector_detail.tsx +++ b/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/connector_detail/connector_detail.tsx @@ -15,7 +15,7 @@ import { i18n } from '@kbn/i18n'; import { generateEncodedPath } from '../../../shared/encode_path_params'; import { KibanaLogic } from '../../../shared/kibana'; import { CONNECTOR_DETAIL_TAB_PATH } from '../../routes'; -import { baseBreadcrumbs } from '../connectors/connectors'; +import { connectorsBreadcrumbs } from '../connectors/connectors'; import { EnterpriseSearchContentPageTemplate } from '../layout/page_template'; import { getHeaderActions } from '../search_index/components/header_actions/header_actions'; @@ -226,7 +226,7 @@ export const ConnectorDetail: React.FC = () => { return ( = ({ isCrawler }) => { <> = ({ isCrawler }) => { iconType="plusInCircle" fill onClick={() => { - KibanaLogic.values.navigateToUrl( - generateEncodedPath(NEW_INDEX_METHOD_PATH, { - type: INGESTION_METHOD_IDS.CRAWLER, - }) - ); + KibanaLogic.values.navigateToUrl(NEW_CRAWLER_PATH); }} > {i18n.translate('xpack.enterpriseSearch.connectors.newCrawlerButtonLabel', { diff --git a/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/connectors/connectors_router.tsx b/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/connectors/connectors_router.tsx new file mode 100644 index 0000000000000..496a5152f6e3c --- /dev/null +++ b/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/connectors/connectors_router.tsx @@ -0,0 +1,32 @@ +/* + * 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 { Routes, Route } from '@kbn/shared-ux-router'; + +import { CONNECTORS_PATH, NEW_INDEX_SELECT_CONNECTOR_PATH, NEW_CONNECTOR_PATH } from '../../routes'; +import { NewSearchIndexPage } from '../new_index/new_search_index_page'; + +import { Connectors } from './connectors'; +import { SelectConnector } from './select_connector/select_connector'; + +export const ConnectorsRouter: React.FC = () => { + return ( + + + + + + + + + + + + ); +}; diff --git a/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/connectors/crawler_empty_state.tsx b/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/connectors/crawler_empty_state.tsx index d929cf6cbffa5..dd3aed042928d 100644 --- a/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/connectors/crawler_empty_state.tsx +++ b/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/connectors/crawler_empty_state.tsx @@ -11,10 +11,9 @@ import { useValues } from 'kea'; import { EuiButton, EuiEmptyPrompt, EuiPanel } from '@elastic/eui'; import { i18n } from '@kbn/i18n'; -import { generateEncodedPath } from '../../../shared/encode_path_params'; import { HttpLogic } from '../../../shared/http'; import { KibanaLogic } from '../../../shared/kibana'; -import { NEW_INDEX_METHOD_PATH } from '../../routes'; +import { NEW_CRAWLER_PATH } from '../../routes'; export const CrawlerEmptyState: React.FC = () => { const { errorConnectingMessage } = useValues(HttpLogic); @@ -46,11 +45,7 @@ export const CrawlerEmptyState: React.FC = () => { disabled={Boolean(errorConnectingMessage)} fill iconType="plusInCircle" - onClick={() => - KibanaLogic.values.navigateToUrl( - generateEncodedPath(NEW_INDEX_METHOD_PATH, { type: 'crawler' }) - ) - } + onClick={() => KibanaLogic.values.navigateToUrl(NEW_CRAWLER_PATH)} > {i18n.translate('xpack.enterpriseSearch.crawlerEmptyState.newWebCrawlerButtonLabel', { defaultMessage: 'New web crawler', diff --git a/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/connectors/crawlers_router.tsx b/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/connectors/crawlers_router.tsx new file mode 100644 index 0000000000000..35c7e9ce56ec3 --- /dev/null +++ b/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/connectors/crawlers_router.tsx @@ -0,0 +1,28 @@ +/* + * 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 { Routes, Route } from '@kbn/shared-ux-router'; + +import { CRAWLERS_PATH, NEW_CRAWLER_PATH } from '../../routes'; +import { NewSearchIndexPage } from '../new_index/new_search_index_page'; + +import { Connectors } from './connectors'; + +export const CrawlersRouter: React.FC = () => { + return ( + + + + + + + + + ); +}; diff --git a/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/new_index/select_connector/connector_checkable.scss b/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/connectors/select_connector/connector_checkable.scss similarity index 100% rename from x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/new_index/select_connector/connector_checkable.scss rename to x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/connectors/select_connector/connector_checkable.scss diff --git a/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/new_index/select_connector/connector_checkable.tsx b/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/connectors/select_connector/connector_checkable.tsx similarity index 100% rename from x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/new_index/select_connector/connector_checkable.tsx rename to x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/connectors/select_connector/connector_checkable.tsx diff --git a/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/new_index/select_connector/connector_description_badge_popout.tsx b/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/connectors/select_connector/connector_description_badge_popout.tsx similarity index 100% rename from x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/new_index/select_connector/connector_description_badge_popout.tsx rename to x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/connectors/select_connector/connector_description_badge_popout.tsx diff --git a/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/new_index/select_connector/native_popover.tsx b/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/connectors/select_connector/native_popover.tsx similarity index 100% rename from x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/new_index/select_connector/native_popover.tsx rename to x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/connectors/select_connector/native_popover.tsx diff --git a/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/new_index/select_connector/select_connector.tsx b/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/connectors/select_connector/select_connector.tsx similarity index 96% rename from x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/new_index/select_connector/select_connector.tsx rename to x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/connectors/select_connector/select_connector.tsx index 92158b7ae94bb..c7421a95e9a3d 100644 --- a/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/new_index/select_connector/select_connector.tsx +++ b/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/connectors/select_connector/select_connector.tsx @@ -34,26 +34,21 @@ import { import { i18n } from '@kbn/i18n'; import { FormattedMessage } from '@kbn/i18n-react'; -import { - CONNECTOR_CLIENTS_TYPE, - CONNECTOR_NATIVE_TYPE, - INGESTION_METHOD_IDS, -} from '../../../../../../common/constants'; +import { CONNECTOR_CLIENTS_TYPE, CONNECTOR_NATIVE_TYPE } from '../../../../../../common/constants'; import connectorLogo from '../../../../../assets/source_icons/network_drive.svg'; import { BACK_BUTTON_LABEL } from '../../../../shared/constants'; -import { generateEncodedPath } from '../../../../shared/encode_path_params'; import { KibanaLogic } from '../../../../shared/kibana'; import { LicensingLogic } from '../../../../shared/licensing'; import { parseQueryParams } from '../../../../shared/query_params'; -import { NEW_INDEX_METHOD_PATH, NEW_INDEX_PATH } from '../../../routes'; +import { NEW_CONNECTOR_PATH, NEW_INDEX_PATH } from '../../../routes'; import { EnterpriseSearchContentPageTemplate } from '../../layout'; import { CONNECTORS } from '../../search_index/connector/constants'; -import { baseBreadcrumbs } from '../../search_indices'; +import { connectorsBreadcrumbs } from '../connectors'; import { ConnectorCheckable } from './connector_checkable'; import { ConnectorDescriptionBadge } from './connector_description_badge_popout'; @@ -115,7 +110,7 @@ export const SelectConnector: React.FC = () => { return ( { ); } KibanaLogic.values.navigateToUrl( - `${generateEncodedPath(NEW_INDEX_METHOD_PATH, { - type: INGESTION_METHOD_IDS.CONNECTOR, - })}?${queryParam.toString()}` + `${NEW_CONNECTOR_PATH}?${queryParam.toString()}` ); }} documentationUrl={connector.docsUrl} diff --git a/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/new_index/new_index.tsx b/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/new_index/new_index.tsx index 349cb1ac598ae..7b71ee9e41ca8 100644 --- a/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/new_index/new_index.tsx +++ b/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/new_index/new_index.tsx @@ -16,11 +16,10 @@ import { INGESTION_METHOD_IDS } from '../../../../../common/constants'; import { ProductFeatures } from '../../../../../common/types'; -import { generateEncodedPath } from '../../../shared/encode_path_params'; import { HttpLogic } from '../../../shared/http'; import { KibanaLogic } from '../../../shared/kibana/kibana_logic'; -import { NEW_INDEX_METHOD_PATH, NEW_INDEX_SELECT_CONNECTOR_PATH } from '../../routes'; +import { NEW_API_PATH, NEW_CRAWLER_PATH, NEW_INDEX_SELECT_CONNECTOR_PATH } from '../../routes'; import { EnterpriseSearchContentPageTemplate } from '../layout/page_template'; import { CannotConnect } from '../search_index/components/cannot_connect'; import { baseBreadcrumbs } from '../search_indices'; @@ -76,10 +75,10 @@ export const NewIndex: React.FC = () => { onSelect={() => { if (type === INGESTION_METHOD_IDS.CONNECTOR) { KibanaLogic.values.navigateToUrl(NEW_INDEX_SELECT_CONNECTOR_PATH); + } else if (type === INGESTION_METHOD_IDS.CRAWLER) { + KibanaLogic.values.navigateToUrl(NEW_CRAWLER_PATH); } else { - KibanaLogic.values.navigateToUrl( - generateEncodedPath(NEW_INDEX_METHOD_PATH, { type }) - ); + KibanaLogic.values.navigateToUrl(NEW_API_PATH); } }} /> diff --git a/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/new_index/new_index_router.tsx b/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/new_index/new_index_router.tsx index c2ce2cc226574..7887eabddd224 100644 --- a/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/new_index/new_index_router.tsx +++ b/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/new_index/new_index_router.tsx @@ -9,15 +9,10 @@ import React from 'react'; import { Routes, Route } from '@kbn/shared-ux-router'; -import { - NEW_INDEX_PATH, - NEW_INDEX_SELECT_CONNECTOR_PATH, - NEW_INDEX_METHOD_PATH, -} from '../../routes'; +import { NEW_INDEX_PATH, NEW_API_PATH } from '../../routes'; import { NewIndex } from './new_index'; import { NewSearchIndexPage } from './new_search_index_page'; -import { SelectConnector } from './select_connector/select_connector'; export const NewIndexRouter: React.FC = () => { return ( @@ -25,11 +20,8 @@ export const NewIndexRouter: React.FC = () => { - - - - - + + ); diff --git a/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/new_index/new_search_index_page.tsx b/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/new_index/new_search_index_page.tsx index 5ad862d9befd9..048d6e478f71b 100644 --- a/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/new_index/new_search_index_page.tsx +++ b/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/new_index/new_search_index_page.tsx @@ -7,7 +7,7 @@ import React from 'react'; -import { useLocation, useParams } from 'react-router-dom'; +import { useLocation } from 'react-router-dom'; import { EuiBadge, EuiFlexGroup, EuiFlexItem, EuiIcon } from '@elastic/eui'; import { i18n } from '@kbn/i18n'; @@ -20,6 +20,7 @@ import { } from '../../../../../common/constants'; import { parseQueryParams } from '../../../shared/query_params'; +import { connectorsBreadcrumbs, crawlersBreadcrumbs } from '../connectors/connectors'; import { EnterpriseSearchContentPageTemplate } from '../layout/page_template'; import { CONNECTORS } from '../search_index/connector/constants'; import { baseBreadcrumbs } from '../search_indices'; @@ -95,6 +96,44 @@ const parseIsNativeParam = (queryString: string | string[] | null): boolean | un return undefined; }; +const getBreadcrumb = (method: string, serviceType: string): string[] => { + switch (method) { + case INGESTION_METHOD_IDS.CONNECTOR: + const connector = + Boolean(serviceType) && CONNECTORS.find((item) => item.serviceType === serviceType); + + const thisConnectorBreadcrumb = connector + ? i18n.translate( + 'xpack.enterpriseSearch.content.new_connector_with_service_type.breadcrumbs', + { + defaultMessage: `New {name} connector`, + values: { + name: connector.name, + }, + } + ) + : i18n.translate('xpack.enterpriseSearch.content.new_connector.breadcrumbs', { + defaultMessage: `New connector`, + }); + + return [...connectorsBreadcrumbs, thisConnectorBreadcrumb]; + case INGESTION_METHOD_IDS.CRAWLER: + return [ + ...crawlersBreadcrumbs, + i18n.translate('xpack.enterpriseSearch.content.new_web_crawler.breadcrumbs', { + defaultMessage: 'New web crawler', + }), + ]; + default: + return [ + ...baseBreadcrumbs, + i18n.translate('xpack.enterpriseSearch.content.new_index.breadcrumbs', { + defaultMessage: 'New search index', + }), + ]; + } +}; + const getConnectorModeBadge = (isNative?: boolean) => { if (isNative) { return ( @@ -117,9 +156,10 @@ const getConnectorModeBadge = (isNative?: boolean) => { } return undefined; }; - -export const NewSearchIndexPage: React.FC = () => { - const type = decodeURIComponent(useParams<{ type: string }>().type); +export interface NewSearchIndexPageProps { + type: string; +} +export const NewSearchIndexPage: React.FC = ({ type }) => { const { search } = useLocation(); const { service_type: inputServiceType, connector_type: inputConnectorType } = parseQueryParams(search); @@ -131,12 +171,7 @@ export const NewSearchIndexPage: React.FC = () => { return ( + + + - - - - + diff --git a/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/routes.ts b/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/routes.ts index 1b9445b7fa756..8fc6fcbfb5272 100644 --- a/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/routes.ts +++ b/x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/routes.ts @@ -16,13 +16,14 @@ export const CRAWLERS_PATH = `${ROOT_PATH}crawlers`; export const SETTINGS_PATH = `${ROOT_PATH}settings`; export const NEW_INDEX_PATH = `${SEARCH_INDICES_PATH}/new_index`; -export const NEW_INDEX_METHOD_PATH = `${NEW_INDEX_PATH}/:type`; export const NEW_API_PATH = `${NEW_INDEX_PATH}/api`; export const NEW_ES_INDEX_PATH = `${NEW_INDEX_PATH}/elasticsearch`; export const NEW_DIRECT_UPLOAD_PATH = `${NEW_INDEX_PATH}/upload`; -export const NEW_INDEX_SELECT_CONNECTOR_PATH = `${NEW_INDEX_PATH}/select_connector`; -export const NEW_INDEX_SELECT_CONNECTOR_NATIVE_PATH = `${NEW_INDEX_PATH}/select_connector?filter=native`; -export const NEW_INDEX_SELECT_CONNECTOR_CLIENTS_PATH = `${NEW_INDEX_PATH}/select_connector?filter=connector_clients`; +export const NEW_INDEX_SELECT_CONNECTOR_PATH = `${CONNECTORS_PATH}/select_connector`; +export const NEW_CONNECTOR_PATH = `${CONNECTORS_PATH}/new_connector`; +export const NEW_CRAWLER_PATH = `${CRAWLERS_PATH}/new_crawler`; +export const NEW_INDEX_SELECT_CONNECTOR_NATIVE_PATH = `${CONNECTORS_PATH}/select_connector?filter=native`; +export const NEW_INDEX_SELECT_CONNECTOR_CLIENTS_PATH = `${CONNECTORS_PATH}/select_connector?filter=connector_clients`; export const SEARCH_INDEX_PATH = `${SEARCH_INDICES_PATH}/:indexName`; export const SEARCH_INDEX_TAB_PATH = `${SEARCH_INDEX_PATH}/:tabId`; diff --git a/x-pack/plugins/enterprise_search/public/applications/enterprise_search_overview/components/product_selector/ingestion_selector.tsx b/x-pack/plugins/enterprise_search/public/applications/enterprise_search_overview/components/product_selector/ingestion_selector.tsx index 6bf75fca0546b..1245dab97cf10 100644 --- a/x-pack/plugins/enterprise_search/public/applications/enterprise_search_overview/components/product_selector/ingestion_selector.tsx +++ b/x-pack/plugins/enterprise_search/public/applications/enterprise_search_overview/components/product_selector/ingestion_selector.tsx @@ -18,7 +18,6 @@ import { i18n } from '@kbn/i18n'; import { ENTERPRISE_SEARCH_CONTENT_PLUGIN, ENTERPRISE_SEARCH_ELASTICSEARCH_URL, - INGESTION_METHOD_IDS, } from '../../../../../common/constants'; import apiLogo from '../../../../assets/images/api_image.png'; @@ -31,7 +30,7 @@ import languageClientsLogo from '../../../../assets/images/search_language_clien import { IngestionCard } from '../../../enterprise_search_content/components/shared/ingestion_card/ingestion_card'; import { NEW_API_PATH, - NEW_INDEX_METHOD_PATH, + NEW_CRAWLER_PATH, NEW_INDEX_SELECT_CONNECTOR_PATH, } from '../../../enterprise_search_content/routes'; import { HttpLogic } from '../../../shared/http/http_logic'; @@ -91,9 +90,7 @@ export const IngestionSelector: React.FC = () => { 'Discover, extract, and index searchable content from websites and knowledge bases.', } )} - href={generatePath(ENTERPRISE_SEARCH_CONTENT_PLUGIN.URL + NEW_INDEX_METHOD_PATH, { - type: INGESTION_METHOD_IDS.CRAWLER, - })} + href={generatePath(ENTERPRISE_SEARCH_CONTENT_PLUGIN.URL + NEW_CRAWLER_PATH)} isDisabled={crawlerDisabled} logo={crawlerLogo} title={i18n.translate('xpack.enterpriseSearch.ingestSelector.method.crawler', {