diff --git a/x-pack/solutions/security/plugins/security_solution/public/siem_migrations/common/components/header_buttons/index.test.tsx b/x-pack/solutions/security/plugins/security_solution/public/siem_migrations/common/components/header_buttons/index.test.tsx
index f78766e593373..7cb2553bf4ddd 100644
--- a/x-pack/solutions/security/plugins/security_solution/public/siem_migrations/common/components/header_buttons/index.test.tsx
+++ b/x-pack/solutions/security/plugins/security_solution/public/siem_migrations/common/components/header_buttons/index.test.tsx
@@ -28,6 +28,37 @@ describe('HeaderButtons', () => {
expect(getByTestId('siemMigrationsSelectMigrationButton')).toBeInTheDocument();
});
+ it('marks only the option with the selected migration id as selected when names are duplicated', () => {
+ const [first, second] = getMigrationsStatsMock();
+ const migrationsWithDuplicateNames = [
+ { ...first, name: 'Same name', id: '1' },
+ { ...second, name: 'Same name', id: '2' },
+ ];
+
+ const { getByTestId } = render(
+
+
+
+ );
+
+ const siemMigrationsSelectMigrationButton = getByTestId('siemMigrationsSelectMigrationButton');
+ const comboBoxToggleListButton = within(siemMigrationsSelectMigrationButton).getByTestId(
+ 'comboBoxToggleListButton'
+ );
+ fireEvent.click(comboBoxToggleListButton);
+
+ const option1 = getByTestId('migrationSelectionOption-1');
+ const option2 = getByTestId('migrationSelectionOption-2');
+
+ expect(option1).toHaveAttribute('aria-selected', 'true');
+ expect(option2).toHaveAttribute('aria-selected', 'false');
+ });
+
it('calls onMigrationIdChange when a migration is selected', () => {
const { getByTestId, getByText } = render(
diff --git a/x-pack/solutions/security/plugins/security_solution/public/siem_migrations/common/components/header_buttons/index.tsx b/x-pack/solutions/security/plugins/security_solution/public/siem_migrations/common/components/header_buttons/index.tsx
index 5efbca8c07309..74e46939144c9 100644
--- a/x-pack/solutions/security/plugins/security_solution/public/siem_migrations/common/components/header_buttons/index.tsx
+++ b/x-pack/solutions/security/plugins/security_solution/public/siem_migrations/common/components/header_buttons/index.tsx
@@ -31,6 +31,7 @@ export const SIEM_MIGRATIONS_SELECT_MIGRATION_BUTTON_ID = 'siemMigrationsSelectM
const migrationStatsToComboBoxOption = (
stats: MigrationTaskStats
): EuiComboBoxOptionOption => ({
+ key: stats.id,
value: stats.id,
label: stats.name,
'data-test-subj': `migrationSelectionOption-${stats.id}`,
@@ -60,8 +61,10 @@ export const HeaderButtons: React.FC = React.memo(
const migrationVendor = useMemo(() => selectedMigrationStats?.vendor, [selectedMigrationStats]);
const selectedMigrationOption = useMemo>>(() => {
- return selectedMigrationStats ? [migrationStatsToComboBoxOption(selectedMigrationStats)] : [];
- }, [selectedMigrationStats]);
+ if (!selectedMigrationId) return [];
+ const selected = migrationOptions.find((opt) => opt.value === selectedMigrationId);
+ return selected ? [selected] : [];
+ }, [migrationOptions, selectedMigrationId]);
const onChange = (selected: Array>) => {
onMigrationIdChange(selected[0].value);