Activity Feed

React activity feed that lists who did what and when, with initials avatars, muted action text and tabular timestamps in a single bordered card.

src/registry/ui/activity-feed.tsx/r/activity-feed.json

Installation#

bash
npx shadcn@latest add @minidev/activity-feed

MiniDev UI is in the shadcn registry directory, so the short form works with no setup. Older CLI versions can use the full URL: npx shadcn@latest add https://ui.minidev.pro/r/activity-feed.json

Usage#

tsx
import { ActivityFeed } from "@/components/ui/activity-feed"

export function Example() {
  return (
    <ActivityFeed className="w-full max-w-md" items={[
      { id: "1", user: "Aman", action: "opened a PR", time: "1m" },
      { id: "2", user: "Jordan", action: "commented on design", time: "12m" },
    ]} />
  )
}

API reference#

ActivityFeed props
PropTypeDefault
itemsActivityItem[]SAMPLE_ITEMS
classNamestring-

Dependencies#

npm

React only

Built from

Examples#

All dashboard components

Learn more