shadcn.io is not affiliated with official shadcn/ui
Activity Stream Comments Block for Svelte
Comment, reply, reaction, edit, resolve and mention events grouped by thread in folding groups, with a toggle for each teammate and a Load earlier button.
Installation
Overview
See what happened in each thread without opening them, with this activity stream for Svelte with Ark UI. A compact header names the project. The frame opens with a people band: one Toggle per teammate showing their initials, name and how many events they have, pressed while their events are shown. Under it a held scroll region lists the threads, each a Collapsible with the thread's title and an event count, the first one open. Events say who did what (commented, replied, reacted, edited, resolved, mentioned), carry a small glyph for the kind and show their age. Turning a person off hides their events, hides threads that have none left and recounts the line under the stream, "9 events from 4 people". Load earlier appends six typed events in place. It is built from Toggle, Collapsible, Button, Avatar, Badge and Guides, with a CSS entrance only. For project hubs, team spaces and any place where comments are scattered across many threads.
FAQ
How do I fill it with my own events?
Edit PEOPLE, THREADS and the two event lists, FIRST and EARLIER. An event has an id, the person, a kind (commented, replied, reacted, edited, resolved or mentioned), an ISO at, a few words of text and its thread. Groups, counts and the sentence under the stream are worked out from those lists, ordered with the most recently active thread first.
What does a person's toggle do?
It is pressed while that person's events are shown. Turn it off and their events leave every group; a thread with no events left disappears, and if everyone is off the region says so in the same space. The count on each toggle is how many events that person has among the loaded ones, so it grows when you load earlier events.
Is it live?
No. The events are typed sample data and the block says so. Nothing refreshes, polls or connects. To make it real, load a page of events from your server, group them by thread, and have Load earlier fetch the next page by cursor; keep the person filter on the client for small sets or send it with the request for large ones.
What stays local?
Which people are shown, which groups are open, and whether the earlier events were loaded. Nothing is saved. A real activity stream usually saves the open groups per person only if it helps, and always loads the events from the server.
Is it accessible?
The people are a labelled list of toggles that report their pressed state, and each group's trigger announces whether it is open. The scroll region is reachable with Tab. Every event says its kind in words as well as with a glyph, and a polite status line reports each change, including the new totals.