Repository navigation
Agent Customizations: Keep row actions aligned when status indicators are shown #338493
Description
Related to #338162
UI nit
Rows that show a compatibility/status icon currently place the icon with the trailing actions. This shifts controls such as Start, the enablement toggle, and the overflow menu horizontally compared with rows that do not have a status indicator.
Expected
Place the status icon in front of the corresponding status message (for example, before Partially supported or Unsupported) so the trailing action area has a stable alignment across rows.
This may not be specific to the MCP Servers page. Any Agent Customizations page that can show a status icon and message should use the same layout: status icon adjacent to its message, with buttons and toggles consistently aligned on the right.
Current behavior
- Rows without a status icon keep their actions aligned.
- Rows with a warning or error icon insert it into the action area and shift the other controls.
- Mixed statuses therefore make the list appear uneven and make controls less predictable to scan.
Suggested layout
[item name]
[status icon] [status message] [actions]
Tested on macOS in both the Agents window and a regular editor window.
Activity
vs-code-engineering commentedon Oct 1, 2026
Sharing media and context from merged PR #339170 for verification:
This pull request implements changes to the MCP customization modal by repositioning the warning and error icons. The icons are now displayed at the beginning of their respective messages, improving visual alignment and clarity.
Changes made:
mcpListWidget.ts.aiCustomizationManagement.css, ensuring they match the text size.aria-hiddento maintain accessibility.mcpListWidget.test.tsto reflect these changes.This update enhances the user experience by providing a more cohesive visual representation of the status messages.
Screenshot
Source PR: #339170