diff --git a/apps/web/src/DiffComparison.tsx b/apps/web/src/DiffComparison.tsx
new file mode 100644
index 0000000..aa11ebc
--- /dev/null
+++ b/apps/web/src/DiffComparison.tsx
@@ -0,0 +1,68 @@
+import { Popover } from "@base-ui/react/popover";
+import { InfoIcon, XIcon } from "lucide-react";
+import { Button } from "@/components/ui/button";
+import { useDiffSource } from "./app-state.tsx";
+import { diffComparison } from "./diff-comparison.ts";
+import { useSession } from "./session-context.tsx";
+
+export function DiffComparison() {
+ const session = useSession();
+ const { mode, repository } = useDiffSource();
+ const comparison = diffComparison(session, mode, repository?.head);
+ return (
+
+
+ }
+ >
+ {comparison.summary}
+ Comparison
+
+
+
+
+
+
+
Diff comparison
+
+ }
+ >
+
+
+
+ {comparison.details.map(({ label, value }) => (
+
+
- {label}
+ - {value}
+
+ ))}
+
+ )}
+
+
+
+
+ );
+}
diff --git a/apps/web/src/DiffWorkspace.tsx b/apps/web/src/DiffWorkspace.tsx
index f26057c..aaea1af 100644
--- a/apps/web/src/DiffWorkspace.tsx
+++ b/apps/web/src/DiffWorkspace.tsx
@@ -27,6 +27,7 @@ import {
import { useAppearance } from "./appearance-context.tsx";
import { CopyPathButton } from "./CopyPathButton.tsx";
import { DiffToolbar } from "./DiffToolbar.tsx";
+import { DiffComparison } from "./DiffComparison.tsx";
import { themesFor } from "./display-options.ts";
import { DraftComment, ReviewCommentCard } from "./review.tsx";
import type { CommentAnnotation } from "./review-model.ts";
@@ -610,13 +611,6 @@ export function DiffWorkspace() {
],
);
- const scopeDescription = piped
- ? "Command output · fixed snapshot"
- : mode === "staged"
- ? "HEAD → index"
- : mode === "unstaged"
- ? "Index → working tree, including untracked files"
- : "HEAD → working tree, including untracked files";
const emptyTitle = !repository
? diff.notice
? "Cannot load changes"
@@ -765,7 +759,7 @@ export function DiffWorkspace() {