Skip to content

feat(sidebar): show full label in tooltip when truncated#1783

Merged
charlesvien merged 1 commit into
mainfrom
posthog-code/sidebar-label-tooltip
May 18, 2026
Merged

feat(sidebar): show full label in tooltip when truncated#1783
charlesvien merged 1 commit into
mainfrom
posthog-code/sidebar-label-tooltip

Conversation

@posthog
Copy link
Copy Markdown
Contributor

@posthog posthog Bot commented Apr 21, 2026

Summary

When a Task name (or any other sidebar item label) is long enough to be truncated with an ellipsis in the left sidebar, hovering the label now reveals the full name in a tooltip. The tooltip only appears when the label is actually overflowing — it stays out of the way when the full name is already visible.

The implementation lives in apps/code/src/renderer/features/sidebar/components/SidebarItem.tsx and follows the existing pattern used in Combobox.tsx (compare scrollWidth vs clientWidth on mouseenter, drive a controlled Radix Tooltip).

Because all sidebar items pass through SidebarItem, this also benefits long skill names, command center entries, etc.

Test plan

  • In the left sidebar, create or open a task with a very long name and confirm the full name appears in a tooltip on hover.
  • Confirm that short (non-truncated) task names do not trigger a tooltip.
  • Resize the sidebar narrower/wider and confirm the tooltip behavior tracks truncation state.
  • Confirm clicking a task still selects it and right-click still opens the context menu.

Created with PostHog Code

@pauldambra pauldambra requested a review from a team April 22, 2026 14:20
@pauldambra pauldambra marked this pull request as ready for review April 22, 2026 14:20
@greptile-apps
Copy link
Copy Markdown
Contributor

greptile-apps Bot commented Apr 22, 2026

Reviews (1): Last reviewed commit: "feat(sidebar): show full label in toolti..." | Re-trigger Greptile

@fivestarspicy fivestarspicy requested review from a team, adboio, charlesvien and k11kirky and removed request for a team April 23, 2026 19:03
Sidebar items (including task names) truncate long labels with an ellipsis.
Show the full label in a tooltip on hover when, and only when, the label
is actually overflowing. Follows the existing pattern used in
Combobox.tsx.

Generated-By: PostHog Code
Task-Id: 6339d494-8d63-4b68-927e-e97318d257e6
@charlesvien charlesvien force-pushed the posthog-code/sidebar-label-tooltip branch from 2cf8434 to 1ec47a2 Compare May 18, 2026 05:29
@charlesvien charlesvien enabled auto-merge (squash) May 18, 2026 05:30
@greptile-apps
Copy link
Copy Markdown
Contributor

greptile-apps Bot commented May 18, 2026

Prompt To Fix All With AI
Fix the following 1 code review issue. Work through them one at a time, proposing concise fixes.

---

### Issue 1 of 1
apps/code/src/renderer/features/sidebar/components/SidebarItem.tsx:51-53
`handleLabelMouseLeave` wraps a single, stable state-setter call in `useCallback` with no dependencies — the memoization provides no benefit since `setShowLabelTooltip` is already a stable reference. Per the project's simplicity rule ("has no superfluous parts"), it can be inlined as a plain arrow function.

```suggestion
  const handleLabelMouseLeave = () => {
    setShowLabelTooltip(false);
  };
```

Reviews (2): Last reviewed commit: "feat(sidebar): show full label in toolti..." | Re-trigger Greptile

@charlesvien charlesvien merged commit 658a46d into main May 18, 2026
15 checks passed
@charlesvien charlesvien deleted the posthog-code/sidebar-label-tooltip branch May 18, 2026 05:40
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.

1 participant