Team Update Feed

Installation

A real shadcn registry command, not a copy-paste stand-in: it fetches this block plus its avatar, avatar-initials, badge dependencies and any missing npm packages, and installs them straight into your project.

Prefer not to use the CLI? Copy the source from the Code toggle above into src/components/blocks/changelog/changelog17.tsx instead.

Usage

The file also exports changelog17Demo, the exact props behind the preview above. Spread it to get a working section in one line, then replace it with your own data.

import { Changelog17, changelog17Demo } from "@/components/blocks/changelog/changelog17";

export default function Page() {
  return <Changelog17 {...changelog17Demo} />;
}

Props

Types

type Changelog17ChangeType = "added" | "changed" | "fixed" | "removed";

type Changelog17Change = {
  type: Changelog17ChangeType;
  text: string;
};

type Changelog17Entry = {
  id: string;
  version?: string;
  date: string;
  author: {
    name: string;
    role: string;
    avatar?: { src: string; alt: string };
  };
  heading: string;
  description: string;
  changes: Changelog17Change[];
  tags?: string[];
};

Behavior notes

• Purely presentational: no interactive state, no backend calls. All content (author, entries, tags) is static demo data passed via props.
• Each author's avatar falls back to initials built from their name via initialsFromName when no avatar image is supplied, matching the About team-grid pattern.
• Change type is mapped to a fixed badge style: added uses the default badge, changed uses secondary, fixed uses outline, and removed uses destructive, consistently across every entry.
• version and tags are both optional per entry; an entry with neither still renders cleanly with just its author, heading, description, and change list.