About this block

Thread Collapsed is the conversation view for the Q2 roadmap review thread, showing four messages where Avery Stone, Marcus Kim, and Jordan Lee are compressed to single-line rows: avatar, name, truncated snippet, and timestamp side by side. The latest message from Priya Nair is fully expanded with her address, four body paragraphs describing the updated deck, a slide 12 headcount fix, and a retained June footnote, plus an Acme_Q2_Roadmap_v4.pdf attachment chip at 2.1 MB. A Reply to all prompt anchors the bottom of the card.

Messages are a discriminated union of CollapsedMessage and ExpandedMessage types, so the renderer can access body and attachmentName on the expanded branch without an optional-field guard on every property. The chevron icon on collapsed rows signals expandability without needing a label.

When to use

Reach for this block as the thread detail view in a mail layout, wired to the messages array from your thread endpoint. Set expanded true on the message your router considers the active one, typically the most recent unread.

A natural flow around it on an Application Pro page:

Before

• Email list

After

• Compose blueprint
• Email reader

What you can display

One strong use is a multi-reply project discussion thread. Other thread configurations:

• All expanded. Set expanded true on every message to show the full conversation for short threads.
• Large thread. Collapse all but the first and last messages and add a show-more affordance in the middle.
• Branched reply. Indent a reply row with ml-8 to indicate it responded to a specific message.

Tip: collapsing all but the latest message is the right default for long threads because the reader almost always wants the most recent reply first.