feat(sidebar): Fade and ticker-scroll long titles

[charlesvien]

Problem

Long task titles in the sidebar truncate with an ellipsis, so the end of the title is unreadable.

Changes

Overflowing sidebar titles now fade out at the right edge instead of showing "...". Hovering the row scrolls the title left at a constant speed like a stock ticker until the end is visible, with the fade flipping to the left edge, and it snaps back to the start on mouse leave. Titles that fit are unchanged. The truncation tooltip is removed since the ticker now reveals the full title.

How did you test this?

Biome, pnpm --filter @posthog/ui typecheck and the sidebar Vitest suite (109 tests pass).

Automatic notifications

• Publish to changelog?
• Alert Sales and Marketing teams?

[trunk-io]

😎 This pull request was merged.

[github-actions]

React Doctor found 4 issues in 1 file · 4 warnings.

4 warnings

src/primitives/OverflowTickerText.tsx

• ⚠️ src/primitives/OverflowTickerText.tsx:47 State only used in handlers rerender-state-only-in-handlers
• ⚠️ src/primitives/OverflowTickerText.tsx:47 Prop derived into useState no-derived-useState
• ⚠️ src/primitives/OverflowTickerText.tsx:52 State only used in handlers rerender-state-only-in-handlers
• ⚠️ src/primitives/OverflowTickerText.tsx:65 State initialized from a mount effect no-initialize-state

_{Reviewed by React Doctor for commit 15fea89.}

[greptile-apps]

Prompt To Fix All With AI

Fix the following 2 code review issues. Work through them one at a time, proposing concise fixes.

---

### Issue 1 of 2
packages/ui/src/features/sidebar/components/SidebarItem.tsx:140-141
**Pointer-only title reveal**

When a keyboard user focuses a sidebar button with an overflowing title, keyboard focus never updates `isHovered`, so the ticker remains inactive and the faded, clipped title cannot be read in full.

### Issue 2 of 2
packages/ui/src/features/sidebar/components/SidebarItem.tsx:84-91
**Ticker ignores reduced motion**

When a user with `prefers-reduced-motion` enabled points at an overflowing title, this inline transform transition still runs for the computed duration, causing motion despite the user's operating-system preference.

_{Reviews (1): Last reviewed commit: "fade and scroll overflowing sidebar titl..." | Re-trigger Greptile}

[greptile-apps]

_{Reviews (2): Last reviewed commit: "apply title ticker to channel names" | Re-trigger Greptile}

[posthog]

✅ Visual changes approved by @charlesvien — baseline updated in 82c2923.

View this run in PostHog

1 changed.

[greptile-apps]

_{Reviews (3): Last reviewed commit: "add overflow ticker tests" | Re-trigger Greptile}

[github-actions]

Sidebar/canvas UI-only change (ticker-scroll long titles) with solid test coverage; both Greptile concerns (keyboard focus reveal, reduced-motion handling) are visibly implemented and tested in the diff, and a bot visual-review already approved the snapshot update.

• Author wrote 19% of the modified lines and has 171 merged PRs in these paths (familiarity MODERATE).
• 👍 on the PR from greptile-apps[bot].

Gate mechanics and policy version

Gate		Result
prerequisites	✓	all clear
deny-list	✓	no deny categories matched
size	✓	195L, 6F substantive, 368L/7F incl. docs/generated/snapshots — within ceiling
tier	✓	T1-agent / T1d-complex (368L, 7F, two-areas, feat)
stamphog 2.0.0b3		.stamphog/policy.yml @ be4d1dc · reviewed head 15fea89