From 2e6ee2cdc0c491df1cbb5fdbfd0a088fe52b1b1c Mon Sep 17 00:00:00 2001 From: Aaron Munger Date: Wed, 19 Jun 2024 11:21:51 -0700 Subject: [PATCH] add config gear icon and make empty hint text consistent (#216633) --- src/vs/platform/actions/common/actions.ts | 1 + .../browser/interactive.contribution.ts | 20 +++++++++++++ .../interactive/browser/interactiveEditor.ts | 30 +++++++++++++++++++ .../browser/replInputHintContentWidget.ts | 8 +---- .../contrib/notebook/browser/notebookIcons.ts | 1 + 5 files changed, 53 insertions(+), 7 deletions(-) diff --git a/src/vs/platform/actions/common/actions.ts b/src/vs/platform/actions/common/actions.ts index 1e7360f3064..c1d80dd2c50 100644 --- a/src/vs/platform/actions/common/actions.ts +++ b/src/vs/platform/actions/common/actions.ts @@ -171,6 +171,7 @@ export class MenuId { static readonly InteractiveCellDelete = new MenuId('InteractiveCellDelete'); static readonly InteractiveCellExecute = new MenuId('InteractiveCellExecute'); static readonly InteractiveInputExecute = new MenuId('InteractiveInputExecute'); + static readonly InteractiveInputConfig = new MenuId('InteractiveInputConfig'); static readonly ReplInputExecute = new MenuId('ReplInputExecute'); static readonly IssueReporter = new MenuId('IssueReporter'); static readonly NotebookToolbar = new MenuId('NotebookToolbar'); diff --git a/src/vs/workbench/contrib/interactive/browser/interactive.contribution.ts b/src/vs/workbench/contrib/interactive/browser/interactive.contribution.ts index a79006781ed..5705f2e7f3b 100644 --- a/src/vs/workbench/contrib/interactive/browser/interactive.contribution.ts +++ b/src/vs/workbench/contrib/interactive/browser/interactive.contribution.ts @@ -23,6 +23,7 @@ import { Context as SuggestContext } from 'vs/editor/contrib/suggest/browser/sug import { localize, localize2 } from 'vs/nls'; import { ILocalizedString } from 'vs/platform/action/common/action'; import { Action2, MenuId, registerAction2 } from 'vs/platform/actions/common/actions'; +import { ICommandService } from 'vs/platform/commands/common/commands'; import { IConfigurationService } from 'vs/platform/configuration/common/configuration'; import { IConfigurationRegistry, Extensions as ConfigurationExtensions } from 'vs/platform/configuration/common/configurationRegistry'; import { ContextKeyExpr } from 'vs/platform/contextkey/common/contextkey'; @@ -431,6 +432,25 @@ registerAction2(class extends Action2 { } }); +registerAction2(class extends Action2 { + constructor() { + super({ + id: 'interactive.configure', + title: localize2('interactive.configExecute', 'Configure input box behavior'), + category: interactiveWindowCategory, + f1: false, + icon: icons.configIcon, + menu: { + id: MenuId.InteractiveInputConfig + } + }); + } + + override run(accessor: ServicesAccessor, ...args: any[]): void { + accessor.get(ICommandService).executeCommand('workbench.action.openSettings', '@tag:replExecute'); + } +}); + registerAction2(class extends Action2 { constructor() { super({ diff --git a/src/vs/workbench/contrib/interactive/browser/interactiveEditor.ts b/src/vs/workbench/contrib/interactive/browser/interactiveEditor.ts index d272234b138..a6b48582111 100644 --- a/src/vs/workbench/contrib/interactive/browser/interactiveEditor.ts +++ b/src/vs/workbench/contrib/interactive/browser/interactiveEditor.ts @@ -88,6 +88,7 @@ export class InteractiveEditor extends EditorPane implements IEditorPaneWithScro private _inputCellContainer!: HTMLElement; private _inputFocusIndicator!: HTMLElement; private _inputRunButtonContainer!: HTMLElement; + private _inputConfigContainer!: HTMLElement; private _inputEditorContainer!: HTMLElement; private _codeEditorWidget!: CodeEditorWidget; private _notebookWidgetService: INotebookEditorService; @@ -198,9 +199,36 @@ export class InteractiveEditor extends EditorPane implements IEditorPaneWithScro this._inputRunButtonContainer = DOM.append(this._inputCellContainer, DOM.$('.run-button-container')); this._setupRunButtonToolbar(this._inputRunButtonContainer); this._inputEditorContainer = DOM.append(this._inputCellContainer, DOM.$('.input-editor-container')); + this._setupConfigButtonToolbar(); this._createLayoutStyles(); } + private _setupConfigButtonToolbar() { + this._inputConfigContainer = DOM.append(this._inputEditorContainer, DOM.$('.input-toolbar-container')); + this._inputConfigContainer.style.position = 'absolute'; + this._inputConfigContainer.style.right = '0'; + this._inputConfigContainer.style.marginTop = '6px'; + this._inputConfigContainer.style.marginRight = '12px'; + this._inputConfigContainer.style.zIndex = '1'; + this._inputConfigContainer.style.display = 'none'; + + const menu = this._register(this._menuService.createMenu(MenuId.InteractiveInputConfig, this._contextKeyService)); + const toolbar = this._register(new ToolBar(this._inputConfigContainer, this._contextMenuService, { + getKeyBinding: action => this._keybindingService.lookupKeybinding(action.id), + actionViewItemProvider: (action, options) => { + return createActionViewItem(this._instantiationService, action, options); + }, + renderDropdownAsChildElement: true + })); + + const primary: IAction[] = []; + const secondary: IAction[] = []; + const result = { primary, secondary }; + + createAndFillInActionBarActions(menu, { shouldForwardArgs: true }, result); + toolbar.setActions([...primary, ...secondary]); + } + private _setupRunButtonToolbar(runButtonContainer: HTMLElement) { const menu = this._register(this._menuService.createMenu(MenuId.InteractiveInputExecute, this._contextKeyService)); this._runbuttonToolbar = this._register(new ToolBar(runButtonContainer, this._contextMenuService, { @@ -655,9 +683,11 @@ export class InteractiveEditor extends EditorPane implements IEditorPaneWithScro if (!this._hintElement && !shouldHide) { this._hintElement = this._instantiationService.createInstance(ReplInputHintContentWidget, this._codeEditorWidget); + this._inputConfigContainer.style.display = 'block'; } else if (this._hintElement && shouldHide) { this._hintElement.dispose(); this._hintElement = undefined; + this._inputConfigContainer.style.display = 'none'; } } diff --git a/src/vs/workbench/contrib/interactive/browser/replInputHintContentWidget.ts b/src/vs/workbench/contrib/interactive/browser/replInputHintContentWidget.ts index a7b8f0a9d06..e7f72559e62 100644 --- a/src/vs/workbench/contrib/interactive/browser/replInputHintContentWidget.ts +++ b/src/vs/workbench/contrib/interactive/browser/replInputHintContentWidget.ts @@ -14,9 +14,6 @@ import { ConfigurationChangedEvent, EditorOption } from 'vs/editor/common/config import { localize } from 'vs/nls'; import { IConfigurationService } from 'vs/platform/configuration/common/configuration'; import { IKeybindingService } from 'vs/platform/keybinding/common/keybinding'; -import { editorForeground } from 'vs/platform/theme/common/colorRegistry'; -import { resolveColorValue } from 'vs/platform/theme/common/colorUtils'; -import { IThemeService } from 'vs/platform/theme/common/themeService'; import { AccessibilityVerbositySettingId } from 'vs/workbench/contrib/accessibility/browser/accessibilityConfiguration'; import { InteractiveWindowSetting } from 'vs/workbench/contrib/interactive/browser/interactiveCommon'; @@ -32,7 +29,6 @@ export class ReplInputHintContentWidget extends Disposable implements IContentWi private readonly editor: ICodeEditor, @IConfigurationService private readonly configurationService: IConfigurationService, @IKeybindingService private readonly keybindingService: IKeybindingService, - @IThemeService private readonly themeService: IThemeService, ) { super(); @@ -68,7 +64,7 @@ export class ReplInputHintContentWidget extends Disposable implements IContentWi getDomNode(): HTMLElement { if (!this.domNode) { - this.domNode = dom.$('.repl-input-hint'); + this.domNode = dom.$('.empty-editor-hint'); this.domNode.style.width = 'max-content'; this.domNode.style.paddingLeft = '4px'; @@ -91,12 +87,10 @@ export class ReplInputHintContentWidget extends Disposable implements IContentWi while (this.domNode.firstChild) { this.domNode.removeChild(this.domNode.firstChild); } - const transparentForeground = resolveColorValue(editorForeground, this.themeService.getColorTheme())?.transparent(0.4); const hintElement = dom.$('div.empty-hint-text'); hintElement.style.cursor = 'text'; hintElement.style.whiteSpace = 'nowrap'; - hintElement.style.color = transparentForeground?.toString() || ''; const keybinding = this.getKeybinding(); const keybindingHintLabel = keybinding?.getLabel(); diff --git a/src/vs/workbench/contrib/notebook/browser/notebookIcons.ts b/src/vs/workbench/contrib/notebook/browser/notebookIcons.ts index 20ffe3867e8..63c68389080 100644 --- a/src/vs/workbench/contrib/notebook/browser/notebookIcons.ts +++ b/src/vs/workbench/contrib/notebook/browser/notebookIcons.ts @@ -9,6 +9,7 @@ import { registerIcon } from 'vs/platform/theme/common/iconRegistry'; export const selectKernelIcon = registerIcon('notebook-kernel-select', Codicon.serverEnvironment, localize('selectKernelIcon', 'Configure icon to select a kernel in notebook editors.')); export const executeIcon = registerIcon('notebook-execute', Codicon.play, localize('executeIcon', 'Icon to execute in notebook editors.')); +export const configIcon = registerIcon('notebook-config', Codicon.gear, localize('configIcon', 'Icon to configure in notebook editors.')); export const executeAboveIcon = registerIcon('notebook-execute-above', Codicon.runAbove, localize('executeAboveIcon', 'Icon to execute above cells in notebook editors.')); export const executeBelowIcon = registerIcon('notebook-execute-below', Codicon.runBelow, localize('executeBelowIcon', 'Icon to execute below cells in notebook editors.')); export const stopIcon = registerIcon('notebook-stop', Codicon.primitiveSquare, localize('stopIcon', 'Icon to stop an execution in notebook editors.'));