'use client'
import { useEffect, useRef, useState } from 'react'
import { parsePatchFiles } from '@pierre/diffs'
interface Props {
patch: string
}
export function CommitDiffView({ patch }: Props) {
const [diffStyle, setDiffStyle] = useState<'split' | 'unified'>('split')
if (!patch) {
return <p className="text-gray-500">No changes in this commit.</p>
}
const parsed = parsePatchFiles(patch)
const files = parsed.flatMap((p) => p.files)
return (
<div className="space-y-4">
<div className="flex items-center gap-2">
<span className="text-xs text-gray-500">
{files.length} file{files.length !== 1 ? 's' : ''} changed
</span>
<button
onClick={() =>
setDiffStyle((s) => (s === 'split' ? 'unified' : 'split'))
}
className="rounded border border-gray-700 px-2 py-0.5 text-xs text-gray-400 hover:border-gray-500 hover:text-gray-200"
>
{diffStyle === 'split' ? 'Unified' : 'Split'}
</button>
</div>
{files.map((fileDiff, i) => (
<DiffFileRenderer key={i} fileDiff={fileDiff} diffStyle={diffStyle} />
))}
</div>
)
}