diff --git a/CHANGELOG.md b/CHANGELOG.md index f68b43eb0c26..67711160ea71 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -17,6 +17,8 @@ Inspired from [Keep a Changelog](https://keepachangelog.com/en/1.0.0/) * [Multi DataSource] UX enhancement on Data source management stack ([#2521](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/2521)) * [Multi DataSource] UX enhancement on Index Pattern management stack ([#2527](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/2527)) * [Multi DataSource] Add data source column into index pattern table ([#2542](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/2542)) +* [Multi DataSource] UX enhancement for Data source management creation page ([#2051](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/2501)) +* [Multi DataSource] Add experimental callout for index pattern section ([#2523](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/2523)) ### 🐛 Bug Fixes * [Vis Builder] Fixes auto bounds for timeseries bar chart visualization ([2401](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/2401)) diff --git a/src/plugins/index_pattern_management/public/components/create_index_pattern_wizard/create_index_pattern_wizard.tsx b/src/plugins/index_pattern_management/public/components/create_index_pattern_wizard/create_index_pattern_wizard.tsx index 4083cb3d3700..6f0fd34899bb 100644 --- a/src/plugins/index_pattern_management/public/components/create_index_pattern_wizard/create_index_pattern_wizard.tsx +++ b/src/plugins/index_pattern_management/public/components/create_index_pattern_wizard/create_index_pattern_wizard.tsx @@ -65,6 +65,7 @@ import { DataSourceRef, IndexPatternManagmentContextValue } from '../../types'; import { MatchedItem } from './types'; import { DuplicateIndexPatternError, IndexPattern } from '../../../../data/public'; import { StepDataSource } from './components/step_data_source'; +import { ExperimentalCallout } from '../experimental_callout'; interface CreateIndexPatternWizardState { step: StepType; @@ -353,6 +354,7 @@ export class CreateIndexPatternWizard extends Component< return ( <> + {this.dataSourceEnabled ? : null} {content} + +
+
+ + + Experimental feature active + +
+ +
+ +
+ +
+

+ The experimental feature + + Data Source Connection + + is active. To create an index pattern without using data from an external source, use + + default + + . Any index pattern created using an external data source will result in an error if the experimental feature is deactivated. +

+
+ +
+ +
+ +
+ + +
+ + +`; diff --git a/src/plugins/index_pattern_management/public/components/experimental_callout/experimental_callout.test.tsx b/src/plugins/index_pattern_management/public/components/experimental_callout/experimental_callout.test.tsx new file mode 100644 index 000000000000..a00fb635bd02 --- /dev/null +++ b/src/plugins/index_pattern_management/public/components/experimental_callout/experimental_callout.test.tsx @@ -0,0 +1,26 @@ +/* + * Copyright OpenSearch Contributors + * SPDX-License-Identifier: Apache-2.0 + */ + +import React from 'react'; +import { mount } from 'enzyme'; +import { ExperimentalCallout } from './experimental_callout'; + +const titleIdentifier = '.euiCallOutHeader__title'; +const descriptionIdentifier = '[data-test-subj="index-pattern-experimental-callout-text"]'; +const expectedTitleText = 'Experimental feature active'; +const expectedDescriptionText = + 'The experimental feature Data Source Connection is active. To create an index pattern without using data from an external source, use default. Any index pattern created using an external data source will result in an error if the experimental feature is deactivated.'; + +describe('Index pattern experimental callout component', () => { + test('should render normally', () => { + const component = mount(); + const titleText = component.find(titleIdentifier).text(); + const descriptionText = component.find(descriptionIdentifier).last().text(); + + expect(titleText).toBe(expectedTitleText); + expect(descriptionText).toBe(expectedDescriptionText); + expect(component).toMatchSnapshot(); + }); +}); diff --git a/src/plugins/index_pattern_management/public/components/experimental_callout/experimental_callout.tsx b/src/plugins/index_pattern_management/public/components/experimental_callout/experimental_callout.tsx new file mode 100644 index 000000000000..96859204d637 --- /dev/null +++ b/src/plugins/index_pattern_management/public/components/experimental_callout/experimental_callout.tsx @@ -0,0 +1,66 @@ +/* + * Copyright OpenSearch Contributors + * SPDX-License-Identifier: Apache-2.0 + */ + +import React from 'react'; +import { i18n } from '@osd/i18n'; +import { EuiCallOut, EuiSpacer, EuiText } from '@elastic/eui'; + +export const ExperimentalCallout = () => { + return ( + <> + + +

+ {DESCRIPTION_FIRST_PART} + {DATASOURCE_CONNECTION} + {DESCRIPTION_SECOND_PART} + {DEFAULT} + {DESCRIPTION_THIRD_PART} +

+ + + + + ); +}; + +const TITLE = i18n.translate('indexPatternManagement.experimentalFeatureCallout.title', { + defaultMessage: 'Experimental feature active', +}); + +const DESCRIPTION_FIRST_PART = i18n.translate( + 'indexPatternManagement.experimentalFeatureCallout.descriptionPartOne', + { + defaultMessage: 'The experimental feature ', + } +); +const DATASOURCE_CONNECTION = i18n.translate( + 'indexPatternManagement.experimentalFeatureCallout.datasourceConnection', + { + defaultMessage: 'Data Source Connection ', + } +); +const DESCRIPTION_SECOND_PART = i18n.translate( + 'indexPatternManagement.experimentalFeatureCallout.descriptionPartTwo', + { + defaultMessage: + 'is active. To create an index pattern without using data from an external source, use ', + } +); +const DEFAULT = i18n.translate('indexPatternManagement.experimentalFeatureCallout.default', { + defaultMessage: 'default', +}); +const DESCRIPTION_THIRD_PART = i18n.translate( + 'indexPatternManagement.experimentalFeatureCallout.descriptionPartThree', + { + defaultMessage: + '. Any index pattern created using an external data source will result in an error if the experimental feature is deactivated.', + } +); diff --git a/src/plugins/index_pattern_management/public/components/experimental_callout/index.ts b/src/plugins/index_pattern_management/public/components/experimental_callout/index.ts new file mode 100644 index 000000000000..1f6d2620bf37 --- /dev/null +++ b/src/plugins/index_pattern_management/public/components/experimental_callout/index.ts @@ -0,0 +1,6 @@ +/* + * Copyright OpenSearch Contributors + * SPDX-License-Identifier: Apache-2.0 + */ + +export * from './experimental_callout'; diff --git a/src/plugins/index_pattern_management/public/components/index_pattern_table/index_pattern_table.tsx b/src/plugins/index_pattern_management/public/components/index_pattern_table/index_pattern_table.tsx index 85b47b3a1ff8..8993d64750ef 100644 --- a/src/plugins/index_pattern_management/public/components/index_pattern_table/index_pattern_table.tsx +++ b/src/plugins/index_pattern_management/public/components/index_pattern_table/index_pattern_table.tsx @@ -58,6 +58,7 @@ import { EmptyState } from './empty_state'; import { MatchedItem, ResolveIndexResponseItemAlias } from '../create_index_pattern_wizard/types'; import { EmptyIndexPatternPrompt } from './empty_index_pattern_prompt'; import { getIndices } from '../create_index_pattern_wizard/lib'; +import { ExperimentalCallout } from '../experimental_callout'; const pagination = { initialPageSize: 10, @@ -261,36 +262,39 @@ export const IndexPatternTable = ({ canSave, history }: Props) => { } return ( - - - - -

{title}

- - - -

- -

- - - {createButton} - - - - + <> + {dataSourceEnabled ? : null} + + + + +

{title}

+ + + +

+ +

+ + + {createButton} + + + + + ); };