Diff Review

motion.dev

Accept or reject an agent's edits hunk by hunk, with undo.

0 of 3 reviewed

lib/refunds.ts

Require approval past 30 days

  export function route(days: number) {
− Removed:   if (days > 60) return approve()
+ Added:   if (days > 30) return requestApproval()
    return approve()

content/refund-policy.md

Update the policy window

− Removed: Refunds within 60 days are automatic.
+ Added: Refunds within 30 days are automatic.

tests/refunds.test.ts

Cover the new boundary

+ Added: it("asks for approval on day 31", () => {
+ Added:   expect(route(31)).toBe("approval")
+ Added: })

Install

$ npx shadcn@latest add https://spotcheckui.com/r/diff-review.json

Also installs motion.

Usage

import { DiffReview } from "@/components/spotcheck/diff-review"

<DiffReview
  hunks={[
    {
      id: "h1",
      file: "lib/refunds.ts",
      summary: "Require approval past 30 days",
      lines: [
        { kind: "remove", text: "if (days > 60) return approve()" },
        { kind: "add", text: "if (days > 30) return requestApproval()" },
      ],
    },
  ]}
  onDecide={(id, decision) => record(id, decision)}
/>

onDecide runs on each decision, and with null when one is undone.

Props

hunks * RequiredDiffHunk[]Default —
onDecide(id: string, decision: HunkDecision | null) => voidDefault —Runs on every decision, with null when one is undone.
classNamestringDefault —

Keyboard

Tab	Move between hunks and buttons
Enter	Accept, reject or undo

Reduced motion

Decided hunks close at once.