Microsoft/vscode
1
0
Fork 0
mirror of https://github.com/microsoft/vscode.git synced 2026-02-15 07:28:05 +00:00
Code Issues Packages Projects Releases Wiki Activity

update specs

Browse Source
This commit is contained in:
Benjamin Pasero
2026-02-13 19:29:54 +01:00
parent 1b1c97522b
commit e92b65f390
5 changed files with 239 additions and 181 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
.github/skills/agent-sessions-layout/SKILL.md vendored
View File

@@ -1,6 +1,6 @@
---
name: agent-sessions-layout
description: Agent Sessions workbench layout — covers the fixed layout structure, grid configuration, part visibility, editor modal, titlebar, sidebar reveal buttons, and implementation requirements. Use when implementing features or fixing issues in the Agent Sessions workbench layout.
description: Agent Sessions workbench layout — covers the fixed layout structure, grid configuration, part visibility, editor modal, titlebar, sidebar footer, and implementation requirements. Use when implementing features or fixing issues in the Agent Sessions workbench layout.
---
When working on the Agent Sessions workbench layout, always follow these guidelines:
@@ -18,7 +18,6 @@ Before making any changes to the layout code, read and understand the current sp
- Titlebar configuration and custom menu IDs
- Editor modal overlay behavior and sizing
- Part visibility API and events
- Sidebar reveal button behavior
- Agent session part classes and storage keys
- Workbench contributions and lifecycle
- CSS classes and file structure
@@ -42,29 +41,33 @@ When proposing or implementing changes, follow these rules from the spec:
1. **Maintain fixed positions** — Do not add settings-based position customization
2. **Panel must span the right section width** — The grid structure places the panel below Chat Bar and Auxiliary Bar only
3. **Sidebar spans full height** — Sidebar is in the main content branch, spanning from titlebar to bottom
3. **Sidebar spans full height** — Sidebar is in the main content branch, spanning from top to bottom
4. **New parts go in the right section** — Any new parts should be added to the horizontal branch alongside Chat Bar and Auxiliary Bar
5. **Preserve no-op methods** — Unsupported features (zen mode, centered layout, etc.) should remain as no-ops, not throw errors
6. **Handle pane composite lifecycle** — When hiding/showing parts, manage the associated pane composites
7. **Use agent session parts** — New part functionality goes in the agent session part classes (`AgenticSidebarPart`, `AgenticAuxiliaryBarPart`, `AgenticPanelPart`, `ChatBarPart`), not the standard workbench parts
8. **Use separate storage keys** — Agent session parts use their own storage keys (prefixed with `workbench.agentsession.`) to avoid conflicts with regular workbench state
9. **Use agent session menu IDs** — Actions should use `AgenticWorkbenchMenus.*` menu IDs, not shared `MenuId.*` constants
7. **Use agent session parts** — New part functionality goes in the agent session part classes (`SidebarPart`, `AuxiliaryBarPart`, `PanelPart`, `ChatBarPart`), not the standard workbench parts
8. **Use separate storage keys** — Agent session parts use their own storage keys (prefixed with `workbench.agentsession.` or `workbench.chatbar.`) to avoid conflicts with regular workbench state
9. **Use agent session menu IDs** — Actions should use `Menus.*` menu IDs (from `sessions/browser/menus.ts`), not shared `MenuId.*` constants
## 4. Key Files
| File | Purpose |
|------|---------|
| `sessions/LAYOUT.md` | Authoritative specification |
| `sessions/browser/agenticWorkbench.ts` | Main layout implementation |
| `sessions/browser/agenticWorkbenchMenus.ts` | Agent sessions workbench menu IDs |
| `sessions/browser/agenticLayoutActions.ts` | Layout actions (toggle sidebar, panel, terminal) |
| `sessions/browser/agentic.contributions.ts` | Workbench contributions and view registrations |
| `sessions/browser/agenticTitleBarWidget.ts` | Title bar widget and session picker |
| `sessions/browser/workbench.ts` | Main layout implementation (`Workbench` class) |
| `sessions/browser/menus.ts` | Agent sessions menu IDs (`Menus` export) |
| `sessions/browser/layoutActions.ts` | Layout actions (toggle sidebar, panel, secondary sidebar) |
| `sessions/browser/paneCompositePartService.ts` | `AgenticPaneCompositePartService` |
| `sessions/browser/style.css` | Layout-specific styles |
| `sessions/browser/parts/` | Agent session part implementations |
| `sessions/browser/parts/titlebarPart.ts` | Titlebar part, MainTitlebarPart, AuxiliaryTitlebarPart, TitleService |
| `sessions/browser/parts/editorModal.ts` | Editor modal overlay |
| `sessions/browser/parts/sidebarRevealButton.ts` | Edge hover reveal buttons |
| `sessions/browser/parts/chatbar/chatBarPart.ts` | Chat Bar part |
| `sessions/browser/parts/sidebarPart.ts` | Sidebar part (with footer) |
| `sessions/browser/parts/chatBarPart.ts` | Chat Bar part |
| `sessions/browser/widget/` | Agent sessions chat widget |
| `sessions/contrib/sessions/browser/sessionsTitleBarWidget.ts` | Title bar widget and session picker |
| `sessions/contrib/chat/browser/runScriptAction.ts` | Run script contribution |
| `sessions/contrib/accountMenu/browser/account.contribution.ts` | Account widget for sidebar footer |
## 5. Testing Changes
@@ -74,4 +77,4 @@ After modifying layout code:
2. Ensure the grid structure matches the spec's visual representation
3. Confirm part visibility toggling works correctly (show/hide/maximize)
4. Test the editor modal opens/closes properly on editor events
5. Verify sidebar reveal buttons appear when sidebars are hidden
5. Verify sidebar footer renders with account widget

5
src/vs/sessions/AI_CUSTOMIZATIONS.md
View File

@@ -13,8 +13,10 @@ src/vs/sessions/contrib/aiCustomizationManagement/browser/
├── aiCustomizationManagementEditor.ts # SplitView list/editor
├── aiCustomizationManagementEditorInput.ts # Singleton input
├── aiCustomizationListWidget.ts # Search + grouped list
├── aiCustomizationOverviewView.ts # Overview view (counts + deep links)
├── customizationCreatorService.ts # AI-guided creation flow
├── mcpListWidget.ts # MCP servers section
├── SPEC.md # Feature specification
└── media/
└── aiCustomizationManagement.css
@@ -23,6 +25,7 @@ src/vs/sessions/contrib/aiCustomizationTreeView/browser/
├── aiCustomizationTreeView.ts # IDs + menu IDs
├── aiCustomizationTreeViewViews.ts # Tree data source + view
├── aiCustomizationTreeViewIcons.ts # Icons
├── SPEC.md # Feature specification
└── media/
└── aiCustomizationTreeView.css
```
@@ -45,7 +48,7 @@ Key services to rely on:
The active worktree comes from `IActiveSessionService` and is the source of truth for any workspace/worktree scoping.
In the agentic workbench, prompt discovery is scoped by an agentic prompt service override that uses the active session root for workspace folders. See [src/vs/sessions/browser/agenticPromptsService.ts](../sessions/browser/agenticPromptsService.ts) and [src/vs/sessions/browser/agenticPromptFilesLocator.ts](../sessions/browser/agenticPromptFilesLocator.ts).
In the agentic workbench, prompt discovery is scoped by an agentic prompt service override that uses the active session root for workspace folders. See [src/vs/sessions/contrib/chat/browser/promptsService.ts](contrib/chat/browser/promptsService.ts).
## Implemented Experience

282
src/vs/sessions/LAYOUT.md
View File

@@ -6,7 +6,7 @@ This document is the **authoritative specification** for the Agent Sessions work
## 1. Overview
The Agent Sessions Workbench (`AgenticWorkbench`) provides a simplified, fixed layout optimized for agent session workflows. Unlike the default VS Code workbench, this layout:
The Agent Sessions Workbench (`Workbench` in `sessions/browser/workbench.ts`) provides a simplified, fixed layout optimized for agent session workflows. Unlike the default VS Code workbench, this layout:
- Does **not** support settings-based customization
- Has **fixed** part positions
@@ -80,41 +80,41 @@ The titlebar is divided into three sections, each rendered by a `MenuWorkbenchTo
|---------|---------|--------|
| Left | `Menus.TitleBarLeft` | Toggle sidebar and other left-aligned actions |
| Center | `Menus.CommandCenter` | Session picker widget (rendered via `IActionViewItemService`) |
| Right | `Menus.TitleBarRight` | Toggle terminal, toggle secondary sidebar, account menu |
| Right | `Menus.TitleBarRight` | Run script split button, open submenu, toggle secondary sidebar |
No menubar, no editor actions, no layout controls, no `WindowTitle` dependency.
### 3.2 Command Center
The Agent Sessions titlebar includes a command center with a custom title bar widget (`AgenticTitleBarWidget`). It uses custom menu IDs separate from the default workbench command center to avoid conflicts:
The Agent Sessions titlebar includes a command center with a custom title bar widget (`SessionsTitleBarWidget`). It uses custom menu IDs separate from the default workbench command center to avoid conflicts:
- **`Menus.CommandCenter`** — The center toolbar menu (replaces `MenuId.CommandCenter`)
- **`Menus.TitleBarControlMenu`** — A submenu registered in the command center whose rendering is intercepted by `IActionViewItemService` to display the custom widget
The widget:
- Extends `BaseActionViewItem` and renders a clickable label showing the active session title
- Shows kind icon (provider type icon), session title, repository folder name, and changes summary (+insertions -deletions)
- On click, opens the `AgentSessionsPicker` quick pick to switch between sessions
- Gets the active session label from `IActiveSessionService.getActiveSession()`, falling back to "New Session" if no active session is found
- Re-renders automatically when the active session changes via `autorun` on `IActiveSessionService.activeSession`
- Is registered via `AgenticTitleBarContribution` (an `IWorkbenchContribution`) that calls `IActionViewItemService.register()` to intercept the submenu rendering
- Gets the active session label from `IActiveSessionService.getActiveSession()` and the live model title from `IChatService`, falling back to "New Session" if no active session is found
- Re-renders automatically when the active session changes via `autorun` on `IActiveSessionService.activeSession`, and when session data changes via `IAgentSessionsService.model.onDidChangeSessions`
- Is registered via `SessionsTitleBarContribution` (an `IWorkbenchContribution` in `contrib/sessions/browser/sessionsTitleBarWidget.ts`) that calls `IActionViewItemService.register()` to intercept the submenu rendering
### 3.3 Left Toolbar
The Agent Sessions titlebar includes a custom left toolbar that appears after the app icon. This toolbar:
- Uses `AgenticWorkbenchMenus.TitleBarLeft` for its actions
- Uses `Menus.TitleBarLeft` for its actions
- Uses `HiddenItemStrategy.NoHide` so actions cannot be hidden by users
- Displays actions registered to `AgenticWorkbenchMenus.TitleBarLeft`
- Displays actions registered to `Menus.TitleBarLeft`
### 3.4 Titlebar Actions
| Action | ID | Location | Behavior |
|--------|-----|----------|----------|
| Toggle Sidebar | `workbench.action.agentToggleSidebarVisibility` | Left toolbar (`TitleBarLeft`) | Toggles primary sidebar visibility |
| Toggle Terminal | `workbench.action.terminal.toggleTerminal` | Right toolbar (`TitleBarRight`) | Toggles terminal (standard command, added via `MenuRegistry.appendMenuItem`) |
| Run Script | `workbench.action.agentSessions.runScript` | Right toolbar (`TitleBarRight`) | Split button: runs configured script or shows configure dialog |
| Open... | (submenu) | Right toolbar (`TitleBarRight`) | Split button submenu: Open Terminal, Open in VS Code |
| Toggle Secondary Sidebar | `workbench.action.agentToggleSecondarySidebarVisibility` | Right toolbar (`TitleBarRight`) | Toggles auxiliary bar visibility |
| Account | — | Right toolbar (`TitleBarRight`) | Opens `AgenticAccount` submenu with signed-in user (or Sign In), Settings, Check for Updates |
| Show Sessions | — | Title bar widget click | Opens the `AgentSessionsPicker` quick pick |
The toggle sidebar action:
- Shows `layoutSidebarLeft` icon when sidebar is visible
@@ -122,10 +122,16 @@ The toggle sidebar action:
- Bound to `Ctrl+B` / `Cmd+B` keybinding
- Announces visibility changes to screen readers
The toggle terminal action:
- Shows `terminal` icon in the right toolbar
- Uses the standard `workbench.action.terminal.toggleTerminal` command (added via `MenuRegistry.appendMenuItem`)
- Inherits keybinding from the standard terminal contribution (`` Ctrl+` `` / `` Cmd+` ``)
The Run Script action:
- Displayed as a split button via `RunScriptDropdownMenuId` submenu on `Menus.TitleBarRight`
- Primary action runs the configured script command in a terminal
- Dropdown includes "Configure Run Action..." to set/change the script
- Registered in `contrib/chat/browser/runScriptAction.ts`
The Open... action:
- Displayed as a split button via `Menus.OpenSubMenu` on `Menus.TitleBarRight`
- Contains "Open Terminal" (opens terminal at session worktree) and "Open in VS Code" (opens worktree in new VS Code window)
- Registered in `contrib/chat/browser/chat.contribution.ts`
### 3.5 Panel Title Actions
@@ -133,14 +139,16 @@ The panel title bar includes actions for controlling the panel:
| Action | ID | Icon | Order | Behavior |
|--------|-----|------|-------|----------|
| Toggle Maximize | `workbench.action.agentTogglePanelMaximized` | `screenFull` / `screenNormal` | 1 | Maximizes or restores panel size |
| Hide Panel | `workbench.action.agentTogglePanelVisibility` | `close` | 2 | Hides the panel |
The toggle maximize action:
- Shows `screenFull` icon when panel is not maximized
- Shows `screenNormal` icon when panel is maximized
- Uses `PanelMaximizedContext` to toggle between states
- Announces state changes to screen readers
### 3.6 Account Widget
The account widget has been moved from the titlebar to the **sidebar footer**. It is rendered as a custom `AccountWidget` action view item:
- Registered in `contrib/accountMenu/browser/account.contribution.ts`
- Uses the `Menus.SidebarFooter` menu
- Shows account button with sign-in/sign-out and an update button when an update is available
- Account menu shows signed-in user label from `IDefaultAccountService` (or Sign In), Sign Out, Settings, and Check for Updates
---
@@ -252,7 +260,7 @@ class EditorModal extends Disposable {
}
```
The `AgenticWorkbench.layout()` passes the workbench dimensions to `EditorModal.layout()`, which calculates and applies the modal size with min/max constraints. Dimensions are stored so that `show()` can use them when the modal becomes visible.
The `Workbench.layout()` passes the workbench dimensions to `EditorModal.layout()`, which calculates and applies the modal size with min/max constraints. Dimensions are stored so that `show()` can use them when the modal becomes visible.
---
@@ -410,43 +418,42 @@ The Agent Sessions workbench uses specialized part implementations that extend t
| Part | Class | Extends | Location |
|------|-------|---------|----------|
| Sidebar | `AgenticSidebarPart` | `AbstractPaneCompositePart` | `sessions/browser/parts/agenticSidebarPart.ts` |
| Auxiliary Bar | `AgenticAuxiliaryBarPart` | `AbstractPaneCompositePart` | `sessions/browser/parts/agenticAuxiliaryBarPart.ts` |
| Panel | `AgenticPanelPart` | `AbstractPaneCompositePart` | `sessions/browser/parts/agenticPanelPart.ts` |
| Chat Bar | `ChatBarPart` | `AbstractPaneCompositePart` | `sessions/browser/parts/chatbar/chatBarPart.ts` |
| Sidebar | `SidebarPart` | `AbstractPaneCompositePart` | `sessions/browser/parts/sidebarPart.ts` |
| Auxiliary Bar | `AuxiliaryBarPart` | `AbstractPaneCompositePart` | `sessions/browser/parts/auxiliaryBarPart.ts` |
| Panel | `PanelPart` | `AbstractPaneCompositePart` | `sessions/browser/parts/panelPart.ts` |
| Chat Bar | `ChatBarPart` | `AbstractPaneCompositePart` | `sessions/browser/parts/chatBarPart.ts` |
| Titlebar | `TitlebarPart` / `MainTitlebarPart` | `Part` | `sessions/browser/parts/titlebarPart.ts` |
| Project Bar | `ProjectBarPart` | `Part` | `sessions/browser/parts/projectBarPart.ts` |
| Editor Modal | `EditorModal` | `Disposable` | `sessions/browser/parts/editorModal.ts` |
| Sidebar Reveal Button | `SidebarRevealButton` | `Disposable` | `sessions/browser/parts/sidebarRevealButton.ts` |
### 9.2 Key Differences from Standard Parts
| Feature | Standard Parts | Agent Session Parts |
|---------|----------------|---------------------|
| Activity Bar integration | Full support | No activity bar; global activities in titlebar |
| Activity Bar integration | Full support | No activity bar; account widget in sidebar footer |
| Composite bar position | Configurable (top/bottom/title/hidden) | Fixed: Title |
| Composite bar visibility | Configurable | Sidebar: hidden (`shouldShowCompositeBar()` returns `false`); ChatBar: hidden; Auxiliary Bar & Panel: visible |
| Auto-hide support | Configurable | Disabled |
| Configuration listening | Many settings | Minimal |
| Context menu actions | Full set | Simplified |
| Title bar | Full support | Sidebar & ChatBar: `hasTitle: false`; Auxiliary Bar & Panel: `hasTitle: true` |
| Title bar | Full support | Sidebar: `hasTitle: true` (with footer); ChatBar: `hasTitle: false`; Auxiliary Bar & Panel: `hasTitle: true` |
| Visual margins | None | Auxiliary Bar: 8px top/bottom/right (card appearance); Panel: 8px bottom/left/right (card appearance); Sidebar: 0 (flush) |
### 9.3 Part Selection
### 9.3 Part Creation
Each workbench layout is responsible for passing the appropriate pane composite part descriptors to the `PaneCompositePartService`. The parts are defined as `SyncDescriptor0` instances via `IPaneCompositePartsConfiguration`, and the service lazily instantiates them when first requested:
The agent sessions pane composite parts are created and registered via the `AgenticPaneCompositePartService` in `sessions/browser/paneCompositePartService.ts`. This service is registered as a singleton for `IPaneCompositePartService` and directly instantiates each part:
```typescript
// In agenticWorkbench.ts (initServices)
const paneCompositePartsConfiguration: IPaneCompositePartsConfiguration = {
panelPart: new SyncDescriptor(AgenticPanelPart),
sideBarPart: new SyncDescriptor(AgenticSidebarPart),
auxiliaryBarPart: new SyncDescriptor(AgenticAuxiliaryBarPart),
chatBarPart: new SyncDescriptor(ChatBarPart),
};
serviceCollection.set(IPaneCompositePartService, new SyncDescriptor(PaneCompositePartService, [paneCompositePartsConfiguration]));
// In AgenticPaneCompositePartService constructor
this.registerPart(ViewContainerLocation.Panel, instantiationService.createInstance(PanelPart));
this.registerPart(ViewContainerLocation.Sidebar, instantiationService.createInstance(SidebarPart));
this.registerPart(ViewContainerLocation.AuxiliaryBar, instantiationService.createInstance(AuxiliaryBarPart));
this.registerPart(ViewContainerLocation.ChatBar, instantiationService.createInstance(ChatBarPart));
```
This architecture ensures that:
1. The `PaneCompositePartService` has no knowledge of the workspace type—it simply receives part descriptors from the layout class
2. Parts are only instantiated when first accessed, enabling lazy initialization
1. The agent sessions workbench uses its own part implementations rather than the standard workbench parts
2. Each part is instantiated eagerly in the constructor, as the service delegates all operations to the appropriate part by `ViewContainerLocation`
### 9.4 Storage Keys
@@ -471,47 +478,64 @@ Each agent session part uses separate storage keys to avoid conflicts with regul
| Chat Bar | Placeholders | `workbench.chatbar.placeholderPanels` |
| Chat Bar | Workspace state | `workbench.chatbar.viewContainersWorkspaceState` |
### 9.5 Part Borders
### 9.5 Part Borders and Card Appearance
Each part manages its own border styling via the `updateStyles()` method. Borders are applied selectively based on grid position to avoid visual duplication:
Parts manage their own border and background styling via the `updateStyles()` method. The auxiliary bar and panel use a **card appearance** with CSS variables for background and border:
| Part | Border | Color Token | Notes |
|------|--------|-------------|-------|
| Sidebar | Right edge | `SIDE_BAR_BORDER` / `contrastBorder` | Separates sidebar from right section |
| Chat Bar | None | — | No borders; `borderWidth` returns `0` |
| Auxiliary Bar | Left edge | `SIDE_BAR_BORDER` / `contrastBorder` | Separates from chat bar |
| Panel | Top edge | `PANEL_BORDER` / `contrastBorder` | Separates from chat bar and auxiliary bar above |
| Part | Styling | Notes |
|------|---------|-------|
| Sidebar | Right border via `SIDE_BAR_BORDER` / `contrastBorder` | Flush appearance, no card styling |
| Chat Bar | Background only, no borders | `borderWidth` returns `0` |
| Auxiliary Bar | Card appearance via CSS variables `--part-background` / `--part-border-color` | Uses `SIDE_BAR_BACKGROUND` / `SIDE_BAR_BORDER`; transparent background on container; margins create card offset |
| Panel | Card appearance via CSS variables `--part-background` / `--part-border-color` | Uses `PANEL_BACKGROUND` / `PANEL_BORDER`; transparent background on container; margins create card offset |
---
### 9.6 Auxiliary Bar Run Script Dropdown
The `AgenticAuxiliaryBarPart` provides a custom `DropdownWithPrimaryActionViewItem` for the run script action (`workbench.action.agentSessions.runScript`). This is rendered as a split button with:
The `AuxiliaryBarPart` provides a custom `DropdownWithPrimaryActionViewItem` for the run script action (`workbench.action.agentSessions.runScript`). This is rendered as a split button with:
- **Primary action**: Runs the main script action
- **Dropdown**: Shows additional actions from the `AgentSessionsRunScriptDropdown` menu
- The dropdown menu is created from `MenuId.for('AgentSessionsRunScriptDropdown')` and updates dynamically when menu items change
### 9.7 Sidebar Footer
The `SidebarPart` includes a footer section (35px height) positioned below the pane composite content. The sidebar uses a custom `layout()` override that reduces the content height by `FOOTER_HEIGHT` and renders a `MenuWorkbenchToolBar` driven by `Menus.SidebarFooter`. The footer hosts the account widget (see Section 3.6).
On macOS native, the sidebar title area includes a traffic light spacer (70px) to push content past the system window controls, which is hidden in fullscreen mode.
---
## 10. Workbench Contributions
The Agent Sessions workbench registers contributions in `agentic.contributions.ts` via `registerAgenticContributions()`:
The Agent Sessions workbench registers contributions via module imports in `sessions.desktop.main.ts` (and `sessions.common.main.ts`). Key contributions:
| Contribution | Class | Phase | Description |
|-------------|-------|-------|-------------|
| Run Script | `RunScriptContribution` | `AfterRestored` | Script execution support for agent sessions |
| Title Bar Widget | `AgenticTitleBarContribution` | `AfterRestored` | Custom title bar widget with session picker |
| Contribution | Class | Phase | Location |
|-------------|-------|-------|----------|
| Run Script | `RunScriptContribution` | `AfterRestored` | `contrib/chat/browser/runScriptAction.ts` |
| Title Bar Widget | `SessionsTitleBarContribution` | `AfterRestored` | `contrib/sessions/browser/sessionsTitleBarWidget.ts` |
| Account Widget | `AccountWidgetContribution` | `AfterRestored` | `contrib/accountMenu/browser/account.contribution.ts` |
| Active Session Service | `ActiveSessionService` | Singleton | `contrib/sessions/browser/activeSessionService.ts` |
| Prompts Service | `AgenticPromptsService` | Singleton | `contrib/chat/browser/promptsService.ts` |
Additionally, `registerChatBranchActions()` is called to register chat branch session actions.
Additionally, `BranchChatSessionAction` is registered in `contrib/chat/browser/chat.contribution.ts`.
### 10.1 Changes View
The contributions file also registers the Changes view:
The Changes view is registered in `contrib/changesView/browser/changesView.contribution.ts`:
- **Container**: `CHANGES_VIEW_CONTAINER_ID` in `ViewContainerLocation.AuxiliaryBar` (default, hidden if empty)
- **View**: `CHANGES_VIEW_ID` with `ChangesViewPane`
- **Layout visibility**: `LayoutVisibility.AgentSessions` (only visible in agent sessions workbench)
- **Window visibility**: `WindowVisibility.Sessions` (only visible in agent sessions workbench)
### 10.2 Sessions View
The Sessions view is registered in `contrib/sessions/browser/sessions.contribution.ts`:
- **Container**: Sessions container in `ViewContainerLocation.Sidebar` (default)
- **View**: `SessionsViewId` with `AgenticSessionsViewPane`
- **Window visibility**: `WindowVisibility.Sessions`
---
@@ -521,36 +545,70 @@ The contributions file also registers the Changes view:
src/vs/sessions/
├── README.md # Layer specification
├── LAYOUT.md # This specification
├── AI_CUSTOMIZATIONS.md # AI customization design document
├── sessions.common.main.ts # Common entry point (browser + desktop)
├── sessions.desktop.main.ts # Desktop entry point (imports all contributions)
├── common/
│ └── contextkeys.ts # ChatBar context keys
├── browser/ # Core workbench implementation
│ ├── agentic.contributions.ts # Workbench contributions, view registrations, and contribution bootstrapping
│ ├── agenticTitleBarWidget.ts # Title bar widget and rendering contribution
│ ├── agenticWorkbench.ts # Main layout implementation
│ ├── agenticWorkbenchMenus.ts # Agent sessions workbench menu IDs
│ ├── agenticLayoutActions.ts # Layout actions (toggle sidebar, secondary sidebar, panel, terminal)
│ ├── paneCompositePartService.ts # Agentic pane composite part service
│ ├── workbench.ts # Main layout implementation (Workbench class)
│ ├── menus.ts # Agent sessions menu IDs (Menus export)
│ ├── layoutActions.ts # Layout actions (toggle sidebar, secondary sidebar, panel)
│ ├── paneCompositePartService.ts # AgenticPaneCompositePartService
│ ├── style.css # Layout-specific styles (including editor modal)
│ ├── media/
│ │ └── agenticTitleBarWidget.css # Title bar widget styles
│ ├── widget/ # Agent sessions chat widget
│ │ ├── AGENTS_CHAT_WIDGET.md # Chat widget architecture documentation
│ │ ├── agentSessionsChatWidget.ts # Main chat widget wrapper
│ │ ├── agentSessionsChatTargetConfig.ts # Target configuration (observable)
│ │ ├── agentSessionsTargetPickerActionItem.ts # Target picker for input toolbar
│ │ └── media/
│ │ └── agentSessionsChatWidget.css
│ └── parts/
│ ├── titlebarPart.ts # Simplified titlebar part and title service
│ ├── agenticSidebarPart.ts # Agent session sidebar
│ ├── agenticAuxiliaryBarPart.ts # Agent session auxiliary bar (with run script dropdown)
│ ├── agenticPanelPart.ts # Agent session panel
│ ├── titlebarPart.ts # Simplified titlebar part, MainTitlebarPart, AuxiliaryTitlebarPart, and TitleService
│ ├── sidebarPart.ts # Agent session sidebar (with footer and macOS traffic light spacer)
│ ├── auxiliaryBarPart.ts # Agent session auxiliary bar (with run script dropdown)
│ ├── panelPart.ts # Agent session panel
│ ├── chatBarPart.ts # Chat Bar part implementation
│ ├── projectBarPart.ts # Project bar part (folder entries, icon customization)
│ ├── editorModal.ts # Editor modal overlay implementation
│ ├── floatingToolbar.ts # Floating toolbar
│ └── chatbar/
│ ├── chatBarPart.ts # Chat Bar part implementation
│ └── media/
│ └── chatBarPart.css # Chat Bar styles
│ ├── parts.ts # AgenticParts enum
│ ├── agentSessionsChatInputPart.ts # Chat input part adapter
│ ├── agentSessionsChatWelcomePart.ts # Chat welcome part
│ └── media/
│ ├── titlebarpart.css
│ ├── sidebarPart.css
│ ├── chatBarPart.css
│ ├── projectBarPart.css
│ └── agentSessionsChatWelcomePart.css
├── electron-browser/ # Desktop-specific entry points
│ ├── sessions.main.ts
│ ├── sessions.ts
│ ├── sessions.html
│ └── sessions-dev.html
├── contrib/ # Feature contributions
│ ├── sessionsView/browser/ # Agent sessions list view
│ │ └── sessionsViewPane.ts
│ ├── changesView/browser/ # File changes view
│ │ └── changesView.ts
│ ├── chatBranchSession/browser/ # Chat branch session action
│ │ └── chatBranchSessionAction.ts
│ ├── accountMenu/browser/ # Account menu widget for sidebar footer
│ │ ├── account.contribution.ts
│ │ └── media/
│ ├── aiCustomizationManagement/browser/ # AI customization management editor
│ └── aiCustomizationTreeView/browser/ # AI customization tree view sidebar
│ ├── aiCustomizationTreeView/browser/ # AI customization tree view sidebar
│ ├── changesView/browser/ # File changes view
│ │ ├── changesView.contribution.ts
│ │ ├── changesView.ts
│ │ └── media/
│ ├── chat/browser/ # Chat actions and services
│ │ ├── chat.contribution.ts # Open in VS Code, Open Terminal, branch chat, run script, prompts service
│ │ ├── branchChatSessionAction.ts # Branch chat session action
│ │ ├── runScriptAction.ts # Run script contribution and split button
│ │ └── promptsService.ts # Agentic prompts service override
│ ├── configuration/browser/ # Configuration contribution
│ │ └── configuration.contribution.ts
│ └── sessions/browser/ # Sessions view and title bar widget
│ ├── sessions.contribution.ts # Sessions view container, view, and title bar widget registration
│ ├── sessionsViewPane.ts # Sessions list view pane
│ ├── sessionsTitleBarWidget.ts # Title bar widget (SessionsTitleBarWidget, SessionsTitleBarContribution)
│ ├── activeSessionService.ts # IActiveSessionService implementation
│ └── media/
│ └── sessionsTitleBarWidget.css
```
---
@@ -574,14 +632,17 @@ When modifying the Agent Sessions layout:
### 13.1 Startup Sequence
1. `constructor()` — Register error handlers, register workbench contributions (`registerAgenticContributions()`), register layout actions (`registerAgenticLayoutActions()`)
1. `constructor()` — Register error handlers
2. `startup()` — Initialize services and layout
3. `initServices()` — Set up service collection, set lifecycle to `Ready`
4. `initLayout()` — Get services, register layout listeners
5. `renderWorkbench()` — Create DOM, create parts, set up notifications
3. `initServices()` — Set up service collection (including `TitleService`), register singleton services, set lifecycle to `Ready`
4. `initLayout()` — Get services, register layout listeners, register editor open/close listeners
5. `renderWorkbench()` — Create DOM, create parts, create editor modal, set up notifications
6. `createWorkbenchLayout()` — Build the grid structure
7. `layout()` — Perform initial layout
8. `restore()` — Restore parts (open default view containers), set lifecycle to `Restored`, then `Eventually`
7. `createWorkbenchManagement()` — (No-op in agent sessions layout)
8. `layout()` — Perform initial layout
9. `restore()` — Restore parts (open default view containers), set lifecycle to `Restored`, then `Eventually`
Note: Contributions are registered via module imports in `sessions.desktop.main.ts` (through `registerWorkbenchContribution2`, `registerAction2`, `registerSingleton` calls), not via a central registration function.
### 13.2 Part Restoration
@@ -635,49 +696,7 @@ interface IPartVisibilityState {
## 14. Sidebar Reveal Buttons
When the primary sidebar or auxiliary bar is hidden, a round reveal button appears at the corresponding edge of the workbench when the user hovers near it. Clicking the button reveals the sidebar.
### 14.1 Behavior
| Aspect | Detail |
|--------|--------|
| Trigger zone | 36px from the workbench edge |
| Button size | 32px diameter |
| Show animation | Slides in from the edge (0.15s ease-out) |
| Hide animation | Slides out (0.15s ease-out) when mouse moves away from edge |
| Click behavior | Button disappears **instantly** (no slide-out transition), then reveals the sidebar |
| Mouse leave | Button hides when mouse leaves the workbench container entirely (prevents showing when mouse exits to another screen) |
| Left sidebar button | Appears at left edge with chevron-right icon (pointing toward center) |
| Auxiliary bar button | Appears at right edge with chevron-left icon (pointing toward center) |
| Click action | Calls `setPartHidden(false, ...)` to reveal the sidebar |
| Enabled state | Only active when the corresponding sidebar is hidden |
### 14.2 CSS Classes
| Class | Applied To | Notes |
|-------|------------|-------|
| `sidebar-reveal-button` | Button container | Positioned absolute at edge, 50% vertical |
| `sidebar-reveal-button.left` | Left sidebar button | Slides in from left edge |
| `sidebar-reveal-button.right` | Auxiliary bar button | Slides in from right edge |
| `sidebar-reveal-button.visible` | When mouse is in trigger zone | Enables pointer events, slides button in |
| `sidebar-reveal-button.no-transition` | Briefly applied during click | Disables CSS transition for instant hide |
| `sidebar-reveal-button-icon` | Icon span | Contains the codicon chevron |
### 14.3 Constants
| Constant | Value | Description |
|----------|-------|-------------|
| `EDGE_TRIGGER_ZONE_PX` | 36 | Mouse proximity threshold in pixels |
| `BUTTON_SIZE_PX` | 32 | Button diameter in pixels |
### 14.4 Implementation
The `SidebarRevealButton` class (`parts/sidebarRevealButton.ts`) creates one button per side. Two instances are created in `createWorkbenchLayout()` and registered as disposables:
```typescript
this._register(new SidebarRevealButton(this.mainContainer, 'left', this));
this._register(new SidebarRevealButton(this.mainContainer, 'right', this));
```
> **Note:** Sidebar reveal buttons (`SidebarRevealButton`) have been removed from the implementation. The corresponding file `parts/sidebarRevealButton.ts` no longer exists. Sidebar visibility is controlled via the toggle actions in the titlebar (see Section 3.4).
---
@@ -685,6 +704,7 @@ this._register(new SidebarRevealButton(this.mainContainer, 'right', this));
| Date | Change |
|------|--------|
| 2026-02-13 | Documentation sync: Updated all file names, class names, and references to match current implementation. `AgenticWorkbench` → `Workbench`, `AgenticSidebarPart` → `SidebarPart`, `AgenticAuxiliaryBarPart` → `AuxiliaryBarPart`, `AgenticPanelPart` → `PanelPart`, `agenticWorkbench.ts` → `workbench.ts`, `agenticWorkbenchMenus.ts` → `menus.ts`, `agenticLayoutActions.ts` → `layoutActions.ts`, `AgenticTitleBarWidget` → `SessionsTitleBarWidget`, `AgenticTitleBarContribution` → `SessionsTitleBarContribution`. Removed references to deleted files (`sidebarRevealButton.ts`, `floatingToolbar.ts`, `agentic.contributions.ts`, `agenticTitleBarWidget.ts`). Updated pane composite architecture from `SyncDescriptor`-based to `AgenticPaneCompositePartService`. Moved account widget docs from titlebar to sidebar footer. Added documentation for sidebar footer, project bar, traffic light spacer, card appearance styling, widget directory, and new contrib structure (`accountMenu/`, `chat/`, `configuration/`, `sessions/`). Updated titlebar actions to reflect Run Script split button and Open submenu. Removed Toggle Maximize panel action (no longer registered). Updated contributions section with all current contributions and their locations. |
| 2026-02-13 | Changed grid structure: sidebar now spans full window height at root level (HORIZONTAL root orientation); Titlebar moved inside right section; Grid is now `Sidebar \| [Titlebar / TopRight / Panel]` instead of `Titlebar / [Sidebar \| RightSection]`; Panel maximize now excludes both titlebar and sidebar; Floating toolbar positioning no longer depends on titlebar height |
| 2026-02-11 | Simplified titlebar: replaced `BrowserTitlebarPart`-derived implementation with standalone `TitlebarPart` using three `MenuWorkbenchToolBar` sections (left/center/right); Removed `CommandCenterControl`, `WindowTitle`, layout toolbar, and manual toolbar management; Center section uses `Menus.CommandCenter` which renders session picker via `IActionViewItemService`; Right section uses `Menus.TitleBarRight` which includes account submenu; Removed `commandCenterControl.ts` file |
| 2026-02-11 | Removed activity actions (Accounts, Manage) from titlebar; Added `AgenticAccount` submenu to `TitleBarRight` with account icon; Menu shows signed-in user label from `IDefaultAccountService` (or Sign In action if no account), Settings, and Check for Updates; Added `AgenticAccountContribution` workbench contribution for dynamic account state; Added `AgenticAccount` menu ID to `Menus` |

79
src/vs/sessions/README.md
View File

@@ -40,45 +40,76 @@ The `vs/sessions` layer follows the same layering conventions as `vs/workbench`:
src/vs/sessions/
├── README.md ← This specification
├── LAYOUT.md ← Layout specification for the agentic workbench
├── AI_CUSTOMIZATIONS.md ← AI customization design document
├── sessions.common.main.ts ← Common (browser + desktop) entry point
├── sessions.desktop.main.ts ← Desktop entry point
├── common/ ← Shared types and context keys
│ └── contextkeys.ts ← ChatBar context keys
├── browser/ ← Core workbench implementation
│ ├── agenticWorkbench.ts ← Main workbench layout
│ ├── agentic.contributions.ts ← Workbench contributions registration
│ ├── agenticLayoutActions.ts ← Layout toggle actions
│ ├── agenticWorkbenchMenus.ts ← Menu IDs for agentic menus
│ ├── agenticTitleBarWidget.ts ← Title bar session picker widget
│ ├── paneCompositePartService.ts ← Agentic pane composite part service
│ ├── workbench.ts ← Main workbench layout (Workbench class)
│ ├── layoutActions.ts ← Layout toggle actions
│ ├── menus.ts ← Menu IDs for agent sessions menus (Menus export)
│ ├── paneCompositePartService.ts ← AgenticPaneCompositePartService
│ ├── style.css ← Layout styles
│ ├── media/ ← CSS assets
│ ├── widget/ ← Agent sessions chat widget
│ │ ├── AGENTS_CHAT_WIDGET.md ← Chat widget architecture documentation
│ │ ├── agentSessionsChatWidget.ts ← Main chat widget wrapper
│ │ ├── agentSessionsChatTargetConfig.ts ← Target configuration (observable)
│ │ ├── agentSessionsTargetPickerActionItem.ts ← Target picker for input toolbar
│ │ └── media/
│ │ └── agentSessionsChatWidget.css
│ └── parts/ ← Workbench part implementations
│ ├── agenticTitlebarPart.ts ← Titlebar part & title service
│ ├── agenticSidebarPart.ts ← Sidebar part
│ ├── agenticAuxiliaryBarPart.ts ← Auxiliary bar part
│ ├── agenticPanelPart.ts ← Panel part
│ ├── titlebarPart.ts ← Simplified titlebar part & title service
│ ├── sidebarPart.ts ← Sidebar part (with footer)
│ ├── auxiliaryBarPart.ts ← Auxiliary bar part (with run script dropdown)
│ ├── panelPart.ts ← Panel part
│ ├── chatBarPart.ts ← Chat bar part
│ ├── projectBarPart.ts ← Project bar part (folder entries)
│ ├── editorModal.ts ← Editor modal overlay
│ ├── floatingToolbar.ts ← Floating toolbar
│ └── chatbar/ ← Chat bar part
├── contrib/ ← Feature contributions (like vs/workbench/contrib/)
│ ├── sessionsView/ ← Sessions list view
│ │ └── browser/
│ ├── changesView/ ← File changes view
│ │ └── browser/
│ ├── chatBranchSession/ ← Chat branch session action
│ │ └── browser/
│ ├── parts.ts ← AgenticParts enum
│ ├── agentSessionsChatInputPart.ts ← Chat input part adapter
│ ├── agentSessionsChatWelcomePart.ts ← Chat welcome part
│ └── media/ ← Part CSS
├── electron-browser/ ← Desktop-specific entry points
│ ├── sessions.main.ts
│ ├── sessions.ts
│ ├── sessions.html
│ └── sessions-dev.html
├── contrib/ ← Feature contributions
│ ├── accountMenu/browser/ ← Account menu widget and sidebar footer
│ │ └── account.contribution.ts
│ ├── aiCustomizationManagement/ ← AI customization management editor
│ │ └── browser/
│ └── aiCustomizationTreeView/ ← AI customization tree view sidebar
│ └── browser/
│ ├── aiCustomizationTreeView/ ← AI customization tree view sidebar
│ │ └── browser/
│ ├── changesView/browser/ ← File changes view
│ │ ├── changesView.contribution.ts
│ │ └── changesView.ts
│ ├── chat/browser/ ← Chat-related actions and services
│ │ ├── chat.contribution.ts
│ │ ├── branchChatSessionAction.ts
│ │ ├── runScriptAction.ts
│ │ └── promptsService.ts
│ ├── configuration/browser/ ← Configuration contribution
│ │ └── configuration.contribution.ts
│ └── sessions/browser/ ← Sessions view and title bar widget
│ ├── sessions.contribution.ts
│ ├── sessionsViewPane.ts
│ ├── sessionsTitleBarWidget.ts
│ ├── activeSessionService.ts
│ └── media/
```
## What is the Agentic Window?
The Agentic Window (`AgenticWorkbench`) provides a simplified, fixed-layout workbench tailored for agent session workflows. Unlike the standard VS Code workbench:
The Agentic Window (`Workbench`) provides a simplified, fixed-layout workbench tailored for agent session workflows. Unlike the standard VS Code workbench:
- **Fixed layout** — Part positions are not configurable via settings
- **Simplified chrome** — No activity bar, no status bar, no banner
- **Chat-first UX** — Chat bar is a primary part alongside sidebar and auxiliary bar
- **Modal editor** — Editors appear as modal overlays rather than in the main grid
- **Session-aware titlebar** — Titlebar shows active session with a session picker
- **Sidebar footer** — Account widget and sign-in live in the sidebar footer
See [LAYOUT.md](LAYOUT.md) for the detailed layout specification.
@@ -88,7 +119,7 @@ When adding features to the agentic window:
1. **Core workbench code** (layout, parts, services) goes under `browser/`
2. **Feature contributions** (views, actions, editors) go under `contrib/<featureName>/browser/`
3. Register contributions via `browser/agentic.contributions.ts`
3. Register contributions by importing them in `sessions.desktop.main.ts` (or `sessions.common.main.ts` for browser-compatible code)
4. Do **not** add imports from `vs/workbench` back to `vs/sessions`
5. Contributions can import from `vs/sessions/browser/` (core) and other `vs/sessions/contrib/*/` modules
6. Update the layout spec (`LAYOUT.md`) for any layout changes

23
src/vs/sessions/browser/widget/AGENTS_CHAT_WIDGET.md
View File

@@ -67,7 +67,7 @@ graph TD
### 3.1 `AgentSessionsChatWidget`
**Location:** `src/vs/workbench/agentSessions/widget/agentSessionsChatWidget.ts`
**Location:** `src/vs/sessions/browser/widget/agentSessionsChatWidget.ts`
The main wrapper around `ChatWidget`. It:
@@ -121,7 +121,7 @@ sequenceDiagram
### 3.2 `AgentSessionsChatTargetConfig`
**Location:** `src/vs/workbench/agentSessions/widget/agentSessionsChatTargetConfig.ts`
**Location:** `src/vs/sessions/browser/widget/agentSessionsChatTargetConfig.ts`
A reactive configuration object that tracks:
@@ -146,7 +146,7 @@ The target config is **purely UI state** — changing targets does NOT create se
### 3.3 `AgentSessionsChatWelcomePart`
**Location:** `src/vs/workbench/agentSessions/widget/chatContentPart/agentSessionsChatWelcomePart.ts`
**Location:** `src/vs/sessions/browser/parts/agentSessionsChatWelcomePart.ts`
Renders the welcome view when the chat is empty:
@@ -159,7 +159,7 @@ The welcome part reads from `IAgentChatTargetConfig` and the `IChatSessionsServi
### 3.4 `AgentSessionsChatInputPart`
**Location:** `src/vs/workbench/agentSessions/widget/chatContentPart/agentSessionsChatInputPart.ts`
**Location:** `src/vs/sessions/browser/parts/agentSessionsChatInputPart.ts`
A standalone adapter around `ChatInputPart` that bridges `IAgentChatTargetConfig` to the existing `ISessionTypePickerDelegate` interface. It creates a `createTargetConfigDelegate()` bridge so the standard `ChatInputPart` can work with the new target config system without modifications.
@@ -167,7 +167,7 @@ A standalone adapter around `ChatInputPart` that bridges `IAgentChatTargetConfig
### 3.5 `AgentSessionsTargetPickerActionItem`
**Location:** `src/vs/workbench/agentSessions/widget/agentSessionsTargetPickerActionItem.ts`
**Location:** `src/vs/sessions/browser/widget/agentSessionsTargetPickerActionItem.ts`
A dropdown picker action item for the input toolbar that reads available targets from `IAgentChatTargetConfig` (rather than `chatSessionsService`). Selection calls `targetConfig.setSelectedTarget()` with no session creation side effects. It renders the current target's icon and name, with a chevron to open the dropdown of allowed targets. The picker automatically re-renders when the selected target or allowed targets change.
@@ -425,16 +425,17 @@ graph TB
## 8. File Structure
```
src/vs/workbench/agentSessions/widget/
src/vs/sessions/browser/widget/
├── AGENTS_CHAT_WIDGET.md # This document
├── agentSessionsChatWidget.ts # Main widget wrapper
├── agentSessionsChatTargetConfig.ts # Target configuration (observable)
├── agentSessionsTargetPickerActionItem.ts # Target picker for input toolbar
├── media/
│ └── agentSessionsChatWidget.css # Widget-specific styles
└── chatContentPart/
├── agentSessionsChatInputPart.ts # Input part adapter
└── agentSessionsChatWelcomePart.ts # Welcome view (mascot + pickers)
└── media/
└── agentSessionsChatWidget.css # Widget-specific styles
src/vs/sessions/browser/parts/
├── agentSessionsChatInputPart.ts # Input part adapter
└── agentSessionsChatWelcomePart.ts # Welcome view (mascot + pickers)
```
---