fix(site): gracefully handle reselection of the same preset (#17014)

This PR closes https://github.com/coder/coder/issues/16953.

Reselecting a preset that was already the selected preset returned an
undefined option to the onSelect function. We then tried to read an
attribute of this undefined value. With this fix, we handle the
undefined option correctly.

site/src/pages/CreateWorkspacePage/CreateWorkspacePageView.stories.tsx

@@ -159,6 +159,25 @@ export const PresetSelected: Story = {
 	},
 };
 
+export const PresetReselected: Story = {
+	args: PresetsButNoneSelected.args,
+	play: async ({ canvasElement }) => {
+		const canvas = within(canvasElement);
+
+		// First selection of Preset 1
+		await userEvent.click(canvas.getByLabelText("Preset"));
+		await userEvent.click(
+			canvas.getByText("Preset 1", { selector: ".MuiMenuItem-root" }),
+		);
+
+		// Reselect the same preset
+		await userEvent.click(canvas.getByLabelText("Preset"));
+		await userEvent.click(
+			canvas.getByText("Preset 1", { selector: ".MuiMenuItem-root" }),
+		);
+	},
+};
+
 export const ExternalAuth: Story = {
 	args: {
 		externalAuth: [

site/src/pages/CreateWorkspacePage/CreateWorkspacePageView.tsx

@@ -286,11 +286,13 @@ export const CreateWorkspacePageView: FC<CreateWorkspacePageViewProps> = ({
 										label="Preset"
 										options={presetOptions}
 										onSelect={(option) => {
-											setSelectedPresetIndex(
-												presetOptions.findIndex(
-													(preset) => preset.value === option?.value,
-												),
+											const index = presetOptions.findIndex(
+												(preset) => preset.value === option?.value,
 											);
+											if (index === -1) {
+												return;
+											}
+											setSelectedPresetIndex(index);
 										}}
 										placeholder="Select a preset"
 										selectedOption={presetOptions[selectedPresetIndex]}