Skip to content

[Streams] Add suggested name #253652

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
SoniaSanzV merged 7 commits into from
Feb 18, 2026
Merged

[Streams] Add suggested name #253652

Show file tree
Hide file tree
Changes from 2 commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
a7cf598
Add suggested name
SoniaSanzV Feb 18, 2026
b46d150
Integrate with the consumer
SoniaSanzV Feb 18, 2026
7d59ef2
Address suggestions
SoniaSanzV Feb 18, 2026
a7fd1ab
Change test name
SoniaSanzV Feb 18, 2026
4f60825
remove useEffect
SoniaSanzV Feb 18, 2026
240c9e1
Merge branch 'main' into downsampling/create_new_policy_modal_suggest…
SoniaSanzV Feb 18, 2026
ca03acd
Merge branch 'main' into downsampling/create_new_policy_modal_suggest…
SoniaSanzV Feb 18, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
26 changes: 26 additions & 0 deletions ...detail_lifecycle/downsampling/create_new_policy_modal/create_new_policy_modal.stories.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -22,6 +22,7 @@ type Story = StoryObj<typeof CreatePolicyModal>;
export const Default: Story = {
args: {
policyNames: ['logs-default', 'metrics-prod', 'my-policy'],
originalPolicyName: 'my-policy',
},
render: (args) => {
const Story = ({ policyNames }: { policyNames: string[] }) => {
Expand All @@ -34,6 +35,31 @@ export const Default: Story = {
policyNames={policyNames}
onBack={action('onBack')}
onSave={action('onSave')}
originalPolicyName={args.originalPolicyName}
/>
</EuiOverlayMask>
);
};
return <Story policyNames={args.policyNames ?? []} />;
},
};
export const WithExistingPolicyName: Story = {
args: {
policyNames: ['logs-default', 'metrics-prod', 'my-policy-2', 'my-policy-3'],
originalPolicyName: 'my-policy',
},
render: (args) => {
const Story = ({ policyNames }: { policyNames: string[] }) => {
useEffect(() => {
action('policyNames')(policyNames);
}, [policyNames]);
return (
<EuiOverlayMask>
<CreatePolicyModal
policyNames={policyNames}
onBack={action('onBack')}
onSave={action('onSave')}
originalPolicyName={args.originalPolicyName}
/>
</EuiOverlayMask>
);
Expand Down
104 changes: 96 additions & 8 deletions ...am_detail_lifecycle/downsampling/create_new_policy_modal/create_new_policy_modal.test.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,12 @@ describe('CreatePolicyModal', () => {

it('renders title and policy name input', () => {
renderWithI18n(
<CreatePolicyModal policyNames={policyNames} onBack={() => {}} onSave={() => {}} />
<CreatePolicyModal
policyNames={policyNames}
onBack={() => {}}
onSave={() => {}}
originalPolicyName="my-policy"
/>
);

expect(screen.getByTestId('createPolicyModalTitle')).toHaveTextContent(
Expand All @@ -27,7 +32,12 @@ describe('CreatePolicyModal', () => {
it('calls onBack when back button is clicked', () => {
const onBack = jest.fn();
renderWithI18n(
<CreatePolicyModal policyNames={policyNames} onBack={onBack} onSave={() => {}} />
<CreatePolicyModal
policyNames={policyNames}
onBack={onBack}
onSave={() => {}}
originalPolicyName="my-policy"
/>
);

fireEvent.click(screen.getByTestId('createPolicyModal-backButton'));
Expand All @@ -37,7 +47,12 @@ describe('CreatePolicyModal', () => {
it('submits a valid policy name', async () => {
const onSave = jest.fn();
renderWithI18n(
<CreatePolicyModal policyNames={policyNames} onBack={() => {}} onSave={onSave} />
<CreatePolicyModal
policyNames={policyNames}
onBack={() => {}}
onSave={onSave}
originalPolicyName="my-policy"
/>
);

fireEvent.change(screen.getByTestId('createPolicyModal-policyNameInput'), {
Expand All @@ -51,6 +66,54 @@ describe('CreatePolicyModal', () => {
await waitFor(() => expect(onSave).toHaveBeenCalledWith('new-policy'));
});

it('pre-populates the policy name field with the original policy name', () => {

@damian-polewski damian-polewski Feb 18, 2026

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

nit: It's not really the original policy name but original + "-2" so we can change it for clarity.

Suggested change
it('pre-populates the policy name field with the original policy name', () => {
it('pre-populates with the default copy name', () => {

@SoniaSanzV SoniaSanzV Feb 18, 2026

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Addressed with a7fd1ab

renderWithI18n(
<CreatePolicyModal
policyNames={policyNames}
onBack={() => {}}
onSave={() => {}}
originalPolicyName="my-policy"
/>
);
expect(screen.getByTestId('createPolicyModal-policyNameInput')).toHaveValue('my-policy-2');
});

it('pre-populates with the first available copy name when the default already exists', () => {
renderWithI18n(
<CreatePolicyModal
policyNames={[...policyNames, 'my-policy-2']}
onBack={() => {}}
onSave={() => {}}
originalPolicyName="my-policy"
/>
);

expect(screen.getByTestId('createPolicyModal-policyNameInput')).toHaveValue('my-policy-3');
});

it('does not suggest a copy name after 9 attempts', () => {
renderWithI18n(
<CreatePolicyModal
policyNames={[
...policyNames,
'my-policy-2',
'my-policy-3',
'my-policy-4',
'my-policy-5',
'my-policy-6',
'my-policy-7',
'my-policy-8',
'my-policy-9',
]}
onBack={() => {}}
onSave={() => {}}
originalPolicyName="my-policy"
/>
);

expect(screen.getByTestId('createPolicyModal-policyNameInput')).toHaveValue('');
});

describe('policy name validation', () => {
const validationDebounceMs = 500;
const advanceValidation = async () => {
Expand All @@ -70,7 +133,12 @@ describe('CreatePolicyModal', () => {

it('shows an error for duplicate policy names', async () => {
renderWithI18n(
<CreatePolicyModal policyNames={policyNames} onBack={() => {}} onSave={() => {}} />
<CreatePolicyModal
policyNames={policyNames}
onBack={() => {}}
onSave={() => {}}
originalPolicyName="my-policy"
/>
);

const input = screen.getByTestId('createPolicyModal-policyNameInput');
Expand All @@ -85,7 +153,12 @@ describe('CreatePolicyModal', () => {

it('shows an error for empty policy name', async () => {
renderWithI18n(
<CreatePolicyModal policyNames={policyNames} onBack={() => {}} onSave={() => {}} />
<CreatePolicyModal
policyNames={policyNames}
onBack={() => {}}
onSave={() => {}}
originalPolicyName="my-policy"
/>
);

const input = screen.getByTestId('createPolicyModal-policyNameInput');
Expand All @@ -99,7 +172,12 @@ describe('CreatePolicyModal', () => {

it('shows an error for policy names that start with an underscore', async () => {
renderWithI18n(
<CreatePolicyModal policyNames={policyNames} onBack={() => {}} onSave={() => {}} />
<CreatePolicyModal
policyNames={policyNames}
onBack={() => {}}
onSave={() => {}}
originalPolicyName="my-policy"
/>
);

const input = screen.getByTestId('createPolicyModal-policyNameInput');
Expand All @@ -114,7 +192,12 @@ describe('CreatePolicyModal', () => {

it('shows an error for policy names that contain spaces or commas', async () => {
renderWithI18n(
<CreatePolicyModal policyNames={policyNames} onBack={() => {}} onSave={() => {}} />
<CreatePolicyModal
policyNames={policyNames}
onBack={() => {}}
onSave={() => {}}
originalPolicyName="my-policy"
/>
);

const input = screen.getByTestId('createPolicyModal-policyNameInput');
Expand All @@ -137,7 +220,12 @@ describe('CreatePolicyModal', () => {

it('shows an error for policy names that are too long', async () => {
renderWithI18n(
<CreatePolicyModal policyNames={policyNames} onBack={() => {}} onSave={() => {}} />
<CreatePolicyModal
policyNames={policyNames}
onBack={() => {}}
onSave={() => {}}
originalPolicyName="my-policy"
/>
);

const input = screen.getByTestId('createPolicyModal-policyNameInput');
Expand Down
28 changes: 26 additions & 2 deletions .../stream_detail_lifecycle/downsampling/create_new_policy_modal/create_new_policy_modal.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
* 2.0.
*/

import React, { useMemo } from 'react';
import React, { useEffect, useMemo } from 'react';
import { i18n } from '@kbn/i18n';
import {
EuiButton,
Expand All @@ -26,6 +26,23 @@ import { Form, UseField, useForm } from '@kbn/es-ui-shared-plugin/static/forms/h

const { emptyField, startsWithField, containsCharsField } = fieldValidators;

const getFirstAvailableCopyName = ({
originalPolicyName,
policyNames,
}: {
originalPolicyName: string;
policyNames: string[];
}) => {
const existing = new Set(policyNames);

for (let i = 2; i <= 9; i++) {
const candidate = `${originalPolicyName}-${i}`;
Comment thread
SoniaSanzV marked this conversation as resolved.
if (!existing.has(candidate)) return candidate;
}
Comment on lines +46 to +56

@damian-polewski damian-polewski Feb 18, 2026

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Do we need to check both before and inside the loop?

@SoniaSanzV SoniaSanzV Feb 18, 2026

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't think that's needed. {name}-2 and {name}-9 (max number) would have the same UTF‑8 byte length, so checking inside the loop is redundan


return '';
};

const i18nTexts = {
errors: {
policyNameRequiredMessage: i18n.translate('xpack.streams.createPolicyModal.emptyNameError', {
Expand Down Expand Up @@ -108,18 +125,20 @@ export interface CreatePolicyModalProps {
onBack: () => void;
onSave: (policyName: string) => void;
isLoading?: boolean;
originalPolicyName: string;
}

export function CreatePolicyModal({
policyNames,
onBack,
onSave,
isLoading = false,
originalPolicyName,
}: CreatePolicyModalProps) {
const modalTitleId = useGeneratedHtmlId();
const { form } = useForm({
defaultValue: {
policyName: '',
policyName: getFirstAvailableCopyName({ originalPolicyName, policyNames }),
},
});

Expand All @@ -128,6 +147,11 @@ export function CreatePolicyModal({
[policyNames]
);

useEffect(() => {
// Ensure the pre-populated value updates form.isValid so Save enables when appropriate.
void form.validate();
}, [form]);
Comment thread
SoniaSanzV marked this conversation as resolved.
Outdated

const handleSave = async () => {
const { isValid, data } = await form.submit();
if (!isValid) {
Expand Down
1 change: 1 addition & 0 deletions ...ic/components/data_management/stream_detail_lifecycle/hooks/use_ilm_lifecycle_summary.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -449,6 +449,7 @@ export const useIlmLifecycleSummary = ({
onBack={handleBackFromCreatePolicy}
onSave={handleCreatePolicy}
isLoading={isProcessing}
originalPolicyName={policyName}
/>
)}
</>
Expand Down
Loading