Files
OpenHands/.pr/issue-135/visual-verification.md
T
Graham Neubigandopenhands 84ed4d1217 Show full model name in conversation header (#135) (#139)
Port of OpenHands/OpenHands#14284. The LLM model badge in the conversation
header was constrained to max-w-[150px] with an inner `truncate`, which
cut off long model identifiers such as `litellm_proxy/claude-sonnet-4-5-20250929`
to `litellm_proxy/cl…`. Drop the width cap and inner truncate, and apply
`whitespace-nowrap` to the outer span so the full name renders inline.

Also adds scripts/record-demo.mjs - a small playwright recorder used to
capture the verification GIF under .pr/issue-135/ - and updates the
existing test to assert the un-truncated structure.

Closes #135.

Co-authored-by: openhands <openhands@all-hands.dev>
2026-05-07 10:46:05 -04:00

1.5 KiB
Raw Blame History

Issue #135 — Show full model name in conversation header

Port of OpenHands/OpenHands#14284.

Recording setup

  • Branch: port/full-model-name-header
  • Backend: npm run dev (spawns isolated openhands-agent-server@main on :18000)
  • Frontend: localhost:12000 (exposed at https://work-1-yrsrggnfhzzshrxo.prod-runtime.all-hands.dev/ for the recording)
  • LLM configured via PATCH /api/settings with agent_settings_diff.llm.model = litellm_proxy/claude-sonnet-4-5-20250929 and the live LLM_API_KEY.

The recordings were produced by node scripts/record-demo.mjs full-model-name <out>.webm, then converted to GIF with the ffmpeg snippet documented in that script.

Visual diff

comparison.png stacks the same conversation header band before and after the fix:

  • Before (max-w-[150px] overflow-hidden + inner truncate): litellm_proxy/claude… cuts off after the first 150 px.
  • After (whitespace-nowrap, no inner truncate): the full litellm_proxy/claude-sonnet-4-5-20250929 renders inline.

before.png / after.png are full 1280×720 captures of the conversation page in each state. demo.gif is the recorded "after" flow (home → New Conversation → header rendered with the un-truncated badge).

Tests

  • npm test -- conversation-name → 25/25 passing (includes the new assertions that the outer span has whitespace-nowrap and no max-w-[150px] / overflow-hidden, and the inner span has no truncate).
  • npm run typecheck → clean.