Skip to content

fix(conversations): Improve tool badge rendering and overflow behavior#115880

Draft
obostjancic wants to merge 5 commits into
masterfrom
ognjenbostjancic/tet-2365-improve-rendering-of-tool-badges
Draft

fix(conversations): Improve tool badge rendering and overflow behavior#115880
obostjancic wants to merge 5 commits into
masterfrom
ognjenbostjancic/tet-2365-improve-rendering-of-tool-badges

Conversation

@obostjancic
Copy link
Copy Markdown
Member

@obostjancic obostjancic commented May 20, 2026

No description provided.

- Add min-width: 0 to Tag's inner Text so text-overflow: ellipsis works
    when the tag is width-constrained
- Cap tool badges in ToolTags (index page) with maxWidth: 100% so long
  names show '...' instead of being clipped by the container boundary
- Cap visible tool badges in ConversationAggregatesBar (detail page) at
  160px with a tooltip showing the full name on overflow
- Replace the non-actionable DropdownMenu for extra tool names with a
  Tooltip — clicking the dropdown previously highlighted items but did
  nothing, which was confusing

Refs LINEAR-TET-2365
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
@linear-code
Copy link
Copy Markdown

linear-code Bot commented May 20, 2026

TET-2365

@github-actions github-actions Bot added the Scope: Frontend Automatically applied to PRs that change frontend components label May 20, 2026
@github-actions
Copy link
Copy Markdown
Contributor

github-actions Bot commented May 20, 2026

📊 Type Coverage Diff

✅ No new type safety issues introduced. Coverage: 93.56%

…ow tooltip

The Tag component's inner Text was display:flex, which prevents
text-overflow:ellipsis from applying to text children (that property
only works on block containers). Switching Text to a plain block
element lets the existing overflow/ellipsis rules actually fire when
TagPill is width-constrained.

Also updates the '+N more' tooltip for tool names to render actual
Tag badges instead of a plain comma-separated string.

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
obostjancic and others added 2 commits May 20, 2026 14:24
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
The selection outline was only on the ClickableTag, making it look
like only the badge was interactive. Moved the isSelected outline to
ToolCallLine so the whole row highlights on selection. Dropped the
ClickableTag wrapper since the row is the clickable unit.

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
…of them

Tags now have flex-shrink:0 so they take their natural width. Only the
last visible tag gets flex-shrink:1 + min-width:0 so it is the only
one that yields and shows ellipsis when the row runs out of space.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Scope: Frontend Automatically applied to PRs that change frontend components

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant