Spaces:
Running
Running
File size: 1,643 Bytes
22b729d | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 | "use client";
// Dependency-free unified-diff viewer (Batch 11).
//
// The web app keeps a minimal dependency footprint (next/react only), so rather
// than pull in Monaco/an editor we render the proxied diff text with line-level
// colouring. Read-only, scrollable, monospaced — enough to review a GitPilot
// change in the browser before Matrix approves it.
import { parseDiffLines, type DiffLineKind } from "@/lib/gitpilot-client";
const COLORS: Record<DiffLineKind, { color: string; bg: string }> = {
add: { color: "#22c878", bg: "rgba(34,200,120,.10)" },
del: { color: "#ff6b6b", bg: "rgba(255,107,107,.10)" },
hunk: { color: "#53b9ff", bg: "rgba(83,185,255,.08)" },
meta: { color: "#8aa0b4", bg: "transparent" },
context: { color: "#c9d4df", bg: "transparent" },
};
export default function DiffView({ diff }: { diff: string }) {
const lines = parseDiffLines(diff);
if (!diff.trim()) {
return <div className="diffview-empty">No diff to show.</div>;
}
return (
<pre
className="diffview"
style={{
maxHeight: 360,
overflow: "auto",
margin: 0,
padding: "10px 12px",
borderRadius: 10,
background: "#02140c",
border: "1px solid rgba(34,200,120,.18)",
fontSize: 12.5,
lineHeight: 1.55,
fontFamily: "ui-monospace, SFMono-Regular, Menlo, monospace",
}}
>
{lines.map((l, i) => {
const c = COLORS[l.kind];
return (
<div key={i} style={{ color: c.color, background: c.bg, whiteSpace: "pre-wrap" }}>
{l.text || " "}
</div>
);
})}
</pre>
);
}
|