[gabriellsh]

Proposed changes (including videos or screenshots)

Adds the first real code of @rocket.chat/ui-message-list: the ten message contexts (display, navigation, interactions, toolbar, renderers, related data, content, media, selection and editing), each with a working default, and the message content parts that are not attachments (markdown body, reactions with their tooltip, URL previews, location, action links, thread, discussion and broadcast metrics, collapsible, ignored content). On the app side it adds MessagesProvider, which supplies those contexts from the app, and switches the app's message variants to the package's content parts. The app's copies of those parts are deleted.

Because the old lists stay until later parts, MessagesProvider is mounted wherever MessageListProvider is, and in every place that renders message parts outside a list (audit, moderation, contact history, modals, the composer's quote), read-only ones with allowsInteraction={false}. The old list context stays in agreement with the new display context.

Twelve commits: intent, spec and plan; a fixture; a refactor that extracts how a message is normalized; the package contexts and content; the provider; the mounts; the switch; the deletion; docs.

Spacing in the package's parts uses the spacing scale tokens. The two entries of scripts/spacing-scale/baseline.json for app files this PR deletes (MessageActions.tsx, OEmbedPreviewContent.tsx) go with them. The specs develop added in #43386 for the URL previews, the reaction tooltip and the message normalization are ported into the package's specs and the provider's.

The package gains its test-storybook script, run under TZ=UTC, with its first stories.

This is part 03 of the stack (00 to 09). Review it against its base branch message-list/02-list-fixes, not against develop.

Stack

• 00 chore(ui-message-list): add the spec-first ui-message-list package: chore(ui-message-list): add the spec-first ui-message-list package #43721
• 01 refactor: move message helpers to where the new list needs them: refactor: move message helpers to where the new list needs them #43722
• 02 fix: correct six defects of the room and thread message lists: fix: correct six defects of the room and thread message lists #43723
• 03 feat(ui-message-list): add message contexts and content parts: feat(ui-message-list): add message contexts and content parts #43724 ← this PR
• 04 feat(ui-message-list): add message attachments: feat(ui-message-list): add message attachments #43725
• 05 feat(ui-message-list): add the message toolbar: feat(ui-message-list): add the message toolbar #43726
• 06 feat(ui-message-list): add the message variants, delete the app copies: feat(ui-message-list): add the message variants, delete the app copies #43727
• 07 feat(ui-message-list): add the message list engine: feat(ui-message-list): add the message list engine #43728
• 08 feat: render the room's messages with the ui-message-list list: feat: render the room's messages with the ui-message-list list #43729
• 09 feat: render thread messages with ui-message-list, remove old lists: feat: render thread messages with ui-message-list, remove old lists #43730

Visible changes

.changeset/read-only-messages-follow-display-settings.md, '@rocket.chat/meteor': minor: messages in audits, moderation reports, contact history, the forward, pin and report dialogs, the composer's quote and the threads list now highlight the viewer's highlight words; audits, moderation reports and contact history show real names in mentions when real names are on; audits render hex colors and KaTeX as the settings say; attachments in audits, moderation reports, contact history and the forward dialog follow the viewer's media preferences, sized at 360 pixels and linked from the server's address as in rooms.

Known differences from develop

Besides the read-only look above (kept on purpose, see the spec):

• the emoji data-title attribute is no longer passed;
• thread metrics need allowsInteraction, so a place that allows none shows no follow control;
• the cover image link of a link preview gains an accessible name (the page title, or the URL);
• a message fetched for a reaction tooltip is not added to the room's store;
• modals and the composer's quote pass no mentions, so they show usernames.

Issue(s)

Steps to test or reproduce

In a room, check that all of these look and behave as on develop:

• a message with markdown, mentions, a highlight word and KaTeX;
• reactions: add, remove, and the tooltip names (real names when they are on);
• a link preview, including the accessible name of its cover link;
• a shared location;
• a message with action links (for example a livechat transcript button);
• a thread's metrics with follow and unfollow and the unread badge;
• a discussion's metrics, and a broadcast reply.

Read-only places (new look, named in the changeset):

• audit, moderation, contact history, the forward, pin and report dialogs, the composer's quote and the threads list show highlight words, and real names in mentions where listed above;

Further comments

Decisions to check

• RoomMessageContent.tsx goes from complexity 41 to 42 (limit 31), a warning that was already there.
• Changesets for @rocket.chat/ui-message-list. This PR adds none for the private package; parts 08 and 09 of the stack do. The repo versions private packages (other private packages carry changesets), so 08 and 09 follow the repo, and 03 to 07 may need changesets too. Undecided.

Not run

• The e2e suites, and the app in a browser.
• Checks ran on the branch tip only, not commit by commit.
• The read-only differences per place are proven by specs for the audit and the pin dialog; the other places are covered by mount probes and the manual pass above.

🤖 Generated with Claude Code

[dionisio-bot]

Looks like this PR is not ready to merge, because of the following issues:

• This PR is still a draft
• This PR is missing the 'stat: QA assured' label
• This PR is missing the required milestone or project

Please fix the issues and try again

If you have any trouble, please check the PR guidelines

[coderabbitai]

Important

Draft PR not reviewed

Draft PRs are not automatically reviewed by default.

• Trigger a manual review

To automatically review draft PRs, update your CodeRabbit configuration:

reviews:
  auto_review:
    drafts: true

• Autofix · Keep fixing CodeRabbit findings and required CI, and resolving merge conflicts

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

• X
• Mastodon
• Reddit
• LinkedIn

[changeset-bot]

🦋 Changeset detected

Latest commit: 5917e63

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 3 packages

Name	Type
@rocket.chat/meteor	Minor
@rocket.chat/core-typings	Minor
@rocket.chat/rest-typings	Minor

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[codecov]

Codecov Report

❌ Patch coverage is 88.62829% with 160 lines in your changes missing coverage. Please review.
✅ Project coverage is 71.30%. Comparing base (cb3f762) to head (5917e63).

Additional details and impacted files

@@                      Coverage Diff                       @@
##           message-list/02-list-fixes   #43724      +/-   ##
==============================================================
+ Coverage                       71.23%   71.30%   +0.06%     
==============================================================
  Files                            5567     5624      +57     
  Lines                          247891   250477    +2586     
  Branches                        46427    46723     +296     
==============================================================
+ Hits                           176597   178606    +2009     
- Misses                          66907    67493     +586     
+ Partials                         4387     4378       -9     

Flag	Coverage Δ
e2e	63.01% <50.21%> (+0.10%)	⬆️
e2e-api	49.45% <ø> (-0.28%)	⬇️
unit	70.13% <88.62%> (+0.08%)	⬆️

Flags with carried forward coverage won't be shown. Click here to find out more.

🚀 New features to boost your workflow:

• ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.