Skip to content

feat(tui): allow session names to wrap to two lines in dialog (#6165) - #6166

Closed
CasualDeveloper wants to merge 1 commit into
anomalyco:devfrom
CasualDeveloper:feat/session-dialog-wrap
Closed

CasualDeveloper wants to merge 1 commit into
anomalyco:devfrom
CasualDeveloper:feat/session-dialog-wrap

Conversation

@CasualDeveloper

@CasualDeveloper CasualDeveloper commented Dec 25, 2025 •

Copy link
Copy Markdown
Contributor

Issue for this PR

Closes #22480
Relates to #6165

Type of change

  • Bug fix
  • New feature
  • Refactor / code improvement
  • Documentation

What does this PR do?

Allows long titles in the TUI Sessions dialog to wrap to a second line, while keeping other DialogSelect users single-line by default.

The implementation adds an opt-in maxLines prop, uses display-width-aware wrapping/truncation for Unicode/CJK text, reserves footer width for workspace status metadata, and keeps the current lazy gutter rendering behavior.

How did you verify your code works?

  • bun test --timeout 20000 test/cli/tui/dialog-select.test.ts
  • bun turbo typecheck

Focused tests cover two-line wrapping, truncation, reserved footer width, whitespace preservation, and CJK/wide-token display width.

Screenshots / recordings

Before:
before

After:
after

Checklist

  • I have tested my changes locally
  • I have not included unrelated changes in this PR

@CasualDeveloper
CasualDeveloper force-pushed the feat/session-dialog-wrap branch 3 times, most recently from 5df4953 to d99001d Compare December 26, 2025 13:31
@CasualDeveloper CasualDeveloper changed the title feat(tui): allow session names to wrap to two lines in dialog [#6165] feat(tui): allow session names to wrap to two lines in dialog Dec 26, 2025
@CasualDeveloper CasualDeveloper changed the title [#6165] feat(tui): allow session names to wrap to two lines in dialog [6165] feat(tui): allow session names to wrap to two lines in dialog Dec 26, 2025
@CasualDeveloper CasualDeveloper changed the title [6165] feat(tui): allow session names to wrap to two lines in dialog feat(tui): allow session names to wrap to two lines in dialog (#6165) Dec 26, 2025
@CasualDeveloper
CasualDeveloper force-pushed the feat/session-dialog-wrap branch from d99001d to f604825 Compare December 28, 2025 00:38
@CasualDeveloper
CasualDeveloper deleted the feat/session-dialog-wrap branch December 29, 2025 19:30
@CasualDeveloper
CasualDeveloper restored the feat/session-dialog-wrap branch December 29, 2025 19:31
@CasualDeveloper
CasualDeveloper force-pushed the feat/session-dialog-wrap branch 4 times, most recently from fc54502 to 7b2b7de Compare December 30, 2025 19:06
@CasualDeveloper

Copy link
Copy Markdown
Contributor Author

Will continue rebasing on top of release tags as they're set.

@CasualDeveloper
CasualDeveloper force-pushed the feat/session-dialog-wrap branch from 7b2b7de to 49c726a Compare December 31, 2025 04:39
Copilot AI review requested due to automatic review settings January 1, 2026 16:33
@CasualDeveloper
CasualDeveloper force-pushed the feat/session-dialog-wrap branch from 49c726a to 3dbf5e3 Compare January 1, 2026 16:33

Copilot AI left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This PR enhances the TUI dialog to allow long session names to wrap to two lines instead of being truncated, improving readability for users with lengthy session names.

Key changes:

  • Enabled text wrapping in dialog select options with flexWrap="wrap" and wrapMode="word"
  • Removed redundant paddingLeft={3} that was causing incorrect wrap calculations
  • Removed unused take import from remeda

Reviewed changes

Copilot reviewed 1 out of 3 changed files in this pull request and generated 1 comment.

File Description
packages/sdk/js/package.json Added missing newline at end of file (formatting fix)
packages/plugin/package.json Added missing newline at end of file (formatting fix)
packages/opencode/src/cli/cmd/tui/ui/dialog-select.tsx Implemented text wrapping for dialog options by adding flex wrap support, configuring word-wrap mode with 2-line max height, and removing conflicting padding

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

>
{Locale.truncate(props.title, 61)}
{Locale.truncate(props.title, 122)}

Copilot AI Jan 1, 2026

Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Using Locale.truncate with wrapMode="word" and maxHeight={2} is redundant. When wrapping is enabled, the text element will naturally wrap and constrain to maxHeight, making manual truncation unnecessary.

Additionally, the limit of 122 characters (exactly double the original 61) appears arbitrary and doesn't account for the actual available width, which varies based on terminal size, padding, and other UI elements.

Consider removing Locale.truncate entirely and letting the wrapping behavior handle long text naturally. Other parts of the codebase (e.g., dialog-status.tsx, todo-item.tsx, toast.tsx) use wrapMode="word" without manual truncation.

Suggested change
{Locale.truncate(props.title, 122)}
{props.title}

Copilot uses AI. Check for mistakes.

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I checked with Claude and while it's a reasonable idea, it's not accurate for our desired UX.

Claude says it’s not redundant here:

  • wrapMode="word" + maxHeight={2} limits layout height, but it does not guarantee a nice truncation indicator.
  • Without Locale.truncate, overlong titles will typically just get hard-clipped at line 2 (depending on opentui’s overflow behavior), meaning users lose the “…” hint that there’s more text.
  • Your examples (toast.tsx, dialog-status.tsx, todo-item.tsx) often use wrapping because they’re OK with showing as much as needed (or they don’t enforce “2 lines max with ellipsis”), so it's a different requirement.

What is true in your comment though:

  • 122 is heuristic/arbitrary and not width-aware.
    But given opentui doesn’t give us an easy “truncate to N lines with ellipsis based on actual rendered width” primitive, the heuristic truncation is doing a job: “2 lines max, and show an ellipsis”. Claude suggests that if we wanted to improve this “properly”, we’d need a width-aware truncation (measure available width at runtime and truncate accordingly) or a library feature that truncates to N wrapped lines with ellipsis. That’s likely an opentui-level enhancement.

@CasualDeveloper
CasualDeveloper force-pushed the feat/session-dialog-wrap branch 8 times, most recently from a833c2c to 968d709 Compare January 10, 2026 19:31
@CasualDeveloper
CasualDeveloper force-pushed the feat/session-dialog-wrap branch from 968d709 to 452fc3e Compare January 11, 2026 14:11
@CasualDeveloper
CasualDeveloper force-pushed the feat/session-dialog-wrap branch 11 times, most recently from 5243f6a to 6c10ee6 Compare January 30, 2026 03:44
@thdxr
thdxr force-pushed the dev branch 3 times, most recently from f1ae801 to 08fa7f7 Compare January 30, 2026 14:37
@CasualDeveloper
CasualDeveloper force-pushed the feat/session-dialog-wrap branch 4 times, most recently from 0037f64 to dec6323 Compare February 7, 2026 02:59
@CasualDeveloper
CasualDeveloper force-pushed the feat/session-dialog-wrap branch 3 times, most recently from 8ece7ac to fa6786c Compare February 18, 2026 12:11
@CasualDeveloper
CasualDeveloper force-pushed the feat/session-dialog-wrap branch 2 times, most recently from a1ac33a to 2c6e50c Compare February 25, 2026 21:47
@CasualDeveloper

Copy link
Copy Markdown
Contributor Author

Fork updated to sync with dev (as of 5b60e51).

Allow the Sessions dialog to use its reserved second line for long titles while keeping other dialogs single-line by default. Account for footer and gutter width, preserve repeated spaces, normalize hard whitespace, and use display-width-aware wrapping with focused tests for truncation and Unicode cases.
@rekram1-node

Copy link
Copy Markdown
Collaborator

Automated PR Cleanup

Thank you for contributing to opencode.

Due to the high volume of PRs from users and AI agents, we periodically close older PRs using automated criteria so maintainers can focus review time on the most active and community-supported contributions.

This PR was closed because it matched the following cleanup criteria:

  • The PR was created more than 1 month ago
  • The PR had fewer than 2 positive reactions
  • Positive reactions are counted as thumbs-up or heart reactions on the PR

PRs created within the last month are not affected by this cleanup.

If you believe this PR was closed incorrectly, or if you are still actively working on it, please leave a comment explaining why it should be reopened. A maintainer can review and reopen it if appropriate.

Thanks again for taking the time to contribute.

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.

[QUESTION] Allow two-line session titles in TUI Sessions dialog (#6166)

3 participants