Commit List

A history, grouped by day. The grouping is the point — a flat list of forty commits is unreadable, and "when" is the axis people actually scan along.

src/components/ui/commit-list.tsx

About

From the component's own source, where it was written.

A list of commits, grouped by day.

The grouping is the point: a flat list of forty commits is unreadable, and "when" is the axis people actually scan a history along.

npx astralyx-ui add commit-list

import { CommitList } from '@/components/ui/commit-list'

<CommitList commits={commits} onSelect={openCommit} />

Change the props and the source below follows.

Ada Lovelace committed at 14:12

Verified

Katherine Johnson committed at 11:12

Alan Turing committed at 17:12

Grace Hopper committed at 09:12

Verified

Margaret Hamilton committed at 16:12

Props

locale

tsx

<CommitList commits={commits} locale="en-GB" />

tsx

<CommitList commits={commits} />

Generated from the source, so it cannot fall behind the code. One table per exported component, then hooks, functions and types.

A list of commits, grouped by day.

Extends Omit<ComponentProps<'div'>, 'onSelect'>.

Prop	Type	Default	Description
commits	Commit[]	required	{ sha, message, author, date, status?, verified?, additions?, deletions?, body? }
locale	string	'en-GB'	Drives the date headings and times through Intl.
onSelect	(sha: string) => void	—	Fires from both the message and the short-sha button.
verifiedLabel	ReactNode	'Verified'	Badge on a signed commit.

Field	Type	Description
sha	string	—
message	string	—
author	string	—
date	Date	Any date-ish value; grouped by local day.
status?	'passed' \| 'failed' \| 'running'	—
verified?	boolean	—
additions?	number	—
deletions?	number	—
body?	ReactNode	—

Topic	Detail	Description
grouping	by local day	Order within a day is preserved exactly as given — the component groups, it never re-sorts.