chore: remove UI changes

ssncferreira · ssncferreira · commit f9b00ae94566 · 2025-07-28T11:19:36.000Z
diff --git a/site/src/pages/CreateWorkspacePage/CreateWorkspacePageView.stories.tsx b/site/src/pages/CreateWorkspacePage/CreateWorkspacePageView.stories.tsx
@@ -126,31 +126,24 @@ export const PresetsButNoneSelected: Story = {
 			{
 				ID: "preset-1",
 				Name: "Preset 1",
-				Description: "",
-				Icon: "",
 				Default: false,
 				Parameters: [
 					{
 						Name: MockTemplateVersionParameter1.name,
 						Value: "preset 1 override",
 					},
 				],
-				DesiredPrebuildInstances: null,
 			},
 			{
 				ID: "preset-2",
 				Name: "Preset 2",
-				Description:
-					"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse imperdiet ultricies massa, eu dapibus ex fermentum ac.",
-				Icon: "/emojis/1f60e.png",
 				Default: false,
 				Parameters: [
 					{
 						Name: MockTemplateVersionParameter2.name,
 						Value: "42",
 					},
 				],
-				DesiredPrebuildInstances: null,
 			},
 		],
 		parameters: [
@@ -257,31 +250,24 @@ export const PresetsWithDefault: Story = {
 			{
 				ID: "preset-1",
 				Name: "Preset 1",
-				Icon: "",
-				Description: "",
 				Default: false,
 				Parameters: [
 					{
 						Name: MockTemplateVersionParameter1.name,
 						Value: "preset 1 override",
 					},
 				],
-				DesiredPrebuildInstances: null,
 			},
 			{
 				ID: "preset-2",
 				Name: "Preset 2",
-				Icon: "/emojis/1f60e.png",
-				Description:
-					"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse imperdiet ultricies massa, eu dapibus ex fermentum ac.",
 				Default: true,
 				Parameters: [
 					{
 						Name: MockTemplateVersionParameter2.name,
 						Value: "150189",
 					},
 				],
-				DesiredPrebuildInstances: null,
 			},
 		],
 		parameters: [
diff --git a/site/src/pages/CreateWorkspacePage/CreateWorkspacePageView.tsx b/site/src/pages/CreateWorkspacePage/CreateWorkspacePageView.tsx
@@ -6,14 +6,14 @@ import { Alert } from "components/Alert/Alert";
 import { ErrorAlert } from "components/Alert/ErrorAlert";
 import { Avatar } from "components/Avatar/Avatar";
 import { Button } from "components/Button/Button";
+import { SelectFilter } from "components/Filter/SelectFilter";
 import {
 	FormFields,
 	FormFooter,
 	FormSection,
 	HorizontalForm,
 } from "components/Form/Form";
 import { Margins } from "components/Margins/Margins";
-import { MultiSelectCombobox } from "components/MultiSelectCombobox/MultiSelectCombobox";
 import {
 	PageHeader,
 	PageHeaderSubtitle,
@@ -159,12 +159,10 @@ export const CreateWorkspacePageView: FC<CreateWorkspacePageViewProps> = ({
 	// Build options and keep default label/value in sync
 	useEffect(() => {
 		const options = [
-			{ label: "None", value: "", icon: undefined, description: undefined },
-			...presets.map((preset) => ({
-				label: preset.Default ? `${preset.Name} (Default)` : preset.Name,
-				value: preset.ID,
-				icon: preset.Icon,
-				description: preset.Description,
+			{ label: "None", value: "" },
+			...presets.map((p) => ({
+				label: p.Default ? `${p.Name} (Default)` : p.Name,
+				value: p.ID,
 			})),
 		];
 		setPresetOptions(options);
@@ -382,49 +380,25 @@ export const CreateWorkspacePageView: FC<CreateWorkspacePageViewProps> = ({
 									</Stack>
 									<Stack direction="column" spacing={2}>
 										<Stack direction="row" spacing={2}>
-											<MultiSelectCombobox
-												inputProps={{ id: "preset-select" }}
+											<SelectFilter
+												label="Preset"
 												options={presetOptions}
-												defaultOptions={presetOptions}
-												value={
-													presetOptions[selectedPresetIndex]
-														? [presetOptions[selectedPresetIndex]]
-														: []
-												}
-												onChange={(option) => {
-													// Handle single selection replacement
-													if (option.length > 0) {
-														// Take the most recently selected option
-														const selectedOption = option[option.length - 1];
-														const index = presetOptions.findIndex(
-															(preset) => preset.value === selectedOption.value,
-														);
-														if (index !== -1) {
-															setSelectedPresetIndex(index);
-															form.setFieldValue(
-																"template_version_preset_id",
-																selectedOption.value === ""
-																	? undefined
-																	: selectedOption.value,
-															);
-														}
-													} else {
-														// None preset selected
-														setSelectedPresetIndex(0);
-														form.setFieldValue(
-															"template_version_preset_id",
-															undefined,
-														);
+												onSelect={(option) => {
+													const index = presetOptions.findIndex(
+														(preset) => preset.value === option?.value,
+													);
+													if (index === -1) {
+														return;
 													}
+													setSelectedPresetIndex(index);
+													form.setFieldValue(
+														"template_version_preset_id",
+														// Empty string is equivalent to using None
+														option?.value === "" ? undefined : option?.value,
+													);
 												}}
-												hidePlaceholderWhenSelected
 												placeholder="Select a preset"
-												emptyIndicator={
-													<p className="text-center text-md text-content-primary">
-														No presets found
-													</p>
-												}
-												disabled={false}
+												selectedOption={presetOptions[selectedPresetIndex]}
 											/>
 										</Stack>
 										{/* Only show the preset parameter visibility toggle if preset parameters are actually being modified, otherwise it has no effect. */}
