Thanks to visit codestin.com
Credit goes to github.com

Skip to content

Fix messages overflow/wrapping #2978

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom
Merged
steven-tey merged 3 commits into from
Oct 17, 2025
Merged

Fix messages overflow/wrapping #2978

steven-tey merged 3 commits into from
Oct 17, 2025

Conversation

@TWilson023
Copy link
Collaborator

@TWilson023 TWilson023 commented Oct 17, 2025 •
edited
Loading

Before After
Screenshot 2025-10-17 at 12 03 41 PM Screenshot 2025-10-17 at 12 03 32 PM
Screenshot 2025-10-17 at 12 27 05 PM Screenshot 2025-10-17 at 12 27 11 PM

Summary by CodeRabbit

  • Bug Fixes
    • Fixed message text wrapping to prevent content overflow in the messages panel.
    • Improved message container layout so messages can shrink correctly and use available width on narrow screens.
    • Ensured message bubbles wrap long words and maintain consistent appearance for both sender and receiver sides.

@vercel
Copy link
Contributor

vercel bot commented Oct 17, 2025 •
edited
Loading

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Preview Updated (UTC)
dub Ready Ready Preview Oct 17, 2025 4:25pm

💡 Enable Vercel Agent with $100 free credit for automated AI reviews

@coderabbitai
Copy link
Contributor

coderabbitai bot commented Oct 17, 2025 •
edited
Loading

Walkthrough

Replaced the previous bubble width constraint with max-w-[min(100%,512px)], added break-words and maintained whitespace-pre-wrap on message content, and added min-w-0 to outer flex containers so message items can shrink and long words wrap correctly.

Changes

Cohort / File(s) Change Summary
Messages panel UI
apps/web/ui/messages/messages-panel.tsx		 Added min-w-0 to outer flex containers; replaced max-w-lg with max-w-[min(100%,512px)] on message bubbles; added w-full and break-words alongside whitespace-pre-wrap to message text wrappers to enable proper width limiting and word-wrapping.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

Suggested reviewers

  • steven-tey

Poem

A rabbit hops through styled lines,
min-w-0 lets layout signs,
max bounds tuned to fit the view,
break-words coax long words anew,
Messages snug — a tidy few. 🐇✨

Pre-merge checks and finishing touches

❌ Failed checks (1 warning)
Check name Status Explanation Resolution
Docstring Coverage ⚠️ Warning Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%. You can run @coderabbitai generate docstrings to improve docstring coverage.
✅ Passed checks (2 passed)
Check name Status Explanation
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title Check ✅ Passed The pull request title "Fix messages overflow/wrapping" is directly related to the main changes in the changeset. The modifications focus on addressing message display issues by adjusting flex container constraints with min-w-0, replacing the width constraint to max-w-[min(100%,512px)], and adding break-words styling to enable proper text wrapping within message bubbles. The title is concise, clear, and specific, immediately conveying to a reviewer that the changes are addressing overflow and text-wrapping problems in the messages component. The title avoids vague terminology and accurately summarizes the primary purpose of the changeset.
✨ Finishing touches
  • 📝 Generate docstrings
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Post copyable unit tests in a comment
  • Commit unit tests in branch messages-wrap

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands and usage tips.

@TWilson023 TWilson023 changed the title Fix messages overflow/wrapping [DRAFT] Fix messages overflow/wrapping Oct 17, 2025
@TWilson023 TWilson023 changed the title [DRAFT] Fix messages overflow/wrapping Fix messages overflow/wrapping Oct 17, 2025
@steven-tey steven-tey merged commit a744068 into main Oct 17, 2025
7 of 8 checks passed
@steven-tey steven-tey deleted the messages-wrap branch October 17, 2025 16:30
@coderabbitai coderabbitai bot mentioned this pull request Nov 7, 2025
Merged
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@steven-tey steven-tey steven-tey approved these changes

Assignees

No one assigned

Labels

None yet

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

3 participants

@TWilson023 @steven-tey