Skip to content

Conversation

Copy link
Contributor

Copilot AI commented Dec 13, 2025

Chat session titles overflow without ellipsis when they exceed available space next to the side-by-side icon.

Changes

Updated chatViewTitleControl.css to enable proper ellipsis behavior through the nested DOM structure:

  1. .chat-view-title-navigation-toolbar: Added min-width: 0 and flex: 1 to allow the toolbar to shrink and use available space in the flex layout
  2. .monaco-action-bar .actions-container: Added overflow: hidden to enable overflow propagation through the action bar container
  3. .monaco-action-bar .action-item: Added overflow: hidden and min-width: 0 to allow the action item to shrink below its content size

The chat title is rendered within a nested structure (toolbar → action bar → actions container → action item → label). For the text-overflow: ellipsis to work on the label, each parent container in the chain needs proper overflow handling and the ability to shrink in the flex layout. These CSS properties ensure the ellipsis activates correctly when titles exceed available space.

Original prompt

This section details on the original issue you should resolve

<issue_title>Agent sessions: title does not overflow with ellipsis</issue_title>
<issue_description>Notice how the chat title overflows without "..." under the side by side icon:

Image

The CSS class for this control is:

Opening for help wanted.
</issue_description>

Comments on the Issue (you are @copilot in this section)


💡 You can make Copilot smarter by setting up custom instructions, customizing its development environment and configuring Model Context Protocol (MCP) servers. Learn more Copilot coding agent tips in the docs.

Co-authored-by: bpasero <900690+bpasero@users.noreply.github.com>
Copilot AI changed the title [WIP] Fix agent session title overflow issue with ellipsis Fix chat title overflow with ellipsis in agent sessions Dec 13, 2025
Copilot AI requested a review from bpasero December 13, 2025 07:21
@bpasero
Copy link
Member

bpasero commented Dec 13, 2025

@copilot I do not see a "..." with this change.

Co-authored-by: bpasero <900690+bpasero@users.noreply.github.com>
Copy link
Contributor Author

Copilot AI commented Dec 13, 2025

@copilot I do not see a "..." with this change.

I've updated the fix to address the full nesting chain. The issue was that the toolbar contains a monaco-action-bar with nested flex containers, and each level needed proper overflow handling. Added flex properties to enable ellipsis through the entire hierarchy (commit 300db49).

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Agent sessions: title does not overflow with ellipsis

2 participants