diff --git a/CHANGELOG.md b/CHANGELOG.md index 51a2d0803b52..924aa5280c9e 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -38,6 +38,7 @@ Inspired from [Keep a Changelog](https://keepachangelog.com/en/1.0.0/) * [Multi DataSource] Skip data source view in index pattern step when pick default ([#2574](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/2574)) * [Multi DataSource] Address UX comments on Edit Data source page ([#2629](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/2629)) * [BUG] Fix suggestion list cutoff issue ([#2607](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/2607)) +* [Multi DataSource] Address UX comments on index pattern management stack ([#2611](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/2611)) ### 🚞 Infrastructure diff --git a/src/plugins/data_source_management/public/components/data_source_column/data_source_column.tsx b/src/plugins/data_source_management/public/components/data_source_column/data_source_column.tsx index 6ac2258b7811..640eb1b369fd 100644 --- a/src/plugins/data_source_management/public/components/data_source_column/data_source_column.tsx +++ b/src/plugins/data_source_management/public/components/data_source_column/data_source_column.tsx @@ -24,7 +24,7 @@ export class DataSourceColumn implements IndexPatternTableColumn<DataSourceMap> public euiColumn = { field: 'referenceId', name: i18n.translate('dataSource.management.dataSourceColumn', { - defaultMessage: 'Data Source', + defaultMessage: 'Data Source Connection', }), render: (referenceId: string, index: IndexPatternTableRecord) => { if (!referenceId) { diff --git a/src/plugins/index_pattern_management/public/components/create_index_pattern_wizard/components/step_data_source/components/header/__snapshots__/header.test.tsx.snap b/src/plugins/index_pattern_management/public/components/create_index_pattern_wizard/components/step_data_source/components/header/__snapshots__/header.test.tsx.snap deleted file mode 100644 index e2e49b95177c..000000000000 --- a/src/plugins/index_pattern_management/public/components/create_index_pattern_wizard/components/step_data_source/components/header/__snapshots__/header.test.tsx.snap +++ /dev/null @@ -1,203 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`Header should render existing data sources list when choose to use data source 1`] = ` -<Fragment> - <div> - <EuiTitle - size="s" - > - <h2> - <FormattedMessage - defaultMessage="Step {currentStepNumber} of {totalStepNumber}: Configure data source" - id="indexPatternManagement.createIndexPattern.stepDataSourceHeader" - values={ - Object { - "currentStepNumber": 0, - "totalStepNumber": 0, - } - } - /> - </h2> - </EuiTitle> - <EuiText> - <FormattedMessage - defaultMessage="Pick a data source within which to configure index patterns." - id="indexPatternManagement.createIndexPattern.stepDataSourceLabel" - values={Object {}} - /> - </EuiText> - <EuiSpacer - size="m" - /> - <EuiRadio - checked={false} - compressed={true} - data-test-subj="createIndexPatternStepDataSourceUseDefaultRadio" - id="useDefault" - label={ - <FormattedMessage - defaultMessage="Use default data source" - id="indexPatternManagement.createIndexPattern.stepDataSource.useDefaultLabel" - values={Object {}} - /> - } - onChange={[Function]} - /> - <EuiSpacer - size="m" - /> - <EuiRadio - checked={true} - compressed={true} - data-test-subj="createIndexPatternStepDataSourceUseDataSourceRadio" - id="useDataSource" - label={ - <FormattedMessage - defaultMessage="Use external data source connection" - id="indexPatternManagement.createIndexPattern.stepDataSource.useDataSourceLabel" - values={Object {}} - /> - } - onChange={[Function]} - /> - <EuiFlexItem - grow={false} - > - <EuiSpacer - size="m" - /> - <EuiSelectable - aria-label="Search data sources" - isPreFiltered={false} - onChange={[Function]} - options={Array []} - searchProps={ - Object { - "data-test-subj": "selectDataSources", - "isInvalid": true, - "placeholder": "Search data sources", - } - } - searchable={true} - singleSelection="always" - > - <Component /> - </EuiSelectable> - </EuiFlexItem> - <EuiSpacer - size="m" - /> - <EuiFlexGroup - justifyContent="flexEnd" - > - <EuiFlexItem - grow={false} - > - <EuiButton - data-test-subj="createIndexPatternStepDataSourceNextStepButton" - fill={true} - iconSide="right" - iconType="arrowRight" - isDisabled={true} - onClick={[Function]} - > - <FormattedMessage - defaultMessage="Next step" - id="indexPatternManagement.createIndexPattern.step.nextStepButton" - values={Object {}} - /> - </EuiButton> - </EuiFlexItem> - </EuiFlexGroup> - </div> -</Fragment> -`; - -exports[`Header should render normally 1`] = ` -<Fragment> - <div> - <EuiTitle - size="s" - > - <h2> - <FormattedMessage - defaultMessage="Step {currentStepNumber} of {totalStepNumber}: Configure data source" - id="indexPatternManagement.createIndexPattern.stepDataSourceHeader" - values={ - Object { - "currentStepNumber": 0, - "totalStepNumber": 0, - } - } - /> - </h2> - </EuiTitle> - <EuiText> - <FormattedMessage - defaultMessage="Pick a data source within which to configure index patterns." - id="indexPatternManagement.createIndexPattern.stepDataSourceLabel" - values={Object {}} - /> - </EuiText> - <EuiSpacer - size="m" - /> - <EuiRadio - checked={true} - compressed={true} - data-test-subj="createIndexPatternStepDataSourceUseDefaultRadio" - id="useDefault" - label={ - <FormattedMessage - defaultMessage="Use default data source" - id="indexPatternManagement.createIndexPattern.stepDataSource.useDefaultLabel" - values={Object {}} - /> - } - onChange={[Function]} - /> - <EuiSpacer - size="m" - /> - <EuiRadio - checked={false} - compressed={true} - data-test-subj="createIndexPatternStepDataSourceUseDataSourceRadio" - id="useDataSource" - label={ - <FormattedMessage - defaultMessage="Use external data source connection" - id="indexPatternManagement.createIndexPattern.stepDataSource.useDataSourceLabel" - values={Object {}} - /> - } - onChange={[Function]} - /> - <EuiSpacer - size="m" - /> - <EuiFlexGroup - justifyContent="flexEnd" - > - <EuiFlexItem - grow={false} - > - <EuiButton - data-test-subj="createIndexPatternStepDataSourceNextStepButton" - fill={true} - iconSide="right" - iconType="arrowRight" - isDisabled={false} - onClick={[Function]} - > - <FormattedMessage - defaultMessage="Next step" - id="indexPatternManagement.createIndexPattern.step.nextStepButton" - values={Object {}} - /> - </EuiButton> - </EuiFlexItem> - </EuiFlexGroup> - </div> -</Fragment> -`; diff --git a/src/plugins/index_pattern_management/public/components/create_index_pattern_wizard/components/step_data_source/components/header/header.test.tsx b/src/plugins/index_pattern_management/public/components/create_index_pattern_wizard/components/step_data_source/components/header/header.test.tsx index 8a7aa9b1e461..ffb80bec555f 100644 --- a/src/plugins/index_pattern_management/public/components/create_index_pattern_wizard/components/step_data_source/components/header/header.test.tsx +++ b/src/plugins/index_pattern_management/public/components/create_index_pattern_wizard/components/step_data_source/components/header/header.test.tsx @@ -18,20 +18,6 @@ jest.mock('../../../../../../../../../plugins/opensearch_dashboards_react/public afterAll(() => jest.clearAllMocks()); describe('Header', () => { - it('should render normally', () => { - const component = shallowWithIntl( - <Header - onDataSourceSelected={() => {}} - dataSourceRef={{ type: 'type', id: 'id', title: 'title' }!} - goToNextStep={() => {}} - isNextStepDisabled={true} - stepInfo={{ totalStepNumber: 0, currentStepNumber: 0 }} - /> - ); - - expect(component).toMatchSnapshot(); - }); - it('should render existing data sources list when choose to use data source', () => { const component = shallowWithIntl( <Header @@ -51,7 +37,12 @@ describe('Header', () => { }, }); - expect(component).toMatchSnapshot(); + expect( + component + .find('[data-test-subj="createIndexPatternStepDataSourceSelectDataSource"]') + .first() + .exists() + ).toBeTruthy(); }); it('should disable next step before select data source', () => { diff --git a/src/plugins/index_pattern_management/public/components/create_index_pattern_wizard/components/step_data_source/components/header/header.tsx b/src/plugins/index_pattern_management/public/components/create_index_pattern_wizard/components/step_data_source/components/header/header.tsx index d7af93be8f5b..e5a6fdf60c0e 100644 --- a/src/plugins/index_pattern_management/public/components/create_index_pattern_wizard/components/step_data_source/components/header/header.tsx +++ b/src/plugins/index_pattern_management/public/components/create_index_pattern_wizard/components/step_data_source/components/header/header.tsx @@ -64,7 +64,7 @@ export const Header: React.FC<HeaderProps> = (props: HeaderProps) => { } }) .catch(() => { - toasts.addWarning( + toasts.addDanger( i18n.translate( 'indexPatternManagement.createIndexPattern.stepDataSource.fetchDataSourceError', { @@ -145,6 +145,7 @@ export const Header: React.FC<HeaderProps> = (props: HeaderProps) => { <EuiFlexItem grow={false}> <EuiSpacer size="m" /> <EuiSelectable + data-test-subj="createIndexPatternStepDataSourceSelectDataSource" aria-label={i18n.translate( 'indexPatternManagement.createIndexPattern.stepDataSource.searchlabel', { @@ -160,7 +161,6 @@ export const Header: React.FC<HeaderProps> = (props: HeaderProps) => { defaultMessage: 'Search data sources', } ), - isInvalid: !!dataSources, }} singleSelection={'always'} options={dataSources}