# Comment thread (goodtabs UI)

Comments with nested replies on a hairline rail.

## Install

```bash
npx shadcn@latest add https://ui.goodtabs.co/r/comment-thread.json
```

Or, with the @goodtabs namespace configured in components.json: `npx shadcn@latest add @goodtabs/comment-thread`

## Usage

```tsx
import { CommentThread } from "@/components/ui/comment-thread"

<CommentThread comments={[{ id: "1", author: "Maya Chen", time: "2h ago", body: "Looks good." }]} />
```

## Props

| Prop | Type | Default | Description |
| --- | --- | --- | --- |
| comments | `Comment[]` |  | Each comment has id, author, time, body and optional replies. |
| maxDepth | `number` | `2` | Levels that get an indent and rail. Deeper replies stay flush. |

## When to use

- Review notes on a design, pull request or document
- A discussion under a release or changelog entry

## When not to use

- A composer or reply box: pair it with composer
- Live chat, where order and scroll anchoring matter

## Notes for agents

- Display only: no reply, edit or like handlers
- Time is a string you format; the component does not parse dates
- Avatars are initials on a muted tile, so there is no colour per person
- Nested lists carry an aria-label naming the author being replied to

Docs: https://ui.goodtabs.co/components/comment-thread