From 5d0538edf60dfe39fb94fe1e89127dd830ed07f0 Mon Sep 17 00:00:00 2001 From: meganrogge Date: Mon, 31 Aug 2026 14:16:33 -0400 Subject: [PATCH 1/2] sessions: add chevrons to new session pills Replace the Issue/PR plus with the same dropdown affordance used by the harness and workspace pickers.\n\nCo-authored-by: Copilot <223556219+Copilot@users.noreply.github.com> --- .../contrib/chat/browser/media/chatWidget.css | 4 ++++ .../sessions/contrib/chat/browser/newChatWidget.ts | 2 -- .../contrib/chat/browser/sessionWorkspacePicker.ts | 11 +++++++++-- .../contrib/chat/test/browser/newChatWidget.test.ts | 10 +++++----- .../test/browser/sessionWorkspacePicker.test.ts | 13 +++++++------ 5 files changed, 25 insertions(+), 15 deletions(-) diff --git a/src/vs/sessions/contrib/chat/browser/media/chatWidget.css b/src/vs/sessions/contrib/chat/browser/media/chatWidget.css index 987ce309a4bd25..cb02d27df0d2ff 100644 --- a/src/vs/sessions/contrib/chat/browser/media/chatWidget.css +++ b/src/vs/sessions/contrib/chat/browser/media/chatWidget.css @@ -286,6 +286,10 @@ font-size: var(--vscode-codiconFontSize); } +.sessions-chat-picker-slot.sessions-workspace-category-picker-slot .action-label > .sessions-chat-dropdown-chevron { + font-size: var(--vscode-codiconFontSize-compact); +} + .sessions-workspace-category-picker .sessions-chat-dropdown-label { margin-left: 0; } diff --git a/src/vs/sessions/contrib/chat/browser/newChatWidget.ts b/src/vs/sessions/contrib/chat/browser/newChatWidget.ts index c8d50975c55621..da7b43eff538cb 100644 --- a/src/vs/sessions/contrib/chat/browser/newChatWidget.ts +++ b/src/vs/sessions/contrib/chat/browser/newChatWidget.ts @@ -210,7 +210,6 @@ export class NewChatWidget extends Disposable { loading, historyKey: constObservable(undefined), // no persisted history for the new-session view placeholder: localize('newSessionPromptPlaceholder', "Pitch your idea"), - sessionTypePickerOptions: { showChevron: false }, supportsBackground: true, deferredNotificationsEnabled, petHostPreferred: this.options.petHostPreferred, @@ -707,7 +706,6 @@ export class NewChatWidget extends Disposable { label: localize('newSessionWorkspacePicker.githubContext', "Issue/PR"), ariaLabel: localize('newSessionWorkspacePicker.githubContextAriaLabel', "Attach a GitHub issue or pull request to the new session"), tooltip: localize('newSessionWorkspacePicker.githubContextTooltip', "Attach an issue or pull request as context"), - icon: Codicon.add, hideIconWhenAttached: true, group: SESSION_WORKSPACE_GROUP_GITHUB, attachesContext: true, diff --git a/src/vs/sessions/contrib/chat/browser/sessionWorkspacePicker.ts b/src/vs/sessions/contrib/chat/browser/sessionWorkspacePicker.ts index 0275ccce7b1377..3dd4852db68c52 100644 --- a/src/vs/sessions/contrib/chat/browser/sessionWorkspacePicker.ts +++ b/src/vs/sessions/contrib/chat/browser/sessionWorkspacePicker.ts @@ -105,7 +105,7 @@ export interface IWorkspacePickerTrigger { readonly label?: string; readonly ariaLabel: string; readonly tooltip?: string; - readonly icon: ThemeIcon; + readonly icon?: ThemeIcon; readonly hideIconWhenAttached?: boolean; readonly reflectsWorkspace?: boolean; readonly group?: string; @@ -137,6 +137,7 @@ interface IWorkspacePickerTriggerElements { icon?: HTMLElement; label?: HTMLElement; badge?: CountBadge; + chevron?: HTMLElement; } type IWorkspacePickerAction = IAction & { ariaLabel?: string; icon?: ThemeIcon; hoverContent?: string; onRemove?: () => void }; @@ -1465,7 +1466,7 @@ export class WorkspacePicker extends Disposable { trigger.classList.toggle('selected', (reflectsWorkspace && workspace !== undefined) || isSelectedCategory || badgeCount > 0 || relatedGitHubInfo !== undefined); const icon = (reflectsWorkspace ? workspace?.icon : undefined) ?? (relatedGitHubInfo ? Codicon.repo : (isSelectedCategory && workspace ? workspace.icon : options.icon)); - if (options.hideIconWhenAttached === true && badgeCount > 0) { + if (!icon || (options.hideIconWhenAttached === true && badgeCount > 0)) { contents.icon?.remove(); contents.icon = undefined; } else { @@ -1496,6 +1497,12 @@ export class WorkspacePicker extends Disposable { contents.badge?.dispose(); contents.badge = undefined; } + if (!contents.chevron) { + contents.chevron = renderIcon(Codicon.chevronDownCompact); + contents.chevron.classList.add('sessions-chat-dropdown-chevron'); + contents.chevron.setAttribute('aria-hidden', 'true'); + } + trigger.append(contents.chevron); return; } diff --git a/src/vs/sessions/contrib/chat/test/browser/newChatWidget.test.ts b/src/vs/sessions/contrib/chat/test/browser/newChatWidget.test.ts index 8ab06da47e3e49..e9c2adb165af85 100644 --- a/src/vs/sessions/contrib/chat/test/browser/newChatWidget.test.ts +++ b/src/vs/sessions/contrib/chat/test/browser/newChatWidget.test.ts @@ -117,7 +117,7 @@ interface ISendHarness { interface IRenderWorkspacePickerHarness { readonly _workspacePickerVisibleKey: { set(value: boolean): void }; readonly _workspacePicker: { - renderCategoryTriggers(container: HTMLElement, triggers: readonly { readonly label?: string; readonly tooltip?: string; readonly attachesContext?: boolean }[]): HTMLElement; + renderCategoryTriggers(container: HTMLElement, triggers: readonly { readonly label?: string; readonly tooltip?: string; readonly icon?: { readonly id: string }; readonly attachesContext?: boolean }[]): HTMLElement; }; readonly _newChatInput: { readonly sessionTypePicker: { @@ -161,7 +161,7 @@ suite('NewChatWidget', () => { test('workspace row hosts a multiple-harness picker first', () => { const container = document.createElement('div'); const harnessLabels = ['Copilot', 'Claude']; - const workspaceTriggers: { readonly tooltip: string | undefined; readonly attachesContext: boolean | undefined }[] = []; + const workspaceTriggers: { readonly tooltip: string | undefined; readonly icon: string | undefined; readonly attachesContext: boolean | undefined }[] = []; const harness: IRenderWorkspacePickerHarness = { _workspacePickerVisibleKey: { set: () => { } }, _workspacePicker: { @@ -172,7 +172,7 @@ suite('NewChatWidget', () => { const item = document.createElement('div'); item.textContent = trigger.label ?? 'More'; row.appendChild(item); - workspaceTriggers.push({ tooltip: trigger.tooltip, attachesContext: trigger.attachesContext }); + workspaceTriggers.push({ tooltip: trigger.tooltip, icon: trigger.icon?.id, attachesContext: trigger.attachesContext }); } return row; }, @@ -207,8 +207,8 @@ suite('NewChatWidget', () => { ], ); assert.deepStrictEqual(workspaceTriggers, [ - { tooltip: 'Choose where the new session runs', attachesContext: false }, - { tooltip: 'Attach an issue or pull request as context', attachesContext: true }, + { tooltip: 'Choose where the new session runs', icon: 'project', attachesContext: false }, + { tooltip: 'Attach an issue or pull request as context', icon: undefined, attachesContext: true }, ]); }); diff --git a/src/vs/sessions/contrib/chat/test/browser/sessionWorkspacePicker.test.ts b/src/vs/sessions/contrib/chat/test/browser/sessionWorkspacePicker.test.ts index 61f5f84b37e38c..521423977748f6 100644 --- a/src/vs/sessions/contrib/chat/test/browser/sessionWorkspacePicker.test.ts +++ b/src/vs/sessions/contrib/chat/test/browser/sessionWorkspacePicker.test.ts @@ -1283,14 +1283,15 @@ suite('WorkspacePicker - Category Triggers', () => { expanded: trigger.getAttribute('aria-expanded'), role: trigger.getAttribute('role'), tabIndex: trigger.tabIndex, + icons: Array.from(trigger.querySelectorAll('.codicon'), icon => icon.classList.item(1)), })), }, { selectedFolderUri: folderUri.toString(), triggers: [ - { label: 'local/project', ariaLabel: 'Folder: local/project', hidden: false, hasPopup: 'listbox', expanded: 'false', role: 'button', tabIndex: 0 }, - { label: 'Repo, Issue, or PR', ariaLabel: 'Choose a GitHub target', hidden: false, hasPopup: 'listbox', expanded: 'false', role: 'button', tabIndex: 0 }, - { label: 'Remote Setup', ariaLabel: 'Choose a remote setup', hidden: true, hasPopup: 'listbox', expanded: 'false', role: 'button', tabIndex: 0 }, - { label: undefined, ariaLabel: 'More workspace options', hidden: false, hasPopup: 'listbox', expanded: 'false', role: 'button', tabIndex: 0 }, + { label: 'local/project', ariaLabel: 'Folder: local/project', hidden: false, hasPopup: 'listbox', expanded: 'false', role: 'button', tabIndex: 0, icons: ['codicon-folder', 'codicon-chevron-down-compact'] }, + { label: 'Repo, Issue, or PR', ariaLabel: 'Choose a GitHub target', hidden: false, hasPopup: 'listbox', expanded: 'false', role: 'button', tabIndex: 0, icons: ['codicon-github', 'codicon-chevron-down-compact'] }, + { label: 'Remote Setup', ariaLabel: 'Choose a remote setup', hidden: true, hasPopup: 'listbox', expanded: 'false', role: 'button', tabIndex: 0, icons: ['codicon-radio-tower', 'codicon-chevron-down-compact'] }, + { label: undefined, ariaLabel: 'More workspace options', hidden: false, hasPopup: 'listbox', expanded: 'false', role: 'button', tabIndex: 0, icons: ['codicon-ellipsis', 'codicon-chevron-down-compact'] }, ], }); }); @@ -2175,7 +2176,7 @@ suite('WorkspacePicker - Category Triggers', () => { const contextTrigger = container.querySelector('.action-label'); const getContextTriggerSnapshot = () => ({ label: contextTrigger?.querySelector('.sessions-chat-dropdown-label')?.textContent, - icon: contextTrigger?.querySelector('.codicon')?.className, + icon: contextTrigger?.querySelector('.codicon:not(.sessions-chat-dropdown-chevron)')?.className, badge: contextTrigger?.querySelector('.monaco-count-badge')?.textContent, ariaLabel: contextTrigger?.getAttribute('aria-label'), }); @@ -2230,7 +2231,7 @@ suite('WorkspacePicker - Category Triggers', () => { }]); const contextTrigger = container.querySelector('.action-label'); const getContextTriggerSnapshot = () => ({ - icon: contextTrigger?.querySelector('.codicon')?.className, + icon: contextTrigger?.querySelector('.codicon:not(.sessions-chat-dropdown-chevron)')?.className, badge: contextTrigger?.querySelector('.monaco-count-badge')?.textContent, ariaLabel: contextTrigger?.getAttribute('aria-label'), }); From ae55ad7a4c87aaef9199598e4684769eb6efc59e Mon Sep 17 00:00:00 2001 From: meganrogge Date: Mon, 31 Aug 2026 14:36:32 -0400 Subject: [PATCH 2/2] sessions: update new session screenshot baselines Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com> Copilot-Session: 8d31eaa8-0167-4e21-9b96-54e229afb71e --- test/componentFixtures/blocks-ci-screenshots.md | 16 ++++++++-------- 1 file changed, 8 insertions(+), 8 deletions(-) diff --git a/test/componentFixtures/blocks-ci-screenshots.md b/test/componentFixtures/blocks-ci-screenshots.md index 9abfa86b329860..02e2a56a761491 100644 --- a/test/componentFixtures/blocks-ci-screenshots.md +++ b/test/componentFixtures/blocks-ci-screenshots.md @@ -181,25 +181,25 @@ ![screenshot](https://hediet-screenshots.azurewebsites.net/images/fe4b95bf8348637bba9f8c0dda791924e6c67fd7b5d173398f9b2c0bfc9f7071) #### sessions/chat/newWidget/newChatWidget/NewSessionAttachedContext/Dark -![screenshot](https://hediet-screenshots.azurewebsites.net/images/9dd5cb9b114587470db6803b4bf884569e5f194b2ac59917b16a5594f85d39e3) +![screenshot](https://hediet-screenshots.azurewebsites.net/images/1d76cd2c4bda9bed2203215ccd84ef0644895a8eddd5efc5934520dce3f5fce8) #### sessions/chat/newWidget/newChatWidget/NewSessionAttachedContext/Light -![screenshot](https://hediet-screenshots.azurewebsites.net/images/2f75cbf90dab111ea0046ac73d12d94e9c9b30527f9b21f0c8e37a04a56fca9a) +![screenshot](https://hediet-screenshots.azurewebsites.net/images/fe415859b934c657863844d2bfbf30da4ae84a2b167301ba2517d317588c6ed8) #### sessions/chat/newWidget/newChatWidget/NewSessionGitHubContextPicker/Dark -![screenshot](https://hediet-screenshots.azurewebsites.net/images/f086eab931893dfbd3e89a3bc3a2a7d82b6a01cebcd9e2cab261312e7e7f8c40) +![screenshot](https://hediet-screenshots.azurewebsites.net/images/a5e62a510e536d64b4d76dc940a3ad0b744caa7c3a58111492be9f20ea8db801) #### sessions/chat/newWidget/newChatWidget/NewSessionGitHubContextPicker/Light -![screenshot](https://hediet-screenshots.azurewebsites.net/images/151aef4a5e1bd90a74bd1909b1f1cfcc835ed919915d3ff2642a126a030fbeda) +![screenshot](https://hediet-screenshots.azurewebsites.net/images/55683f61601d660f2f94c5c7a24179d782a0776464fa2680c5e00fa7b6fb2ee8) #### sessions/chat/newWidget/newChatWidget/NewSessionRemoteWorkspace/Dark -![screenshot](https://hediet-screenshots.azurewebsites.net/images/bfd64d2a85edefe37bb2cd3b20458d89a1af7e7c4d7a5673f32ac866fb2ff541) +![screenshot](https://hediet-screenshots.azurewebsites.net/images/8c86c66d82f1ef4e19e918463bfb5827167a22e238d81f66d1e48870862fb229) #### sessions/chat/newWidget/newChatWidget/NewSessionRemoteWorkspace/Light -![screenshot](https://hediet-screenshots.azurewebsites.net/images/5142bf2b75067136faa90ddec3e1bab9a7aa288ebc162c6c1a7fbcae91d5f3bb) +![screenshot](https://hediet-screenshots.azurewebsites.net/images/6a96db096792e9d7f75306eaa04c7e89e26a39870871b8480cc39fb5cf2cfe71) #### sessions/chat/newWidget/newChatWidget/NewSessionWorkspacePicker/Dark -![screenshot](https://hediet-screenshots.azurewebsites.net/images/26fb07af7fffd1027d8b46d241778994a28a87f831e50c524e6e3fc950ff1128) +![screenshot](https://hediet-screenshots.azurewebsites.net/images/e9cbba25dc68f5f66bf85428b133461f2d1ebc236b1d6f82d08ae05aab9c33c7) #### sessions/chat/newWidget/newChatWidget/NewSessionWorkspacePicker/Light -![screenshot](https://hediet-screenshots.azurewebsites.net/images/7692e62a3cff5b8f97a758905e457ca531f7911d0f541cf0baa9e51932316959) +![screenshot](https://hediet-screenshots.azurewebsites.net/images/c51cbace6b7e770064231bb3aac07f91ad41e4fcf4d5bd6aedfbdb00c775fa45)