https://github.com/doanbactam/trace
Git history visualizer for the AI coding era.
https://github.com/doanbactam/trace
ai-coding git history visualizer
Last synced: about 1 month ago
JSON representation
Git history visualizer for the AI coding era.
- Host: GitHub
- URL: https://github.com/doanbactam/trace
- Owner: doanbactam
- Created: 2026-03-22T13:05:40.000Z (3 months ago)
- Default Branch: main
- Last Pushed: 2026-03-22T15:31:58.000Z (3 months ago)
- Last Synced: 2026-03-23T06:25:53.510Z (3 months ago)
- Topics: ai-coding, git, history, visualizer
- Language: TypeScript
- Homepage: https://trace-coding.vercel.app/
- Size: 87.9 KB
- Stars: 0
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# git-trace
[](https://www.npmjs.com/package/git-trace)
[](https://opensource.org/licenses/MIT)
Git history visualizer for the AI coding era.
## Quick Start
```tsx
import { Trace } from 'git-trace'
```
## Props
| Prop | Type | Default | Description |
|------|------|---------|-------------|
| `commits` | `Commit[]` | `[]` | Array of commits |
| `autoPlay` | `boolean` | `false` | Auto-play through commits |
| `interval` | `number` | `2000` | Ms between commits |
| `onCommit` | `(commit) => void` | — | Callback on commit change |
| `className` | `string` | — | CSS class for root element |
| `theme` | `Theme` | `'dark'` | Color theme |
| `filterable` | `boolean` | `false` | Enable filter/search UI |
| `defaultFilter` | `FilterOptions` | `{}` | Initial filter state |
| `onFilterChange` | `(filter) => void` | — | Callback when filter changes |
## Commit Type
```ts
type Commit = {
hash: string
message: string
author: string
authorType: 'human' | 'ai'
time: string
lines: DiffLine[]
}
type DiffLine = {
type: 'add' | 'remove' | 'ctx'
content: string
}
```
## Filtering
Enable the filter UI with `filterable={true}`:
```tsx
import { Trace } from 'git-trace'
console.log(filter)}
/>
```
**FilterOptions:**
```ts
type FilterOptions = {
search?: string // Search in message, author, hash
authorType?: 'all' | 'human' | 'ai'
dateFrom?: string // ISO date string (future)
dateTo?: string // ISO date string (future)
}
```
**Programmatic filtering:**
```tsx
const [filter, setFilter] = useState({ authorType: 'ai' })
```
## CLI
```bash
# Local git history to JSON
npx git-trace src/App.tsx --last 8 --json > commits.json
# Standalone HTML
npx git-trace src/App.tsx --last 8 --output embed.html
# Fetch from GitHub (cached 24h)
npx git-trace owner/repo src/path.ts --token $GITHUB_TOKEN
# Cache management
npx git-trace cache # Show cache info
npx git-trace cache clear # Clear cache
```
## Configuration
Create `.tracerc` in project root or `~/.tracerc`:
```json
{
"aiPatterns": {
"emails": ["noreply@cursor.sh", "claude@anthropic.com"],
"messages": ["Co-Authored-By: Claude", "AI-generated"],
"logins": ["bot", "dependabot"]
},
"defaults": {
"last": 10,
"autoPlay": false,
"interval": 2000
},
"cache": {
"enabled": true,
"ttl": 86400000
}
}
```
## Syntax Highlighting (Optional)
```tsx
// Core: ~3.6KB gzipped
import { Trace } from 'git-trace'
// With syntax highlighting: +6KB
import { Trace } from 'git-trace'
import 'git-trace/highlight'
```
## License
MIT