feat(composer): ✨ Add profile quick edit controls#199
Conversation
Add `QuickTierModelSelect` and `QuickThinkingLevelControl` components that allow users to change the agent profile's model and thinking level directly from the composer model selector dropdown, without navigating to the settings panel. The `onUpdateAgentProfile` prop is passed through `DashboardWorkbench` and `RuntimeThreadSurface` to persist changes in real time. This also includes unit tests for the `getProfileTierPatch` and `getAvailableProfileModelOptions` helper functions.
…t UI Replace the thinking level control with a slider-style dot selector and move model provider name into the header for improved layout.
AI Code Review SummaryPR: #199 (feat(composer): ✨ Add profile quick edit controls) Overall AssessmentNo blocking issue was detected in the reviewed diff; keep focused regression testing before merge. Major Findings by SeverityNo major issues identified from the reviewed diff. Actionable Suggestions
Potential Risks
Test Suggestions
File-Level Coverage Notes
Inline Downgraded Items (processed but not inline)
Coverage Status
Uncovered list:
No-patch covered list:
Runtime/Budget
|
| { label: t("composer.profileTier.auxiliary"), tier: "assistant" }, | ||
| { label: t("composer.profileTier.lightweight"), tier: "lite" }, | ||
| ]; | ||
| const runQuickEdit = async (key: string, patch: ProfileQuickEditPatch) => { |
This comment was marked as outdated.
This comment was marked as outdated.
Sorry, something went wrong.
|
|
||
| const MODEL_SELECT_NONE_VALUE = "__none__"; | ||
|
|
||
| function getModelSelectValue(providerId: string, modelRecordId: string) { |
This comment was marked as outdated.
This comment was marked as outdated.
Sorry, something went wrong.
| return MODEL_SELECT_NONE_VALUE; | ||
| } | ||
|
|
||
| return JSON.stringify([providerId, modelRecordId]); |
This comment was marked as outdated.
This comment was marked as outdated.
Sorry, something went wrong.
| { label: t("composer.profileTier.auxiliary"), tier: "assistant" }, | ||
| { label: t("composer.profileTier.lightweight"), tier: "lite" }, | ||
| ]; | ||
| const runQuickEdit = async (key: string, patch: ProfileQuickEditPatch) => { |
This comment was marked as outdated.
This comment was marked as outdated.
Sorry, something went wrong.
| }, | ||
| ]); | ||
| }); | ||
| }); |
This comment was marked as outdated.
This comment was marked as outdated.
Sorry, something went wrong.
| <div className="absolute left-4 right-4 top-2 h-px bg-app-border/70" /> | ||
| <div | ||
| className="absolute left-4 top-2 h-px bg-app-info/70 transition-all" | ||
| style={{ width: selectedIndex > 0 ? `calc((100% - 2rem) * ${selectedIndex / (THINKING_LEVEL_OPTIONS.length - 1)})` : 0 }} |
This comment was marked as outdated.
This comment was marked as outdated.
Sorry, something went wrong.
| /> | ||
| <div className="sm:col-span-2"> | ||
| <QuickThinkingLevelControl | ||
| disabled={!canQuickEdit} |
This comment was marked as outdated.
This comment was marked as outdated.
Sorry, something went wrong.
| await onUpdateAgentProfile(targetProfileId, patch); | ||
| } catch (error) { | ||
| if (activeProfileIdRef.current === targetProfileId && quickEditRequestIdRef.current === requestId) { | ||
| setQuickEditError(error instanceof Error ? error.message : t("sourceControl.requestFailed")); |
This comment was marked as outdated.
This comment was marked as outdated.
Sorry, something went wrong.
| <button | ||
| aria-label={`${t("composer.profileThinkingLevel")}: ${getThinkingLevelLabel(option, t)}`} | ||
| className="group flex min-w-0 flex-col items-center gap-1 focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-60" | ||
| disabled={disabled || isPending || isSelected} |
This comment was marked as outdated.
This comment was marked as outdated.
Sorry, something went wrong.
| @@ -78,6 +78,7 @@ const en: Record<TranslationKey, string> = { | |||
| "composer.activeProfileLabel": "Active Profile", | |||
There was a problem hiding this comment.
Automated review completed for this PR diff. No concrete inline issue was selected after aggregation.
Summary
Test Plan
npm run typechecknpm run test:unit -- workbench-prompt-composer🤖 Generated with TiyCode