Activity Feed
An activity feed is the time-ordered record of what has happened to one thing: what people said about it, what the system did to it, and what got attached along the way: held together by a rail down the side so the entries read as one thread rather than a pile of notifications. The six blocks here run from whole thread pages down to the rows they are built from.
Two kinds of row live in every feed and they should not look alike. A person's row carries an avatar, a name, a time, a body and the reactions it drew. A system's row carries a glyph where the avatar would be and a single sentence naming the object it acted on. Give them the same weight and a channel of conversation reads like an audit log. Read state is the other thing to settle: marking the whole feed read the moment it opens is convenient for the badge and useless for the person, who came back to find the line they had got to.
Thread feed
Best for
Team channels and project threads: a day of activity with one place to answer it
Anatomy
Titled header with a status badge · system event, message and thread rows · reactions that count you in · file cards · a replies bar that folds · composer that posts
Command menu keyboard navigation
Everything that happened while you were away.
In progressAva Rios created branch feat/cmdk-nav
Started on arrow-key navigation. Wrapping selection at both ends and scrolling the active row into view. Reactions and the composer are next.
Confirmed the reaction chip states against the kit: default counted, the brand “(You)” pill with the remove ✕, and the add-emoji. Uploading the redlines and a quick capture.
Looped in the folks who own the shortcut map so keybinds stay consistent across surfaces.
Pull request thread
Best for
Code review: commits, a diff and the checks that gate the merge
Anatomy
Dark repo header with a Merged badge · a rail that threads every event · commits table with SHA pills · dark snippet with a Copy that copies · checks-passed marker
Add command-menu keyboard navigation
MergedEvent rows
Best for
The rows a system writes: something happened, nobody said anything
Anatomy
Tinted glyph chip where the avatar would be · the object of the sentence set in the row's own type · a button out to the channel it happened in · the overlay the set uses for hover
Ava Rios renamed this thread from “Command menu polish” to “Command menu keyboard navigation”
Message rows
Best for
The row a person writes: what they said, and who has reacted to it
Anatomy
Avatar, name and time · body copy · reaction chips that count you in, brand when the tally is yours · Reply and Copy link under it
Confirmed the reaction chip states against the kit: default counted, the brand “(You)” pill with the remove ✕, and the add-emoji.
Quoted entry
Best for
Anything an integration posts: a message pulled in from another surface
Anatomy
Source mark and timestamp in a column of their own · a brand elbow down into the quoted card · Add to Library straddling its bottom edge, and remembering it was pressed
Tooltips for a single line, bar or area are not supported either. The build shown in the Loom is on QA1 now.
Thread entries
Best for
Threads that carry something: an upload, under the replies it drew
Anatomy
Message, then the file cards it attached · stacked repliers, the count and the unread count · a chevron that opens onto the nested reply
Redlines and a quick capture for the chip states, so the two are easy to read side by side.
Looped in the folks who own the shortcut map so keybinds stay consistent across surfaces.
Using Activity Feed
Reach for it when
- A record whose history mixes system events with what people said
- Code review, where commits, a diff and check results belong to one thread
- Team channels that need one place at the foot to answer from
- Threads where the reply count matters more than every reply
Reach for something else when
- Alerts a person triages and clears: a notifications inbox with read state fits better
- Dated milestones with no conversation around them: a timeline is lighter
- Logs people filter, sort and export: give them a table
Where it shows up
Pull request threads
Commits with their hashes, a diff people argue about, the checks that gate the merge and the merge itself, all on one rail so the order of events is never in question.
Project channels
A day of a team's work in one scroll: who joined, what was said, what was uploaded, which replies are still unread, and a composer at the foot to answer any of it.
Record history panels
The panel on a deal, a ticket or a document that answers what happened to this: status changes and renames written by the system, sitting beside the notes people left by hand.
Integration posts
Something an outside service dropped into the thread, quoted in a card of its own with its source mark and its time, so it is clear that nobody in the room typed it.
Questions
Should an activity feed be newest first or oldest first?
A conversation runs oldest first, with the newest at the bottom and the composer under it, because that is where the reader is already looking when they reply. A monitoring or audit feed runs newest first, because the latest event is the reason anyone opened it. Pick one per surface and keep it; do not flip the order behind a filter.
How should a feed handle threads with many replies?
Collapse them. Show the entry, the faces of the people who replied and a count, then open the replies in place when someone asks for them. Carrying an unread count on that control is what makes the collapse safe. Do not expand every thread by default: a long feed becomes unscrollable and the entries between threads get lost.
Premium components,
free in your inbox.
Join the Orvain Dispatch and get production-ready components, free to keep: React and Vue code plus the Figma frame, yours to ship.
Orvain MCPActivity Feed
An activity feed is the time-ordered record of what has happened to one thing: what people said about it, what the system did to it, and what got attached along the way: held together by a rail down the side so the entries read as one thread rather than a pile of notifications. The six blocks here run from whole thread pages down to the rows they are built from.
Two kinds of row live in every feed and they should not look alike. A person's row carries an avatar, a name, a time, a body and the reactions it drew. A system's row carries a glyph where the avatar would be and a single sentence naming the object it acted on. Give them the same weight and a channel of conversation reads like an audit log. Read state is the other thing to settle: marking the whole feed read the moment it opens is convenient for the badge and useless for the person, who came back to find the line they had got to.
Thread feed
Best for
Team channels and project threads: a day of activity with one place to answer it
Anatomy
Titled header with a status badge · system event, message and thread rows · reactions that count you in · file cards · a replies bar that folds · composer that posts
Command menu keyboard navigation
Everything that happened while you were away.
In progressAva Rios created branch feat/cmdk-nav
Started on arrow-key navigation. Wrapping selection at both ends and scrolling the active row into view. Reactions and the composer are next.
Confirmed the reaction chip states against the kit: default counted, the brand “(You)” pill with the remove ✕, and the add-emoji. Uploading the redlines and a quick capture.
Looped in the folks who own the shortcut map so keybinds stay consistent across surfaces.
Pull request thread
Best for
Code review: commits, a diff and the checks that gate the merge
Anatomy
Dark repo header with a Merged badge · a rail that threads every event · commits table with SHA pills · dark snippet with a Copy that copies · checks-passed marker
Add command-menu keyboard navigation
MergedEvent rows
Best for
The rows a system writes: something happened, nobody said anything
Anatomy
Tinted glyph chip where the avatar would be · the object of the sentence set in the row's own type · a button out to the channel it happened in · the overlay the set uses for hover
Ava Rios renamed this thread from “Command menu polish” to “Command menu keyboard navigation”
Message rows
Best for
The row a person writes: what they said, and who has reacted to it
Anatomy
Avatar, name and time · body copy · reaction chips that count you in, brand when the tally is yours · Reply and Copy link under it
Confirmed the reaction chip states against the kit: default counted, the brand “(You)” pill with the remove ✕, and the add-emoji.
Quoted entry
Best for
Anything an integration posts: a message pulled in from another surface
Anatomy
Source mark and timestamp in a column of their own · a brand elbow down into the quoted card · Add to Library straddling its bottom edge, and remembering it was pressed
Tooltips for a single line, bar or area are not supported either. The build shown in the Loom is on QA1 now.
Thread entries
Best for
Threads that carry something: an upload, under the replies it drew
Anatomy
Message, then the file cards it attached · stacked repliers, the count and the unread count · a chevron that opens onto the nested reply
Redlines and a quick capture for the chip states, so the two are easy to read side by side.
Looped in the folks who own the shortcut map so keybinds stay consistent across surfaces.
Using Activity Feed
Reach for it when
- A record whose history mixes system events with what people said
- Code review, where commits, a diff and check results belong to one thread
- Team channels that need one place at the foot to answer from
- Threads where the reply count matters more than every reply
Reach for something else when
- Alerts a person triages and clears: a notifications inbox with read state fits better
- Dated milestones with no conversation around them: a timeline is lighter
- Logs people filter, sort and export: give them a table
Where it shows up
Pull request threads
Commits with their hashes, a diff people argue about, the checks that gate the merge and the merge itself, all on one rail so the order of events is never in question.
Project channels
A day of a team's work in one scroll: who joined, what was said, what was uploaded, which replies are still unread, and a composer at the foot to answer any of it.
Record history panels
The panel on a deal, a ticket or a document that answers what happened to this: status changes and renames written by the system, sitting beside the notes people left by hand.
Integration posts
Something an outside service dropped into the thread, quoted in a card of its own with its source mark and its time, so it is clear that nobody in the room typed it.
Questions
Should an activity feed be newest first or oldest first?
A conversation runs oldest first, with the newest at the bottom and the composer under it, because that is where the reader is already looking when they reply. A monitoring or audit feed runs newest first, because the latest event is the reason anyone opened it. Pick one per surface and keep it; do not flip the order behind a filter.
How should a feed handle threads with many replies?
Collapse them. Show the entry, the faces of the people who replied and a count, then open the replies in place when someone asks for them. Carrying an unread count on that control is what makes the collapse safe. Do not expand every thread by default: a long feed becomes unscrollable and the entries between threads get lost.
Related blocks
All blocksPremium components, free in your inbox.
Join the Orvain Dispatch and get production-ready components, free to keep: React and Vue code plus the Figma frame, yours to ship.
