🪡 style: Separate Attachments from Message Bubbles

[lia-by-librechat]

Summary

User images and files currently sit inside the same filled bubble as the message text, leaving large filled areas around narrow images. Render attachments above the text bubble, right-aligned, with a 1px border using the existing message-bubble theme color. Attachment-only turns no longer leave an empty bubble.

How it works

MessageRow owns the attachment strip instead of each text container. Plain, structured, queued, search and shared messages use the same placement. Editors retain their removable attachment chips. Protected messages keep their previews while PrivateText owns the body and recovery UI. Both string and object-valued structured text are supported. No theme tokens, message data or API contracts change.

Type of change

• Feature
• Tests / tooling / CI

Testing

• At 2f91d172780e894a3235e4dd0530ccd0e2d922b0: 125 focused Jest tests across 8 suites passed, including Search initialization, row widths, protected messages, attachment placement, pending steers, subagent activity and the search comparator. Client npx tsc --noEmit and scoped static checks passed.
• At 777395ef971e032c43bd43d0824f8cff98ee2357: 4 Playwright scenarios passed across stock/ClickHouse light/dark, covering border color parity, protected owner-text success/unavailable states, previews and 320px layout. Production client build and CI Lighthouse passed.
• CI Lighthouse passed at 2f91d172780e894a3235e4dd0530ccd0e2d922b0. The width-only extraction changes no classes or layout; browser and local Lighthouse checks were not rerun for it. Remaining CI and independent review are reported in the head comments.
• No full local suites were run.

Screenshots / recordings

Four after screenshots were captured from the running app. Upload is blocked: the installed CLI lacks attachments, and the workspace-local attachment-capable CLI returned unsupported authentication type. No screenshot upload is claimed. A genuine before capture was unavailable because the isolated base worktree could not reuse this lane's dependencies and disk fell below the installation threshold. The approved mockup is not presented as an app screenshot.

Checklist

• I reviewed my own changes
• Relevant tests have been added or updated
• Existing relevant tests pass
• Required documentation PR: N/A

[lia-by-librechat]

Head: ac45132743b061c5a3269db42e7fa501ecb14d2e. Separates user attachments from the filled text bubble with theme-matched 1px borders. Includes component and light/dark browser regressions. Scoped static checks pass. Local Jest and client tsc are blocked by missing workspace build outputs; disk is below the build safety threshold.

[lia-by-librechat]

Head: d5141a9bbbd71f50676a6709109e2168a3902fc7. Includes the primary structured-message row in the shared attachment layout, with a browser regression covering plain, structured and attachment-only turns. Private text and editors keep their existing attachment handling. Scoped static checks are rerunning; local Jest, client tsc, Lighthouse and app screenshots remain blocked by missing workspace build outputs and the disk safety threshold.

[lia-by-librechat]

Head: 95953e8ad3c3272c1c3b6f58442e15bb1fb135ea. Fixed the P2 structured-text predicate finding by handling string text and text.value, with both empty and nonempty regressions. Focused local Jest: 128 tests across 9 suites passed. Client tsc --noEmit passed using CI-built shared packages from the unchanged workspace sources. Browser verification is now being prepared after disk space recovered. Independent review is running on this exact head.

[lia-by-librechat]

Verification for 95953e8ad3c3272c1c3b6f58442e15bb1fb135ea: 128 focused Jest tests, client tsc --noEmit, 4 stock/ClickHouse light/dark browser scenarios, scoped static checks and local builds pass. CI Lighthouse passes. Earlier structured-text findings (P2/P1) are fixed in this head. Screenshot capture succeeded, but upload is blocked by unsupported authentication type; the PR body records that limitation.

[lia-by-librechat]

Independent review completed for 95953e8ad3c3272c1c3b6f58442e15bb1fb135ea: no findings. The earlier structured-text finding (P1, initially reported as P2) is fixed in this head. The omitted structured-row handoff is fixed in d5141a9bbbd71f50676a6709109e2168a3902fc7. No rejected or open findings.

[danny-avila]

@codex review the latest head, final review

[chatgpt-codex-connector]

Codex Review Summary

This comment shows the latest Codex review activity on this pull request.

Review	Status	Commit	Review trigger
📝 Code Review	✅ Completed 2026-10-17T04:45:51.890489Z	777395e	Manual request

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

• Open a pull request for review
• Mark a draft as ready
• Comment "@codex review" or "@codex security review".

Codex reacts with 👀 while any review is running, comments if it has suggestions, and reacts with 👍 once all reviews finish with no findings.

[chatgpt-codex-connector]

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: 95953e8ad3

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

• Open a pull request for review
• Mark a draft as ready
• Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".

[lia-by-librechat]

Head: 777395ef971e032c43bd43d0824f8cff98ee2357. Fixes the P2 protected-message attachment regression in both renderers, without changing the private-text data path. Local verification: 97 focused tests, client tsc --noEmit, production client build, and four stock/ClickHouse light/dark browser scenarios pass. Final scoped static checks and independent review are running on this exact head.

[danny-avila]

@codex review the latest head, final review

[chatgpt-codex-connector]

Codex Review: Didn't find any major issues. Delightful!

Reviewed commit: 777395ef97

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

• Open a pull request for review
• Mark a draft as ready
• Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".

[lia-by-librechat]

Independent review completed for 777395ef971e032c43bd43d0824f8cff98ee2357: no findings. Confirmed all prior findings fixed, including the P2 protected-message attachment regression. PrivateText still handles the protected body. Local evidence: 97 focused tests, client typecheck, scoped static checks, production build and four light/dark browser scenarios passed. Review itself was source-only; it did not rerun those checks.

[lia-by-librechat]

Head: 2f91d172780e894a3235e4dd0530ccd0e2d922b0. Addresses the client CI initialization failure by keeping the pure row-width helper separate from message attachments and preview state. All width consumers now use that dependency-free module; width behavior is unchanged. Added coverage for standard, parallel and full-width cases. Focused checks and independent review are running on this exact head. The Codex protected-attachment fix remains included.

[lia-by-librechat]

Independent review completed for 2f91d172780e894a3235e4dd0530ccd0e2d922b0: no findings. All four ledger items are fixed, including Codex’s P2 protected-attachment regression and the Search import-boundary issue. Local verification at this head: 125 focused Jest tests, client tsc --noEmit, and scoped static checks passed. Review was source-only. CI Lighthouse passed on this head; the browser scenarios passed on 777395ef971e032c43bd43d0824f8cff98ee2357 before the width-only extraction.