|
@@ -7,6 +7,7 @@ import {
|
|
|
Mode,
|
|
Mode,
|
|
|
PromptComponent,
|
|
PromptComponent,
|
|
|
getRoleDefinition,
|
|
getRoleDefinition,
|
|
|
|
|
+ getWhenToUse,
|
|
|
getCustomInstructions,
|
|
getCustomInstructions,
|
|
|
getAllModes,
|
|
getAllModes,
|
|
|
ModeConfig,
|
|
ModeConfig,
|
|
@@ -106,6 +107,9 @@ const PromptsView = ({ onDone }: PromptsViewProps) => {
|
|
|
if (updatedPrompt.roleDefinition === getRoleDefinition(mode)) {
|
|
if (updatedPrompt.roleDefinition === getRoleDefinition(mode)) {
|
|
|
delete updatedPrompt.roleDefinition
|
|
delete updatedPrompt.roleDefinition
|
|
|
}
|
|
}
|
|
|
|
|
+ if (updatedPrompt.whenToUse === getWhenToUse(mode)) {
|
|
|
|
|
+ delete updatedPrompt.whenToUse
|
|
|
|
|
+ }
|
|
|
|
|
|
|
|
vscode.postMessage({
|
|
vscode.postMessage({
|
|
|
type: "updatePrompt",
|
|
type: "updatePrompt",
|
|
@@ -195,6 +199,7 @@ const PromptsView = ({ onDone }: PromptsViewProps) => {
|
|
|
const [newModeName, setNewModeName] = useState("")
|
|
const [newModeName, setNewModeName] = useState("")
|
|
|
const [newModeSlug, setNewModeSlug] = useState("")
|
|
const [newModeSlug, setNewModeSlug] = useState("")
|
|
|
const [newModeRoleDefinition, setNewModeRoleDefinition] = useState("")
|
|
const [newModeRoleDefinition, setNewModeRoleDefinition] = useState("")
|
|
|
|
|
+ const [newModeWhenToUse, setNewModeWhenToUse] = useState("")
|
|
|
const [newModeCustomInstructions, setNewModeCustomInstructions] = useState("")
|
|
const [newModeCustomInstructions, setNewModeCustomInstructions] = useState("")
|
|
|
const [newModeGroups, setNewModeGroups] = useState<GroupEntry[]>(availableGroups)
|
|
const [newModeGroups, setNewModeGroups] = useState<GroupEntry[]>(availableGroups)
|
|
|
const [newModeSource, setNewModeSource] = useState<ModeSource>("global")
|
|
const [newModeSource, setNewModeSource] = useState<ModeSource>("global")
|
|
@@ -212,6 +217,7 @@ const PromptsView = ({ onDone }: PromptsViewProps) => {
|
|
|
setNewModeSlug("")
|
|
setNewModeSlug("")
|
|
|
setNewModeGroups(availableGroups)
|
|
setNewModeGroups(availableGroups)
|
|
|
setNewModeRoleDefinition("")
|
|
setNewModeRoleDefinition("")
|
|
|
|
|
+ setNewModeWhenToUse("")
|
|
|
setNewModeCustomInstructions("")
|
|
setNewModeCustomInstructions("")
|
|
|
setNewModeSource("global")
|
|
setNewModeSource("global")
|
|
|
// Reset error states
|
|
// Reset error states
|
|
@@ -258,6 +264,7 @@ const PromptsView = ({ onDone }: PromptsViewProps) => {
|
|
|
slug: newModeSlug,
|
|
slug: newModeSlug,
|
|
|
name: newModeName,
|
|
name: newModeName,
|
|
|
roleDefinition: newModeRoleDefinition.trim(),
|
|
roleDefinition: newModeRoleDefinition.trim(),
|
|
|
|
|
+ whenToUse: newModeWhenToUse.trim() || undefined,
|
|
|
customInstructions: newModeCustomInstructions.trim() || undefined,
|
|
customInstructions: newModeCustomInstructions.trim() || undefined,
|
|
|
groups: newModeGroups,
|
|
groups: newModeGroups,
|
|
|
source,
|
|
source,
|
|
@@ -299,6 +306,7 @@ const PromptsView = ({ onDone }: PromptsViewProps) => {
|
|
|
newModeName,
|
|
newModeName,
|
|
|
newModeSlug,
|
|
newModeSlug,
|
|
|
newModeRoleDefinition,
|
|
newModeRoleDefinition,
|
|
|
|
|
+ newModeWhenToUse, // Add whenToUse dependency
|
|
|
newModeCustomInstructions,
|
|
newModeCustomInstructions,
|
|
|
newModeGroups,
|
|
newModeGroups,
|
|
|
newModeSource,
|
|
newModeSource,
|
|
@@ -396,7 +404,7 @@ const PromptsView = ({ onDone }: PromptsViewProps) => {
|
|
|
})
|
|
})
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
- const handleAgentReset = (modeSlug: string, type: "roleDefinition" | "customInstructions") => {
|
|
|
|
|
|
|
+ const handleAgentReset = (modeSlug: string, type: "roleDefinition" | "whenToUse" | "customInstructions") => {
|
|
|
// Only reset for built-in modes
|
|
// Only reset for built-in modes
|
|
|
const existingPrompt = customModePrompts?.[modeSlug] as PromptComponent
|
|
const existingPrompt = customModePrompts?.[modeSlug] as PromptComponent
|
|
|
const updatedPrompt = { ...existingPrompt }
|
|
const updatedPrompt = { ...existingPrompt }
|
|
@@ -699,6 +707,61 @@ const PromptsView = ({ onDone }: PromptsViewProps) => {
|
|
|
data-testid={`${getCurrentMode()?.slug || "code"}-prompt-textarea`}
|
|
data-testid={`${getCurrentMode()?.slug || "code"}-prompt-textarea`}
|
|
|
/>
|
|
/>
|
|
|
</div>
|
|
</div>
|
|
|
|
|
+
|
|
|
|
|
+ {/* When to Use section */}
|
|
|
|
|
+ <div className="mb-4">
|
|
|
|
|
+ <div className="flex justify-between items-center mb-1">
|
|
|
|
|
+ <div className="font-bold">{t("prompts:whenToUse.title")}</div>
|
|
|
|
|
+ {!findModeBySlug(visualMode, customModes) && (
|
|
|
|
|
+ <Button
|
|
|
|
|
+ variant="ghost"
|
|
|
|
|
+ size="icon"
|
|
|
|
|
+ onClick={() => {
|
|
|
|
|
+ const currentMode = getCurrentMode()
|
|
|
|
|
+ if (currentMode?.slug) {
|
|
|
|
|
+ handleAgentReset(currentMode.slug, "whenToUse")
|
|
|
|
|
+ }
|
|
|
|
|
+ }}
|
|
|
|
|
+ title={t("prompts:whenToUse.resetToDefault")}
|
|
|
|
|
+ data-testid="when-to-use-reset">
|
|
|
|
|
+ <span className="codicon codicon-discard"></span>
|
|
|
|
|
+ </Button>
|
|
|
|
|
+ )}
|
|
|
|
|
+ </div>
|
|
|
|
|
+ <div className="text-sm text-vscode-descriptionForeground mb-2">
|
|
|
|
|
+ {t("prompts:whenToUse.description")}
|
|
|
|
|
+ </div>
|
|
|
|
|
+ <VSCodeTextArea
|
|
|
|
|
+ value={(() => {
|
|
|
|
|
+ const customMode = findModeBySlug(visualMode, customModes)
|
|
|
|
|
+ const prompt = customModePrompts?.[visualMode] as PromptComponent
|
|
|
|
|
+ return customMode?.whenToUse ?? prompt?.whenToUse ?? getWhenToUse(visualMode)
|
|
|
|
|
+ })()}
|
|
|
|
|
+ onChange={(e) => {
|
|
|
|
|
+ const value =
|
|
|
|
|
+ (e as unknown as CustomEvent)?.detail?.target?.value ||
|
|
|
|
|
+ ((e as any).target as HTMLTextAreaElement).value
|
|
|
|
|
+ const customMode = findModeBySlug(visualMode, customModes)
|
|
|
|
|
+ if (customMode) {
|
|
|
|
|
+ // For custom modes, update the JSON file
|
|
|
|
|
+ updateCustomMode(visualMode, {
|
|
|
|
|
+ ...customMode,
|
|
|
|
|
+ whenToUse: value.trim() || undefined,
|
|
|
|
|
+ source: customMode.source || "global",
|
|
|
|
|
+ })
|
|
|
|
|
+ } else {
|
|
|
|
|
+ // For built-in modes, update the prompts
|
|
|
|
|
+ updateAgentPrompt(visualMode, {
|
|
|
|
|
+ whenToUse: value.trim() || undefined,
|
|
|
|
|
+ })
|
|
|
|
|
+ }
|
|
|
|
|
+ }}
|
|
|
|
|
+ className="resize-y w-full"
|
|
|
|
|
+ rows={3}
|
|
|
|
|
+ data-testid={`${getCurrentMode()?.slug || "code"}-when-to-use-textarea`}
|
|
|
|
|
+ />
|
|
|
|
|
+ </div>
|
|
|
|
|
+
|
|
|
{/* Mode settings */}
|
|
{/* Mode settings */}
|
|
|
<>
|
|
<>
|
|
|
<div className="mb-3">
|
|
<div className="mb-3">
|
|
@@ -1258,6 +1321,21 @@ const PromptsView = ({ onDone }: PromptsViewProps) => {
|
|
|
</div>
|
|
</div>
|
|
|
)}
|
|
)}
|
|
|
</div>
|
|
</div>
|
|
|
|
|
+
|
|
|
|
|
+ <div className="mb-4">
|
|
|
|
|
+ <div className="font-bold mb-1">{t("prompts:createModeDialog.whenToUse.label")}</div>
|
|
|
|
|
+ <div className="text-[13px] text-vscode-descriptionForeground mb-2">
|
|
|
|
|
+ {t("prompts:createModeDialog.whenToUse.description")}
|
|
|
|
|
+ </div>
|
|
|
|
|
+ <VSCodeTextArea
|
|
|
|
|
+ value={newModeWhenToUse}
|
|
|
|
|
+ onChange={(e) => {
|
|
|
|
|
+ setNewModeWhenToUse((e.target as HTMLTextAreaElement).value)
|
|
|
|
|
+ }}
|
|
|
|
|
+ rows={3}
|
|
|
|
|
+ className="w-full resize-y"
|
|
|
|
|
+ />
|
|
|
|
|
+ </div>
|
|
|
<div className="mb-4">
|
|
<div className="mb-4">
|
|
|
<div className="font-bold mb-1">{t("prompts:createModeDialog.tools.label")}</div>
|
|
<div className="font-bold mb-1">{t("prompts:createModeDialog.tools.label")}</div>
|
|
|
<div className="text-[13px] text-vscode-descriptionForeground mb-2">
|
|
<div className="text-[13px] text-vscode-descriptionForeground mb-2">
|