From 038f74f4e7618f2b1180a29488222bc43944032f Mon Sep 17 00:00:00 2001 From: Sander Philipse Date: Thu, 7 Dec 2023 19:40:23 +0100 Subject: [PATCH] Add Cloud details panel --- .../components}/cloud_details.tsx | 7 +- packages/kbn-search-api-panels/index.tsx | 1 + .../getting_started/getting_started.tsx | 29 +------- .../panels/api_key_panel_content.tsx | 4 +- .../elasticsearch_url_panel_content.tsx | 67 ------------------- .../application/components/overview.tsx | 3 +- .../plugins/serverless_search/tsconfig.json | 3 +- 7 files changed, 12 insertions(+), 102 deletions(-) rename {x-pack/plugins/serverless_search/public/application/components/overview => packages/kbn-search-api-panels/components}/cloud_details.tsx (94%) delete mode 100644 x-pack/plugins/enterprise_search/public/applications/shared/getting_started/panels/elasticsearch_url_panel_content.tsx diff --git a/x-pack/plugins/serverless_search/public/application/components/overview/cloud_details.tsx b/packages/kbn-search-api-panels/components/cloud_details.tsx similarity index 94% rename from x-pack/plugins/serverless_search/public/application/components/overview/cloud_details.tsx rename to packages/kbn-search-api-panels/components/cloud_details.tsx index 2b192d3f80520..78af1bbca2398 100644 --- a/x-pack/plugins/serverless_search/public/application/components/overview/cloud_details.tsx +++ b/packages/kbn-search-api-panels/components/cloud_details.tsx @@ -1,8 +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. + * 2.0 and the Server Side Public License, v 1; you may not use this file except + * in compliance with, at your election, the Elastic License 2.0 or the Server + * Side Public License, v 1. */ import React, { useState } from 'react'; @@ -20,7 +21,7 @@ import { } from '@elastic/eui'; import { i18n } from '@kbn/i18n'; import { FormattedMessage } from '@kbn/i18n-react'; -import { OverviewPanel } from '@kbn/search-api-panels'; +import { OverviewPanel } from '..'; export interface CloudDetailsPanelProps { cloudId?: string; diff --git a/packages/kbn-search-api-panels/index.tsx b/packages/kbn-search-api-panels/index.tsx index 7cd33124075ff..ada194f6fab46 100644 --- a/packages/kbn-search-api-panels/index.tsx +++ b/packages/kbn-search-api-panels/index.tsx @@ -11,6 +11,7 @@ import { EuiFlexGroup, EuiFlexItem, EuiTitle, EuiSpacer, EuiImage, EuiText } fro import { i18n } from '@kbn/i18n'; import { AuthenticatedUser } from '@kbn/security-plugin/common'; +export * from './components/cloud_details'; export * from './components/code_box'; export * from './components/github_link'; export * from './components/ingest_data'; diff --git a/x-pack/plugins/enterprise_search/public/applications/shared/getting_started/getting_started.tsx b/x-pack/plugins/enterprise_search/public/applications/shared/getting_started/getting_started.tsx index b9a8aedf4d1e2..e4066042ffeba 100644 --- a/x-pack/plugins/enterprise_search/public/applications/shared/getting_started/getting_started.tsx +++ b/x-pack/plugins/enterprise_search/public/applications/shared/getting_started/getting_started.tsx @@ -23,6 +23,7 @@ import { OverviewPanel, getLanguageDefinitionCodeSnippet, getConsoleRequest, + CloudDetailsPanel, } from '@kbn/search-api-panels'; import { ApiKey } from '@kbn/security-plugin/common'; @@ -39,7 +40,6 @@ import { curlDefinition } from './languages/curl'; import { languageDefinitions } from './languages/languages'; import { AddDataPanelContent } from './panels/add_data_panel_content'; import { ApiKeyPanelContent } from './panels/api_key_panel_content'; -import { ElasticsearchUrlPanelContent } from './panels/elasticsearch_url_panel_content'; import { InitializeClientPanelContent } from './panels/initialize_client_panel_content'; import { GettingStartedPipelinePanel } from './panels/pipeline_panel'; import { SearchQueryPanelContent } from './panels/search_query_panel_content'; @@ -130,32 +130,7 @@ export const GettingStarted: React.FC = ({ overviewPanelProps={{ color: 'plain', hasShadow: false }} /> - - ) : undefined - } - rightPanelContent={ - isPanelLeft ? undefined : ( - - ) - } - links={[]} - title={i18n.translate( - 'xpack.enterpriseSearch.overview.gettingStarted.cloudId.panelTitleElastic', - { - defaultMessage: 'Copy your Elasticsearch URL', - } - )} - overviewPanelProps={{ color: 'plain', hasShadow: false }} - /> + = ({ apiKeys, open values={{ number: ( 0 ? 'success' : 'warning'} + color={(apiKeys?.length || 0) > 0 ? 'success' : 'warning'} data-test-subj="api-keys-count-badge" > - {apiKeys.length} + {apiKeys?.length || 0} ), }} diff --git a/x-pack/plugins/enterprise_search/public/applications/shared/getting_started/panels/elasticsearch_url_panel_content.tsx b/x-pack/plugins/enterprise_search/public/applications/shared/getting_started/panels/elasticsearch_url_panel_content.tsx deleted file mode 100644 index 0acd35afb35fd..0000000000000 --- a/x-pack/plugins/enterprise_search/public/applications/shared/getting_started/panels/elasticsearch_url_panel_content.tsx +++ /dev/null @@ -1,67 +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 { css } from '@emotion/react'; - -import dedent from 'dedent'; - -import { EuiCodeBlock, EuiSplitPanel, EuiText, EuiThemeProvider, EuiTitle } from '@elastic/eui'; -import { i18n } from '@kbn/i18n'; -import { ELASTICSEARCH_URL_PLACEHOLDER } from '@kbn/search-api-panels/constants'; - -interface ElasticsearchUrlPanelContent { - cloudId?: string; - url?: string; -} - -export const ElasticsearchUrlPanelContent: React.FC = ({ - cloudId, - url = ELASTICSEARCH_URL_PLACEHOLDER, -}) => { - return ( - - - -
- {i18n.translate( - 'xpack.enterpriseSearch.content.overview.gettingStarted.cloudId.elasticTitle', - { - defaultMessage: 'Store your Elasticsearch URL', - } - )} -
- - - {i18n.translate('xpack.enterpriseSearch.content.overview.gettingStarted.cloudId.desc', { - defaultMessage: 'Unique identifier for your deployment. ', - })} - - - - - - {cloudId - ? dedent`{ - CloudID: "${cloudId}", - Url: "${url}", - }` - : url} - - - - - ); -}; diff --git a/x-pack/plugins/serverless_search/public/application/components/overview.tsx b/x-pack/plugins/serverless_search/public/application/components/overview.tsx index f6b82e7918e9d..d5e1c84f2aec6 100644 --- a/x-pack/plugins/serverless_search/public/application/components/overview.tsx +++ b/x-pack/plugins/serverless_search/public/application/components/overview.tsx @@ -36,7 +36,7 @@ import type { LanguageDefinitionSnippetArguments, } from '@kbn/search-api-panels'; import { useLocation } from 'react-router-dom'; -import { PipelinePanel } from '@kbn/search-api-panels'; +import { CloudDetailsPanel, PipelinePanel } from '@kbn/search-api-panels'; import { docLinks } from '../../../common/doc_links'; import { useKibanaServices } from '../hooks/use_kibana'; import { useAssetBasePath } from '../hooks/use_asset_base_path'; @@ -53,7 +53,6 @@ import { ApiKeyPanel } from './api_key/api_key'; import { ConnectorsCallout } from './connectors_callout'; import { ConnectorIngestionPanel } from './connectors_ingestion'; import { PipelineButtonOverview } from './pipeline_button_overview'; -import { CloudDetailsPanel } from './overview/cloud_details'; export const ElasticsearchOverview = () => { const [selectedLanguage, setSelectedLanguage] = useState(javaDefinition); diff --git a/x-pack/plugins/serverless_search/tsconfig.json b/x-pack/plugins/serverless_search/tsconfig.json index 3f79fa5c9277a..ecc7592016c61 100644 --- a/x-pack/plugins/serverless_search/tsconfig.json +++ b/x-pack/plugins/serverless_search/tsconfig.json @@ -9,7 +9,8 @@ "public/**/*.ts", "public/**/*.tsx", "server/**/*.ts", - "../../../typings/**/*" + "../../../typings/**/*", + "../../../packages/kbn-search-api-panels/components/cloud_details.tsx" ], "exclude": [ "target/**/*"