fix: hide the preset parameter visibility switch when it has no effect (#18574)

When no preset is selected:
<img width="1097" alt="Screenshot 2025-06-25 at 15 49 51"
src="https://github.com/user-attachments/assets/96f1244a-58f1-4e59-b6ac-9319339c764f"
/>

When a preset is selected:
<img width="1097" alt="Screenshot 2025-06-25 at 15 50 00"
src="https://github.com/user-attachments/assets/d0853169-ff93-4b1a-beaf-11012a9a02fb"
/>

Existing frontend stories provide enough validation to cover this
feature. No further testing is required.

---------

Co-authored-by: Susana Ferreira <susana@coder.com>

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

@@ -277,6 +277,8 @@ export const PresetsWithDefault: Story = {
 	},
 	play: async ({ canvasElement }) => {
 		const canvas = within(canvasElement);
+		// Wait for the switch to be available since preset parameters are populated asynchronously
+		await canvas.findByLabelText("Show preset parameters");
 		// Toggle off the show preset parameters switch
 		await userEvent.click(canvas.getByLabelText("Show preset parameters"));
 	},

site/src/pages/CreateWorkspacePage/CreateWorkspacePageView.tsx

@@ -385,25 +385,28 @@ export const CreateWorkspacePageView: FC<CreateWorkspacePageViewProps> = ({
 												selectedOption={presetOptions[selectedPresetIndex]}
 											/>
 										</Stack>
-										<div
-											css={{
-												display: "flex",
-												alignItems: "center",
-												gap: "8px",
-											}}
-										>
-											<Switch
-												id="show-preset-parameters"
-												checked={showPresetParameters}
-												onCheckedChange={setShowPresetParameters}
-											/>
-											<label
-												htmlFor="show-preset-parameters"
-												css={styles.description}
+										{/* Only show the preset parameter visibility toggle if preset parameters are actually being modified, otherwise it has no effect. */}
+										{presetParameterNames.length > 0 && (
+											<div
+												css={{
+													display: "flex",
+													alignItems: "center",
+													gap: "8px",
+												}}
 											>
-												Show preset parameters
-											</label>
-										</div>
+												<Switch
+													id="show-preset-parameters"
+													checked={showPresetParameters}
+													onCheckedChange={setShowPresetParameters}
+												/>
+												<label
+													htmlFor="show-preset-parameters"
+													css={styles.description}
+												>
+													Show preset parameters
+												</label>
+											</div>
+										)}
 									</Stack>
 								</Stack>
 							)}

site/src/pages/CreateWorkspacePage/CreateWorkspacePageViewExperimental.tsx

@@ -562,7 +562,6 @@ export const CreateWorkspacePageViewExperimental: FC<
 								<div className="flex flex-col gap-2">
 									<div className="flex gap-2 items-center">
 										<Label className="text-sm">Preset</Label>
-										<FeatureStageBadge contentType={"beta"} size="sm" />
 									</div>
 									<div className="flex flex-col gap-4">
 										<div className="max-w-lg">
@@ -594,16 +593,19 @@ export const CreateWorkspacePageViewExperimental: FC<
 												</SelectContent>
 											</Select>
 										</div>
-										<span className="flex items-center gap-3">
-											<Switch
-												id="show-preset-parameters"
-												checked={showPresetParameters}
-												onCheckedChange={setShowPresetParameters}
-											/>
-											<Label htmlFor="show-preset-parameters">
-												Show preset parameters
-											</Label>
-										</span>
+										{/* Only show the preset parameter visibility toggle if preset parameters are actually being modified, otherwise it is ineffectual */}
+										{presetParameterNames.length > 0 && (
+											<span className="flex items-center gap-3">
+												<Switch
+													id="show-preset-parameters"
+													checked={showPresetParameters}
+													onCheckedChange={setShowPresetParameters}
+												/>
+												<Label htmlFor="show-preset-parameters">
+													Show preset parameters
+												</Label>
+											</span>
+										)}
 									</div>
 								</div>
 							)}