feat: add preset selector in TasksPage #19012

johnstcn · 2025-07-23T14:43:40Z

Adds a preset selector in TasksPage ~~that is visible if the selected template version defines presets,~~ with the default preset pre-selected and at the top of the list.
If no default preset exists, the user is prompted to select one.
If a preset defines an AI Prompt, it will override the textarea.

Copilot

Pull Request Overview

This PR adds a preset selector to the TasksPage that appears when the selected template version has defined presets. If a preset contains an AI Prompt parameter, it overrides the textarea input and makes it read-only.

Adds preset selection functionality with automatic default preset selection
Implements AI prompt override behavior when presets contain AI Prompt parameters
Refactors test data by moving mock objects to shared test helpers for better reusability

Reviewed Changes

Copilot reviewed 3 out of 3 changed files in this pull request and generated 3 comments.

File	Description
site/src/testHelpers/entities.ts	Adds mock preset data and task data for testing preset functionality
site/src/pages/TasksPage/TasksPage.tsx	Implements preset selector UI, preset fetching logic, and AI prompt override behavior
site/src/pages/TasksPage/TasksPage.stories.tsx	Updates stories to use shared mock data and adds new stories for preset scenarios

site/src/pages/TasksPage/TasksPage.tsx

Copilot · 2025-07-24T11:45:45Z

site/src/pages/TasksPage/TasksPage.tsx

+							>
+								<SelectTrigger
+									id="templateID"
+									className="w-80 text-xs [&_svg]:size-icon-xs border-0 bg-surface-secondary h-8 px-3"


The template and preset selectors use identical styling (w-80 text-xs [&_svg]:size-icon-xs border-0 bg-surface-secondary h-8 px-3). Consider extracting this into a CSS class or constant to avoid duplication.

Suggested change

className="w-80 text-xs [&_svg]:size-icon-xs border-0 bg-surface-secondary h-8 px-3"

className="select-trigger-style"

johnstcn · 2025-07-24T11:46:30Z

site/src/pages/TasksPage/TasksPage.stories.tsx

-const MockTasks = [
-	{
-		workspace: {
-			...MockWorkspace,
-			latest_app_status: MockWorkspaceAppStatus,
-		},
-		prompt: "Create competitors page",
-	},
-	{
-		workspace: {
-			...MockWorkspace,
-			id: "workspace-2",
-			latest_app_status: {
-				...MockWorkspaceAppStatus,
-				message: "Avatar size fixed!",
-			},
-		},
-		prompt: "Fix user avatar size",
-	},
-	{
-		workspace: {
-			...MockWorkspace,
-			id: "workspace-3",
-			latest_app_status: {
-				...MockWorkspaceAppStatus,
-				message: "Accessibility issues fixed!",
-			},
-		},
-		prompt: "Fix accessibility issues",
-	},
-];


review: moved to entities.ts

mtojek

I don't feel super comfortable with extra useEffects, but I assume that we need to reload it dynamically, right?

mtojek · 2025-07-24T12:09:24Z

site/src/pages/TasksPage/TasksPage.tsx

+									</SelectTrigger>
+									<SelectContent>
+										{presets
+											.sort((a, b) => {


nit: maybe extract to a seperate function with a comment?

mtojek · 2025-07-24T12:17:12Z

site/src/pages/TasksPage/TasksPage.tsx

+	// Extract AI prompt from selected preset
+	const selectedPreset = presets?.find((p) => p.ID === selectedPresetId);
+	const presetAIPrompt = selectedPreset?.Parameters.find(
+		(param) => param.Name === AI_PROMPT_PARAMETER_NAME,


nit: is it special/magic parameter now?

always has been

site/src/pages/TasksPage/TasksPage.tsx

jaaydenh · 2025-07-24T14:12:47Z

Is selecting a preset required? On the create workspace page I added a "None" to make it explicit that choosing a preset is not necessary.

site/src/pages/TasksPage/TasksPage.tsx

johnstcn · 2025-07-24T14:32:02Z

Is selecting a preset required? On the create workspace page I added a "None" to make it explicit that choosing a preset is not necessary.

Right now it technically isn't, although presets are currently the only way to expose parameter values on Tasks page. I can add a "none" option for consistency.

site/src/pages/TasksPage/TasksPage.tsx

jaaydenh · 2025-07-24T16:58:02Z

site/src/pages/TasksPage/TasksPage.tsx

 					placeholder={textareaPlaceholder}
 					className={`border-0 resize-none w-full h-full bg-transparent rounded-lg outline-none flex min-h-[60px]
-						text-sm shadow-sm text-content-primary placeholder:text-content-secondary md:text-sm`}
+						text-sm shadow-sm text-content-primary placeholder:text-content-secondary md:text-sm ${


Maybe this could be done later but it can be confusing for users that the Prompt is disabled because of a preset. In the dynamic parameters create workspace page, I label parameters when they are preset as such so user know why they can't be edited.

I could add a quick tooltip here

Addressed in 0fd55e2

jaaydenh

LGTM

johnstcn self-assigned this Jul 23, 2025

johnstcn force-pushed the cj/tasks-preset-selector branch from 0a11e8e to ebeb601 Compare July 24, 2025 11:32

johnstcn marked this pull request as ready for review July 24, 2025 11:44

johnstcn requested a review from Copilot July 24, 2025 11:45

Copilot AI reviewed Jul 24, 2025

View reviewed changes

johnstcn commented Jul 24, 2025

View reviewed changes

johnstcn requested a review from mtojek July 24, 2025 11:58

mtojek approved these changes Jul 24, 2025

View reviewed changes

jaaydenh reviewed Jul 24, 2025

View reviewed changes

site/src/pages/TasksPage/TasksPage.tsx Outdated Show resolved Hide resolved

jaaydenh reviewed Jul 24, 2025

View reviewed changes

site/src/pages/TasksPage/TasksPage.tsx Outdated Show resolved Hide resolved

jaaydenh reviewed Jul 24, 2025

View reviewed changes

site/src/pages/TasksPage/TasksPage.tsx Outdated Show resolved Hide resolved

jaaydenh reviewed Jul 24, 2025

View reviewed changes

johnstcn added 14 commits July 24, 2025 18:18

feat: add preset selector in TasksPage

a4ccb41

sort presets with default at top

8cafbc9

add labels for template and preset selectors

071c896

increase template and preset select width

9938038

override ai prompt with preset if defined

ec3d72d

hide presets selector if no presets exist for template

31901f9

fix ai prompt parameter name

c4dbd2f

update storybook

72db7b6

address copilot comments

4f2d820

address code review comments

7602ef6

fix crash if presets is null

80b96de

adjust label styling

e248c14

correctly handle selecting default preset on presetData change

bf6f113

DesiredPrebuildInstances

b3916e2

johnstcn force-pushed the cj/tasks-preset-selector branch from f6ecc40 to b3916e2 Compare July 24, 2025 17:20

add label to indicate if prompt is defined by preset

0fd55e2

johnstcn added 2 commits July 24, 2025 19:46

use preexisting query

9da9f5d

keep form label around

2680111

jaaydenh approved these changes Jul 24, 2025

View reviewed changes

johnstcn merged commit 9a05a8a into main Jul 24, 2025
31 of 32 checks passed

johnstcn deleted the cj/tasks-preset-selector branch July 24, 2025 19:19

github-actions bot locked and limited conversation to collaborators Jul 24, 2025

	className="w-80 text-xs [&_svg]:size-icon-xs border-0 bg-surface-secondary h-8 px-3"
	className="select-trigger-style"

feat: add preset selector in TasksPage #19012

feat: add preset selector in TasksPage #19012

Conversation

johnstcn commented Jul 23, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull Request Overview

Reviewed Changes

Uh oh!

Uh oh!

Uh oh!

Copilot AI Jul 24, 2025

Choose a reason for hiding this comment

Uh oh!

johnstcn Jul 24, 2025

Choose a reason for hiding this comment

Uh oh!

mtojek left a comment

Choose a reason for hiding this comment

Uh oh!

mtojek Jul 24, 2025

Choose a reason for hiding this comment

Uh oh!

mtojek Jul 24, 2025

Choose a reason for hiding this comment

Uh oh!

johnstcn Jul 24, 2025

Choose a reason for hiding this comment

Uh oh!

Uh oh!

jaaydenh commented Jul 24, 2025

Uh oh!

Uh oh!

Uh oh!

johnstcn commented Jul 24, 2025

Uh oh!

Uh oh!

jaaydenh Jul 24, 2025

Choose a reason for hiding this comment

Uh oh!

johnstcn Jul 24, 2025

Choose a reason for hiding this comment

Uh oh!

johnstcn Jul 24, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

jaaydenh left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

johnstcn commented Jul 23, 2025 •

edited

Loading

johnstcn Jul 24, 2025 •

edited

Loading