diff --git a/packages/types/src/global-settings.ts b/packages/types/src/global-settings.ts index c071726d8a..e727d45b61 100644 --- a/packages/types/src/global-settings.ts +++ b/packages/types/src/global-settings.ts @@ -148,6 +148,17 @@ export const globalSettingsSchema = z.object({ hasOpenedModeSelector: z.boolean().optional(), lastModeExportPath: z.string().optional(), lastModeImportPath: z.string().optional(), + + // UI Settings + showEnhancePromptButton: z.boolean().optional(), + showCodebaseIndexingButton: z.boolean().optional(), + showAddImagesToMessageButton: z.boolean().optional(), + showManageSlashCommandsButton: z.boolean().optional(), + showHintText: z.boolean().optional(), + showSendButton: z.boolean().optional(), + showApiConfigurationButton: z.boolean().optional(), + showAutoApproveTab: z.boolean().optional(), + showContextPercentageBar: z.boolean().optional(), }) export type GlobalSettings = z.infer diff --git a/src/core/webview/webviewMessageHandler.ts b/src/core/webview/webviewMessageHandler.ts index 4dd0fee75e..45bcbf84ba 100644 --- a/src/core/webview/webviewMessageHandler.ts +++ b/src/core/webview/webviewMessageHandler.ts @@ -2618,5 +2618,42 @@ export const webviewMessageHandler = async ( } break } + // UI Settings handlers + case "showEnhancePromptButton": + await updateGlobalState("showEnhancePromptButton", message.bool ?? true) + await provider.postStateToWebview() + break + case "showCodebaseIndexingButton": + await updateGlobalState("showCodebaseIndexingButton", message.bool ?? true) + await provider.postStateToWebview() + break + case "showAddImagesToMessageButton": + await updateGlobalState("showAddImagesToMessageButton", message.bool ?? true) + await provider.postStateToWebview() + break + case "showManageSlashCommandsButton": + await updateGlobalState("showManageSlashCommandsButton", message.bool ?? true) + await provider.postStateToWebview() + break + case "showHintText": + await updateGlobalState("showHintText", message.bool ?? true) + await provider.postStateToWebview() + break + case "showSendButton": + await updateGlobalState("showSendButton", message.bool ?? true) + await provider.postStateToWebview() + break + case "showApiConfigurationButton": + await updateGlobalState("showApiConfigurationButton", message.bool ?? true) + await provider.postStateToWebview() + break + case "showAutoApproveTab": + await updateGlobalState("showAutoApproveTab", message.bool ?? true) + await provider.postStateToWebview() + break + case "showContextPercentageBar": + await updateGlobalState("showContextPercentageBar", message.bool ?? true) + await provider.postStateToWebview() + break } } diff --git a/src/i18n/locales/en/common.json b/src/i18n/locales/en/common.json index 05d039a495..581681a830 100644 --- a/src/i18n/locales/en/common.json +++ b/src/i18n/locales/en/common.json @@ -191,5 +191,23 @@ "preventCompletionWithOpenTodos": { "description": "Prevent task completion when there are incomplete todos in the todo list" } + }, + "uiSettings": { + "description": "Customize which UI elements are visible in the interface", + "promptInputArea": { + "title": "Prompt Input Area Customization", + "showEnhancePromptButton": "Show 'Enhance Prompt' button", + "showCodebaseIndexingButton": "Show 'Codebase Indexing' button", + "showAddImagesToMessageButton": "Show 'Add Images to Message' button", + "showManageSlashCommandsButton": "Show 'Manage Slash Commands' button", + "showHintText": "Show hint text (\"@ to add context, / to switch modes...\")", + "showSendButton": "Show 'Send' button", + "showApiConfigurationButton": "Show 'API Configuration' button", + "showAutoApproveTab": "Show 'Auto-Approve' tab" + }, + "generalUI": { + "title": "General UI Element Customization", + "showContextPercentageBar": "Show context percentage bar during chat" + } } } diff --git a/src/shared/ExtensionMessage.ts b/src/shared/ExtensionMessage.ts index ebdc137432..6dad89f1e2 100644 --- a/src/shared/ExtensionMessage.ts +++ b/src/shared/ExtensionMessage.ts @@ -270,6 +270,16 @@ export type ExtensionState = Pick< | "includeDiagnosticMessages" | "maxDiagnosticMessages" | "remoteControlEnabled" + // UI Settings + | "showEnhancePromptButton" + | "showCodebaseIndexingButton" + | "showAddImagesToMessageButton" + | "showManageSlashCommandsButton" + | "showHintText" + | "showSendButton" + | "showApiConfigurationButton" + | "showAutoApproveTab" + | "showContextPercentageBar" > & { version: string clineMessages: ClineMessage[] diff --git a/src/shared/WebviewMessage.ts b/src/shared/WebviewMessage.ts index d59ccd556c..fe859e0c87 100644 --- a/src/shared/WebviewMessage.ts +++ b/src/shared/WebviewMessage.ts @@ -211,6 +211,16 @@ export interface WebviewMessage { | "deleteCommand" | "createCommand" | "insertTextIntoTextarea" + // UI Settings + | "showEnhancePromptButton" + | "showCodebaseIndexingButton" + | "showAddImagesToMessageButton" + | "showManageSlashCommandsButton" + | "showHintText" + | "showSendButton" + | "showApiConfigurationButton" + | "showAutoApproveTab" + | "showContextPercentageBar" text?: string editedMessageContent?: string tab?: "settings" | "history" | "mcp" | "modes" | "chat" | "marketplace" | "account" diff --git a/webview-ui/src/components/chat/ChatTextArea.tsx b/webview-ui/src/components/chat/ChatTextArea.tsx index 5135eca2f2..b99c68fb98 100644 --- a/webview-ui/src/components/chat/ChatTextArea.tsx +++ b/webview-ui/src/components/chat/ChatTextArea.tsx @@ -89,6 +89,14 @@ const ChatTextArea = forwardRef( taskHistory, clineMessages, commands, + // UI Settings + showEnhancePromptButton, + showCodebaseIndexingButton, + showAddImagesToMessageButton, + showManageSlashCommandsButton, + showHintText, + showSendButton, + showApiConfigurationButton, } = useExtensionState() // Find the ID and display text for the currently selected API configuration @@ -921,19 +929,21 @@ const ChatTextArea = forwardRef(
{renderModeSelector()}
-
- -
+ {showApiConfigurationButton && ( +
+ +
+ )}
@@ -957,30 +967,32 @@ const ChatTextArea = forwardRef( )} - - - - - + {showManageSlashCommandsButton && } + {showCodebaseIndexingButton && } + {showAddImagesToMessageButton && ( + + + + )}
) @@ -1091,29 +1103,31 @@ const ChatTextArea = forwardRef( onScroll={() => updateHighlights()} /> -
- - - -
+ {showEnhancePromptButton && ( +
+ + + +
+ )} - {!isEditMode && ( + {!isEditMode && showSendButton && (
)} - {!inputValue && !isEditMode && ( + {!inputValue && !isEditMode && showHintText && (
{hasSystemPromptOverride && ( @@ -1858,7 +1861,7 @@ const ChatViewComponent: React.ForwardRefRenderFunction
@@ -1885,9 +1888,11 @@ const ChatViewComponent: React.ForwardRefRenderFunction -
- -
+ {showAutoApproveTab && ( +
+ +
+ )} {areButtonsVisible && (
void todos?: any[] + showContextPercentageBar?: boolean } const TaskHeader = ({ @@ -44,6 +45,7 @@ const TaskHeader = ({ buttonsDisabled, handleCondenseContext, todos, + showContextPercentageBar = true, }: TaskHeaderProps) => { const { t } = useTranslation() const { apiConfiguration, currentTaskItem } = useExtensionState() @@ -120,7 +122,7 @@ const TaskHeader = ({
- {!isTaskExpanded && contextWindow > 0 && ( + {!isTaskExpanded && contextWindow > 0 && showContextPercentageBar && (
e.stopPropagation()}> { }, taskHistory: [], cwd: "/test/workspace", + // UI visibility settings - all enabled by default for tests + showEnhancePromptButton: true, + showCodebaseIndexingButton: true, + showAddImagesToMessageButton: true, + showManageSlashCommandsButton: true, + showHintText: true, + showSendButton: true, + showApiConfigurationButton: true, + showAutoApproveTab: true, + showContextPercentageBar: true, }) }) @@ -83,6 +93,16 @@ describe("ChatTextArea", () => { openedTabs: [], taskHistory: [], cwd: "/test/workspace", + // UI visibility settings + showEnhancePromptButton: true, + showCodebaseIndexingButton: true, + showAddImagesToMessageButton: true, + showManageSlashCommandsButton: true, + showHintText: true, + showSendButton: true, + showApiConfigurationButton: true, + showAutoApproveTab: true, + showContextPercentageBar: true, }) render() const enhanceButton = getEnhancePromptButton() @@ -103,6 +123,16 @@ describe("ChatTextArea", () => { apiConfiguration, taskHistory: [], cwd: "/test/workspace", + // UI visibility settings + showEnhancePromptButton: true, + showCodebaseIndexingButton: true, + showAddImagesToMessageButton: true, + showManageSlashCommandsButton: true, + showHintText: true, + showSendButton: true, + showApiConfigurationButton: true, + showAutoApproveTab: true, + showContextPercentageBar: true, }) render() @@ -125,6 +155,16 @@ describe("ChatTextArea", () => { }, taskHistory: [], cwd: "/test/workspace", + // UI visibility settings + showEnhancePromptButton: true, + showCodebaseIndexingButton: true, + showAddImagesToMessageButton: true, + showManageSlashCommandsButton: true, + showHintText: true, + showSendButton: true, + showApiConfigurationButton: true, + showAutoApproveTab: true, + showContextPercentageBar: true, }) render() @@ -147,6 +187,16 @@ describe("ChatTextArea", () => { }, taskHistory: [], cwd: "/test/workspace", + // UI visibility settings + showEnhancePromptButton: true, + showCodebaseIndexingButton: true, + showAddImagesToMessageButton: true, + showManageSlashCommandsButton: true, + showHintText: true, + showSendButton: true, + showApiConfigurationButton: true, + showAutoApproveTab: true, + showContextPercentageBar: true, }) render() @@ -174,6 +224,16 @@ describe("ChatTextArea", () => { }, taskHistory: [], cwd: "/test/workspace", + // UI visibility settings + showEnhancePromptButton: true, + showCodebaseIndexingButton: true, + showAddImagesToMessageButton: true, + showManageSlashCommandsButton: true, + showHintText: true, + showSendButton: true, + showApiConfigurationButton: true, + showAutoApproveTab: true, + showContextPercentageBar: true, }) rerender() @@ -275,6 +335,16 @@ describe("ChatTextArea", () => { filePaths: [], openedTabs: [], cwd: mockCwd, + // UI visibility settings + showEnhancePromptButton: true, + showCodebaseIndexingButton: true, + showAddImagesButton: true, + showSlashCommandsButton: true, + showHintText: true, + showSendButton: true, + showApiConfigButton: true, + showAutoApproveTab: true, + showContextPercentageBar: true, }) mockConvertToMentionPath.mockClear() }) @@ -506,6 +576,16 @@ describe("ChatTextArea", () => { taskHistory: [], clineMessages: mockClineMessages, cwd: "/test/workspace", + // UI visibility settings + showEnhancePromptButton: true, + showCodebaseIndexingButton: true, + showAddImagesButton: true, + showSlashCommandsButton: true, + showHintText: true, + showSendButton: true, + showApiConfigButton: true, + showAutoApproveTab: true, + showContextPercentageBar: true, }) }) @@ -659,6 +739,16 @@ describe("ChatTextArea", () => { taskHistory: [], clineMessages: mixedClineMessages, cwd: "/test/workspace", + // UI visibility settings + showEnhancePromptButton: true, + showCodebaseIndexingButton: true, + showAddImagesToMessageButton: true, + showManageSlashCommandsButton: true, + showHintText: true, + showSendButton: true, + showApiConfigurationButton: true, + showAutoApproveTab: true, + showContextPercentageBar: true, }) const setInputValue = vi.fn() @@ -687,6 +777,16 @@ describe("ChatTextArea", () => { taskHistory: [], clineMessages: [], cwd: "/test/workspace", + // UI visibility settings + showEnhancePromptButton: true, + showCodebaseIndexingButton: true, + showAddImagesToMessageButton: true, + showManageSlashCommandsButton: true, + showHintText: true, + showSendButton: true, + showApiConfigurationButton: true, + showAutoApproveTab: true, + showContextPercentageBar: true, }) const setInputValue = vi.fn() @@ -718,6 +818,16 @@ describe("ChatTextArea", () => { taskHistory: [], clineMessages: clineMessagesWithEmpty, cwd: "/test/workspace", + // UI visibility settings + showEnhancePromptButton: true, + showCodebaseIndexingButton: true, + showAddImagesToMessageButton: true, + showManageSlashCommandsButton: true, + showHintText: true, + showSendButton: true, + showApiConfigurationButton: true, + showAutoApproveTab: true, + showContextPercentageBar: true, }) const setInputValue = vi.fn() @@ -752,6 +862,16 @@ describe("ChatTextArea", () => { taskHistory: mockTaskHistory, clineMessages: [], // No conversation messages cwd: "/test/workspace", + // UI visibility settings + showEnhancePromptButton: true, + showCodebaseIndexingButton: true, + showAddImagesToMessageButton: true, + showManageSlashCommandsButton: true, + showHintText: true, + showSendButton: true, + showApiConfigurationButton: true, + showAutoApproveTab: true, + showContextPercentageBar: true, }) const setInputValue = vi.fn() @@ -789,6 +909,16 @@ describe("ChatTextArea", () => { ], clineMessages: [], cwd: "/test/workspace", + // UI visibility settings + showEnhancePromptButton: true, + showCodebaseIndexingButton: true, + showAddImagesButton: true, + showSlashCommandsButton: true, + showHintText: true, + showSendButton: true, + showApiConfigButton: true, + showAutoApproveTab: true, + showContextPercentageBar: true, }) rerender() @@ -812,6 +942,16 @@ describe("ChatTextArea", () => { { type: "say", say: "user_feedback", text: "Message 2", ts: 2000 }, ], cwd: "/test/workspace", + // UI visibility settings + showEnhancePromptButton: true, + showCodebaseIndexingButton: true, + showAddImagesToMessageButton: true, + showManageSlashCommandsButton: true, + showHintText: true, + showSendButton: true, + showApiConfigurationButton: true, + showAutoApproveTab: true, + showContextPercentageBar: true, }) setInputValue.mockClear() @@ -918,6 +1058,16 @@ describe("ChatTextArea", () => { taskHistory: [], cwd: "/test/workspace", commands: mockCommands, + // UI visibility settings + showEnhancePromptButton: true, + showCodebaseIndexingButton: true, + showAddImagesToMessageButton: true, + showManageSlashCommandsButton: true, + showHintText: true, + showSendButton: true, + showApiConfigurationButton: true, + showAutoApproveTab: true, + showContextPercentageBar: true, }) }) @@ -1027,6 +1177,16 @@ describe("ChatTextArea", () => { taskHistory: [], cwd: "/test/workspace", commands: undefined, + // UI visibility settings + showEnhancePromptButton: true, + showCodebaseIndexingButton: true, + showAddImagesButton: true, + showSlashCommandsButton: true, + showHintText: true, + showSendButton: true, + showApiConfigButton: true, + showAutoApproveTab: true, + showContextPercentageBar: true, }) const { getByTestId } = render() @@ -1048,11 +1208,43 @@ describe("ChatTextArea", () => { return screen.getByTestId("dropdown-trigger") } it("should be enabled independently of sendingDisabled", () => { + ;(useExtensionState as ReturnType).mockReturnValue({ + filePaths: [], + openedTabs: [], + taskHistory: [], + cwd: "/test/workspace", + // UI visibility settings - API config button must be visible + showEnhancePromptButton: true, + showCodebaseIndexingButton: true, + showAddImagesToMessageButton: true, + showManageSlashCommandsButton: true, + showHintText: true, + showSendButton: true, + showApiConfigurationButton: true, + showAutoApproveTab: true, + showContextPercentageBar: true, + }) render() const apiConfigDropdown = getApiConfigDropdown() expect(apiConfigDropdown).not.toHaveAttribute("disabled") }) it("should be disabled when selectApiConfigDisabled is true", () => { + ;(useExtensionState as ReturnType).mockReturnValue({ + filePaths: [], + openedTabs: [], + taskHistory: [], + cwd: "/test/workspace", + // UI visibility settings - API config button must be visible + showEnhancePromptButton: true, + showCodebaseIndexingButton: true, + showAddImagesToMessageButton: true, + showManageSlashCommandsButton: true, + showHintText: true, + showSendButton: true, + showApiConfigurationButton: true, + showAutoApproveTab: true, + showContextPercentageBar: true, + }) render() const apiConfigDropdown = getApiConfigDropdown() expect(apiConfigDropdown).toHaveAttribute("disabled") @@ -1067,6 +1259,16 @@ describe("ChatTextArea", () => { cwd: "/test/workspace", customModes: [], customModePrompts: {}, + // UI visibility settings + showEnhancePromptButton: true, + showCodebaseIndexingButton: true, + showAddImagesToMessageButton: true, + showManageSlashCommandsButton: true, + showHintText: true, + showSendButton: true, + showApiConfigurationButton: true, + showAutoApproveTab: true, + showContextPercentageBar: true, }) render() @@ -1091,6 +1293,16 @@ describe("ChatTextArea", () => { openedTabs: [], taskHistory: [], cwd: "/test/workspace", + // UI visibility settings + showEnhancePromptButton: true, + showCodebaseIndexingButton: true, + showAddImagesToMessageButton: true, + showManageSlashCommandsButton: true, + showHintText: true, + showSendButton: true, + showApiConfigurationButton: true, + showAutoApproveTab: true, + showContextPercentageBar: true, }) render() diff --git a/webview-ui/src/components/settings/SettingsView.tsx b/webview-ui/src/components/settings/SettingsView.tsx index 2738b82632..c771a20264 100644 --- a/webview-ui/src/components/settings/SettingsView.tsx +++ b/webview-ui/src/components/settings/SettingsView.tsx @@ -23,6 +23,7 @@ import { Info, MessageSquare, LucideIcon, + Palette, } from "lucide-react" import type { ProviderSettings, ExperimentId } from "@roo-code/types" @@ -65,6 +66,7 @@ import { LanguageSettings } from "./LanguageSettings" import { About } from "./About" import { Section } from "./Section" import PromptsSettings from "./PromptsSettings" +import { UISettings } from "./UISettings" import { cn } from "@/lib/utils" export const settingsTabsContainer = "flex flex-1 overflow-hidden [&.narrow_.tab-label]:hidden" @@ -87,6 +89,7 @@ const sectionNames = [ "contextManagement", "terminal", "prompts", + "uiSettings", "experimental", "language", "about", @@ -183,6 +186,16 @@ const SettingsView = forwardRef(({ onDone, t includeDiagnosticMessages, maxDiagnosticMessages, includeTaskHistoryInEnhance, + // UI Settings + showEnhancePromptButton, + showCodebaseIndexingButton, + showAddImagesToMessageButton, + showManageSlashCommandsButton, + showHintText, + showSendButton, + showApiConfigurationButton, + showAutoApproveTab, + showContextPercentageBar, } = cachedState const apiConfiguration = useMemo(() => cachedState.apiConfiguration ?? {}, [cachedState.apiConfiguration]) @@ -342,6 +355,16 @@ const SettingsView = forwardRef(({ onDone, t vscode.postMessage({ type: "updateCondensingPrompt", text: customCondensingPrompt || "" }) vscode.postMessage({ type: "updateSupportPrompt", values: customSupportPrompts || {} }) vscode.postMessage({ type: "includeTaskHistoryInEnhance", bool: includeTaskHistoryInEnhance ?? true }) + // UI Settings + vscode.postMessage({ type: "showEnhancePromptButton", bool: showEnhancePromptButton ?? true }) + vscode.postMessage({ type: "showCodebaseIndexingButton", bool: showCodebaseIndexingButton ?? true }) + vscode.postMessage({ type: "showAddImagesToMessageButton", bool: showAddImagesToMessageButton ?? true }) + vscode.postMessage({ type: "showManageSlashCommandsButton", bool: showManageSlashCommandsButton ?? true }) + vscode.postMessage({ type: "showHintText", bool: showHintText ?? true }) + vscode.postMessage({ type: "showSendButton", bool: showSendButton ?? true }) + vscode.postMessage({ type: "showApiConfigurationButton", bool: showApiConfigurationButton ?? true }) + vscode.postMessage({ type: "showAutoApproveTab", bool: showAutoApproveTab ?? true }) + vscode.postMessage({ type: "showContextPercentageBar", bool: showContextPercentageBar ?? true }) vscode.postMessage({ type: "upsertApiConfiguration", text: currentApiConfigName, apiConfiguration }) vscode.postMessage({ type: "telemetrySetting", text: telemetrySetting }) vscode.postMessage({ type: "profileThresholds", values: profileThresholds }) @@ -422,6 +445,7 @@ const SettingsView = forwardRef(({ onDone, t { id: "contextManagement", icon: Database }, { id: "terminal", icon: SquareTerminal }, { id: "prompts", icon: MessageSquare }, + { id: "uiSettings", icon: Palette }, { id: "experimental", icon: FlaskConical }, { id: "language", icon: Globe }, { id: "about", icon: Info }, @@ -718,6 +742,22 @@ const SettingsView = forwardRef(({ onDone, t /> )} + {/* UI Settings Section */} + {activeTab === "uiSettings" && ( + + )} + {/* Experimental Section */} {activeTab === "experimental" && ( diff --git a/webview-ui/src/components/settings/UISettings.tsx b/webview-ui/src/components/settings/UISettings.tsx new file mode 100644 index 0000000000..d4d5fb9422 --- /dev/null +++ b/webview-ui/src/components/settings/UISettings.tsx @@ -0,0 +1,167 @@ +import React, { HTMLAttributes } from "react" +import { VSCodeCheckbox } from "@vscode/webview-ui-toolkit/react" +import { Palette } from "lucide-react" + +import { useAppTranslation } from "@/i18n/TranslationContext" +import { cn } from "@/lib/utils" + +import { SetCachedStateField } from "./types" +import { SectionHeader } from "./SectionHeader" +import { Section } from "./Section" + +type UISettingsProps = HTMLAttributes & { + // Prompt Input Area settings + showEnhancePromptButton?: boolean + showCodebaseIndexingButton?: boolean + showAddImagesToMessageButton?: boolean + showManageSlashCommandsButton?: boolean + showHintText?: boolean + showSendButton?: boolean + showApiConfigurationButton?: boolean + showAutoApproveTab?: boolean + // General UI settings + showContextPercentageBar?: boolean + // Setters + setCachedStateField: SetCachedStateField< + | "showEnhancePromptButton" + | "showCodebaseIndexingButton" + | "showAddImagesToMessageButton" + | "showManageSlashCommandsButton" + | "showHintText" + | "showSendButton" + | "showApiConfigurationButton" + | "showAutoApproveTab" + | "showContextPercentageBar" + > +} + +export const UISettings = ({ + showEnhancePromptButton = true, + showCodebaseIndexingButton = true, + showAddImagesToMessageButton = true, + showManageSlashCommandsButton = true, + showHintText = true, + showSendButton = true, + showApiConfigurationButton = true, + showAutoApproveTab = true, + showContextPercentageBar = true, + setCachedStateField, + className, + ...props +}: UISettingsProps) => { + const { t } = useAppTranslation() + + return ( +
+ +
+ +
{t("settings:sections.uiSettings")}
+
+ + +
+
+ {/* Prompt Input Area Customization */} +
+

{t("settings:uiSettings.promptInputArea.title")}

+
+ setCachedStateField("showEnhancePromptButton", e.target.checked)} + data-testid="show-enhance-prompt-button-checkbox"> + + + + + setCachedStateField("showCodebaseIndexingButton", e.target.checked) + } + data-testid="show-codebase-indexing-button-checkbox"> + + + + + setCachedStateField("showAddImagesToMessageButton", e.target.checked) + } + data-testid="show-add-images-button-checkbox"> + + + + + setCachedStateField("showManageSlashCommandsButton", e.target.checked) + } + data-testid="show-manage-slash-commands-button-checkbox"> + + + + setCachedStateField("showHintText", e.target.checked)} + data-testid="show-hint-text-checkbox"> + + + + setCachedStateField("showSendButton", e.target.checked)} + data-testid="show-send-button-checkbox"> + + + + + setCachedStateField("showApiConfigurationButton", e.target.checked) + } + data-testid="show-api-configuration-button-checkbox"> + + + + setCachedStateField("showAutoApproveTab", e.target.checked)} + data-testid="show-auto-approve-tab-checkbox"> + + +
+
+ + {/* General UI Element Customization */} +
+

{t("settings:uiSettings.generalUI.title")}

+
+ setCachedStateField("showContextPercentageBar", e.target.checked)} + data-testid="show-context-percentage-bar-checkbox"> + + +
+
+
+
+
+ ) +} diff --git a/webview-ui/src/context/ExtensionStateContext.tsx b/webview-ui/src/context/ExtensionStateContext.tsx index b0045977c3..eb0c57d43e 100644 --- a/webview-ui/src/context/ExtensionStateContext.tsx +++ b/webview-ui/src/context/ExtensionStateContext.tsx @@ -149,6 +149,25 @@ export interface ExtensionStateContextType extends ExtensionState { setMaxDiagnosticMessages: (value: number) => void includeTaskHistoryInEnhance?: boolean setIncludeTaskHistoryInEnhance: (value: boolean) => void + // UI Settings + showEnhancePromptButton: boolean + setShowEnhancePromptButton: (value: boolean) => void + showCodebaseIndexingButton: boolean + setShowCodebaseIndexingButton: (value: boolean) => void + showAddImagesToMessageButton: boolean + setShowAddImagesToMessageButton: (value: boolean) => void + showManageSlashCommandsButton: boolean + setShowManageSlashCommandsButton: (value: boolean) => void + showHintText: boolean + setShowHintText: (value: boolean) => void + showSendButton: boolean + setShowSendButton: (value: boolean) => void + showApiConfigurationButton: boolean + setShowApiConfigurationButton: (value: boolean) => void + showAutoApproveTab: boolean + setShowAutoApproveTab: (value: boolean) => void + showContextPercentageBar: boolean + setShowContextPercentageBar: (value: boolean) => void } export const ExtensionStateContext = createContext(undefined) @@ -522,6 +541,31 @@ export const ExtensionStateContextProvider: React.FC<{ children: React.ReactNode }, includeTaskHistoryInEnhance, setIncludeTaskHistoryInEnhance, + // UI Settings - these come from state now + showEnhancePromptButton: state.showEnhancePromptButton ?? true, + setShowEnhancePromptButton: (value) => + setState((prevState) => ({ ...prevState, showEnhancePromptButton: value })), + showCodebaseIndexingButton: state.showCodebaseIndexingButton ?? true, + setShowCodebaseIndexingButton: (value) => + setState((prevState) => ({ ...prevState, showCodebaseIndexingButton: value })), + showAddImagesToMessageButton: state.showAddImagesToMessageButton ?? true, + setShowAddImagesToMessageButton: (value) => + setState((prevState) => ({ ...prevState, showAddImagesToMessageButton: value })), + showManageSlashCommandsButton: state.showManageSlashCommandsButton ?? true, + setShowManageSlashCommandsButton: (value) => + setState((prevState) => ({ ...prevState, showManageSlashCommandsButton: value })), + showHintText: state.showHintText ?? true, + setShowHintText: (value) => setState((prevState) => ({ ...prevState, showHintText: value })), + showSendButton: state.showSendButton ?? true, + setShowSendButton: (value) => setState((prevState) => ({ ...prevState, showSendButton: value })), + showApiConfigurationButton: state.showApiConfigurationButton ?? true, + setShowApiConfigurationButton: (value) => + setState((prevState) => ({ ...prevState, showApiConfigurationButton: value })), + showAutoApproveTab: state.showAutoApproveTab ?? true, + setShowAutoApproveTab: (value) => setState((prevState) => ({ ...prevState, showAutoApproveTab: value })), + showContextPercentageBar: state.showContextPercentageBar ?? true, + setShowContextPercentageBar: (value) => + setState((prevState) => ({ ...prevState, showContextPercentageBar: value })), } return {children}