diff --git a/x-pack/platform/plugins/shared/automatic_import/public/components/create_integration/create_automatic_import/steps/data_stream_step/data_stream_step.test.tsx b/x-pack/platform/plugins/shared/automatic_import/public/components/create_integration/create_automatic_import/steps/data_stream_step/data_stream_step.test.tsx index a7dd8eae0fdab..18b670b8d7b93 100644 --- a/x-pack/platform/plugins/shared/automatic_import/public/components/create_integration/create_automatic_import/steps/data_stream_step/data_stream_step.test.tsx +++ b/x-pack/platform/plugins/shared/automatic_import/public/components/create_integration/create_automatic_import/steps/data_stream_step/data_stream_step.test.tsx @@ -8,7 +8,7 @@ import React from 'react'; import { render, act, type RenderResult, fireEvent } from '@testing-library/react'; import { TestProvider } from '../../../../../mocks/test_provider'; -import { DataStreamStep } from './data_stream_step'; +import { DataStreamStep, getNameFromTitle } from './data_stream_step'; import { ActionsProvider } from '../../state'; import { mockActions, mockState } from '../../mocks/state'; @@ -284,4 +284,57 @@ describe('DataStreamStep', () => { expect(result.queryByTestId('generationModal')).toBeInTheDocument(); }); }); + + describe('when integrationSettings has an invalid generated name from title', () => { + describe.each(['123 abc', '1a'])('should render error for %s', (invalidTitle) => { + let result: RenderResult; + beforeEach(() => { + jest.clearAllMocks(); + result = render( + , + { wrapper } + ); + }); + + it('should set empty name for invalid title', () => { + const input = result.getByTestId('nameInput'); + expect(input).toHaveValue(''); // name is not set + }); + }); + }); + + describe('when integrationSettings has an valid generated name from title', () => { + describe.each(['abc 123', '$abc123', 'abc 123 abc', 'abc_123', 'abc_123_abc'])( + 'should render error for %s', + (validTitle) => { + let result: RenderResult; + beforeEach(() => { + jest.clearAllMocks(); + result = render( + , + { wrapper } + ); + }); + + it('should auto-generate name from title', () => { + const input = result.getByTestId('nameInput'); + expect(input).toHaveValue(getNameFromTitle(validTitle)); + expect(mockActions.setIntegrationSettings).toHaveBeenCalledWith({ + name: getNameFromTitle(validTitle), + title: validTitle, + }); + }); + } + ); + }); }); diff --git a/x-pack/platform/plugins/shared/automatic_import/public/components/create_integration/create_automatic_import/steps/data_stream_step/data_stream_step.tsx b/x-pack/platform/plugins/shared/automatic_import/public/components/create_integration/create_automatic_import/steps/data_stream_step/data_stream_step.tsx index d929dae7812e3..4c9e9270b9c71 100644 --- a/x-pack/platform/plugins/shared/automatic_import/public/components/create_integration/create_automatic_import/steps/data_stream_step/data_stream_step.tsx +++ b/x-pack/platform/plugins/shared/automatic_import/public/components/create_integration/create_automatic_import/steps/data_stream_step/data_stream_step.tsx @@ -55,7 +55,8 @@ export const InputTypeOptions: Array> = [ const isValidName = (name: string) => NAME_REGEX_PATTERN.test(name); const isValidDatastreamName = (name: string) => DATASTREAM_NAME_REGEX_PATTERN.test(name); -const getNameFromTitle = (title: string) => title.toLowerCase().replaceAll(/[^a-z0-9]/g, '_'); +export const getNameFromTitle = (title: string) => + title.toLowerCase().replaceAll(/[^a-z0-9]/g, '_'); interface DataStreamStepProps { integrationSettings: State['integrationSettings']; @@ -132,7 +133,7 @@ export const DataStreamStep = React.memo( // Only executed once when the packageNames are loaded if (packageNames != null && integrationSettings?.name == null && integrationSettings?.title) { const generatedName = getNameFromTitle(integrationSettings.title); - if (!packageNames.has(generatedName)) { + if (!packageNames.has(generatedName) && isValidName(generatedName)) { setName(generatedName); setIntegrationValues({ name: generatedName }); } @@ -195,7 +196,7 @@ export const DataStreamStep = React.memo(