fix(sessions): stop footer status line overlapping diff stats when narrow

[pauldambra]

Problem

When the main chat window is narrow (e.g. with panes open), the status line above the prompt input overlaps itself: "(Esc to stop" wraps onto three lines and the elapsed time paints over the diff stats ("22 files").

The left half of the footer row is allowed to shrink (min-w-0), but nothing inside GeneratingIndicator was constrained to a single line — so wrappable text wrapped, and the non-wrappable elapsed time overflowed into the shrink-0 right-side stats.

Fix

Make the indicator a single non-wrapping line that shrinks gracefully:

• Root flex gets min-w-0 and the brain icon shrink-0, so the component shrinks inside the row instead of overflowing into the diff stats.
• "(Esc to stop", the dot separator, and the elapsed time are now one Text run (dot rendered inline), so they truncate as a unit with an ellipsis instead of wrapping.
• The hint gets shrink-[8] truncate and the activity word truncate, so the Esc/timer hint collapses first and the activity word only ellipsizes as a last resort. The context ring and diff stats keep their space.

After (light mode, from the new Storybook stories)

Wide (720px) — everything on one line:

Narrow (340px) — the "(Esc to stop · …s)" hint ellipsizes first; the context ring stays intact, nothing overlaps or wraps:

(Screenshots live on the posthog-code/fix-session-footer-overlap-assets branch so no binaries land in this PR's diff.)

Testing

• Added SessionFooter.stories.tsx rendering the footer at fixed widths from 720px down to 220px (generating, generating + queue, awaiting permission, idle). Verified in Storybook (dark and light) via headless browser screenshots:
  • At 720–400px everything fits on one line.
  • At 340px the "(Esc to stop · …s)" hint ellipsizes; at 280px it's nearly collapsed; only at 220px does the activity word itself truncate.
  • The right-side context ring stays fully legible at every width — no overlap, no wrapping.
  • Note: DiffStatsChip doesn't render in Storybook (its diff-stats query never resolves there), but it shares the shrink-0 right-side group with the context ring, so the overlap scenario is exercised.
• pnpm exec biome check on the changed files — clean.
• pnpm --filter @posthog/ui typecheck — passes.

🤖 Generated with Claude Code

[trunk-io]

Merging to main in this repository is managed by Trunk.

• To merge this pull request, check the box to the left or comment /trunk merge below.

After your PR is submitted to the merge queue, this comment will be automatically updated with its status. If the PR fails, failure details will also be posted here

[github-actions]

React Doctor found no issues in the changed files. 🎉

_{Reviewed by React Doctor for commit a17ac71.}

[github-actions]

Pure CSS layout fix — adds min-w-0/truncate/shrink-0 to prevent text overflow in narrow panels, with an accompanying Storybook story to visualise the fix. No logic, data model, or API surface touched.