From 2bfe4279fd0a0f7467e9779e25e0bc462611890b Mon Sep 17 00:00:00 2001
From: Stephen Jennings <stephen.g.jennings@gmail.com>
Date: Thu, 23 Jul 2026 23:20:53 -0700
Subject: [PATCH 1/2] feat(commits): add expandable commit message body

If a commit message has a body (lines after the subject), show a
MoreHorizontal icon button at the end of the subject line. Clicking it
expands the body below the subject in normal weight text; clicking again
collapses it.
---
 src/browser/components/pr-overview.tsx | 145 ++++++++++++++++---------
 1 file changed, 92 insertions(+), 53 deletions(-)

diff --git a/src/browser/components/pr-overview.tsx b/src/browser/components/pr-overview.tsx
index 32fc08a..f057590 100644
--- a/src/browser/components/pr-overview.tsx
+++ b/src/browser/components/pr-overview.tsx
@@ -42,6 +42,7 @@ import {
   UserMinus,
   RefreshCw,
   Reply,
+  MoreHorizontal,
 } from "lucide-react";
 import { Skeleton } from "../ui/skeleton";
 import { Checkbox } from "../ui/checkbox";
@@ -4643,62 +4644,100 @@ function CommitsTab({
   repo: string;
 }) {
   const store = usePRReviewStore();
+  const [expandedShas, setExpandedShas] = useState<Set<string>>(new Set());
+
   return (
     <div className="border border-border rounded-md overflow-hidden divide-y divide-border">
-      {commits.map((commit) => (
-        <div
-          key={commit.sha}
-          className="flex items-center gap-3 p-3 hover:bg-card/30 cursor-pointer"
-          onClick={async () => {
-            await store.setSelectedCommitSha(commit.sha);
-            const { files } = store.getSnapshot();
-            if (files.length > 0) {
-              store.selectFile(files[0].filename);
-            }
-          }}
-        >
-          <img
-            src={commit.author?.avatar_url || commit.committer?.avatar_url}
-            alt={commit.commit.author?.name}
-            className="w-6 h-6 rounded-full"
-          />
-          <div className="flex-1 min-w-0">
-            <span className="text-sm font-medium truncate block">
-              {commit.commit.message.split("\n")[0]}
-            </span>
-            <p className="text-xs text-muted-foreground">
-              {commit.commit.author?.name} committed{" "}
-              {commit.commit.author?.date &&
-                getTimeAgo(new Date(commit.commit.author.date))}
-            </p>
-          </div>
-          <div className="flex items-center gap-2">
-            {commit.parents && commit.parents.length > 1 ? (
-              <GitMerge className="w-4 h-4 text-purple-500" />
-            ) : (
-              <GitCommit className="w-4 h-4 text-muted-foreground" />
-            )}
-            <a
-              href={`https://github.com/${owner}/${repo}/commit/${commit.sha}`}
-              target="_blank"
-              rel="noopener noreferrer"
-              className="text-xs font-mono text-muted-foreground hover:text-blue-400"
-            >
-              {commit.sha.slice(0, 7)}
-            </a>
-            <button
-              onClick={(e) => {
-                e.stopPropagation();
-                navigator.clipboard.writeText(commit.sha);
-              }}
-              className="p-1 text-muted-foreground hover:text-foreground rounded hover:bg-muted"
-              title="Copy commit SHA"
-            >
-              <Copy className="w-3.5 h-3.5" />
-            </button>
+      {commits.map((commit) => {
+        const subject = commit.commit.message.split("\n")[0];
+        const body = commit.commit.message
+          .split("\n")
+          .slice(1)
+          .join("\n")
+          .trim();
+        const hasBody = body.length > 0;
+        const isExpanded = expandedShas.has(commit.sha);
+
+        return (
+          <div
+            key={commit.sha}
+            className="flex items-start gap-3 p-3 hover:bg-card/30 cursor-pointer"
+            onClick={async () => {
+              await store.setSelectedCommitSha(commit.sha);
+              const { files } = store.getSnapshot();
+              if (files.length > 0) {
+                store.selectFile(files[0].filename);
+              }
+            }}
+          >
+            <img
+              src={commit.author?.avatar_url || commit.committer?.avatar_url}
+              alt={commit.commit.author?.name}
+              className="w-6 h-6 rounded-full mt-0.5"
+            />
+            <div className="flex-1 min-w-0">
+              <div className="flex items-baseline min-w-0">
+                <span className="text-sm font-medium truncate">{subject}</span>
+                {hasBody && (
+                  <button
+                    onClick={(e) => {
+                      e.stopPropagation();
+                      setExpandedShas((prev) => {
+                        const next = new Set(prev);
+                        if (next.has(commit.sha)) {
+                          next.delete(commit.sha);
+                        } else {
+                          next.add(commit.sha);
+                        }
+                        return next;
+                      });
+                    }}
+                    className="ml-1.5 flex-shrink-0 self-center inline-flex items-center justify-center w-5 h-4 rounded bg-muted text-muted-foreground hover:bg-muted/70 hover:text-foreground"
+                    title={isExpanded ? "Collapse message" : "Expand message"}
+                  >
+                    <MoreHorizontal className="w-3.5 h-3.5" />
+                  </button>
+                )}
+              </div>
+              {isExpanded && (
+                <p className="text-sm font-normal text-muted-foreground mt-1 mb-2 whitespace-pre-wrap">
+                  {body}
+                </p>
+              )}
+              <p className="text-xs text-muted-foreground">
+                {commit.commit.author?.name} committed{" "}
+                {commit.commit.author?.date &&
+                  getTimeAgo(new Date(commit.commit.author.date))}
+              </p>
+            </div>
+            <div className="flex items-center gap-2 mt-0.5">
+              {commit.parents && commit.parents.length > 1 ? (
+                <GitMerge className="w-4 h-4 text-purple-500" />
+              ) : (
+                <GitCommit className="w-4 h-4 text-muted-foreground" />
+              )}
+              <a
+                href={`https://github.com/${owner}/${repo}/commit/${commit.sha}`}
+                target="_blank"
+                rel="noopener noreferrer"
+                className="text-xs font-mono text-muted-foreground hover:text-blue-400"
+              >
+                {commit.sha.slice(0, 7)}
+              </a>
+              <button
+                onClick={(e) => {
+                  e.stopPropagation();
+                  navigator.clipboard.writeText(commit.sha);
+                }}
+                className="p-1 text-muted-foreground hover:text-foreground rounded hover:bg-muted"
+                title="Copy commit SHA"
+              >
+                <Copy className="w-3.5 h-3.5" />
+              </button>
+            </div>
           </div>
-        </div>
-      ))}
+        );
+      })}
     </div>
   );
 }

From a91d119538f963d526f145fe07a8d44e2119448a Mon Sep 17 00:00:00 2001
From: Stephen Jennings <stephen.g.jennings@gmail.com>
Date: Thu, 23 Jul 2026 23:27:26 -0700
Subject: [PATCH 2/2] feat(commits): convert commit rows to BlockLink

Clicking anywhere on a commit row (except other interactive controls)
now activates the commit navigation via BlockLink. The subject line is
the registered BlockLink.Link target. The GitHub SHA link gets
stopPropagation so it opens externally without also triggering
navigation.
---
 src/browser/components/pr-overview.tsx | 28 +++++++++++++++++---------
 1 file changed, 18 insertions(+), 10 deletions(-)

diff --git a/src/browser/components/pr-overview.tsx b/src/browser/components/pr-overview.tsx
index f057590..d7c9c6e 100644
--- a/src/browser/components/pr-overview.tsx
+++ b/src/browser/components/pr-overview.tsx
@@ -44,6 +44,7 @@ import {
   Reply,
   MoreHorizontal,
 } from "lucide-react";
+import { BlockLink } from "../ui/block-link";
 import { Skeleton } from "../ui/skeleton";
 import { Checkbox } from "../ui/checkbox";
 import { cn } from "../cn";
@@ -4659,16 +4660,9 @@ function CommitsTab({
         const isExpanded = expandedShas.has(commit.sha);
 
         return (
-          <div
+          <BlockLink.Root
             key={commit.sha}
             className="flex items-start gap-3 p-3 hover:bg-card/30 cursor-pointer"
-            onClick={async () => {
-              await store.setSelectedCommitSha(commit.sha);
-              const { files } = store.getSnapshot();
-              if (files.length > 0) {
-                store.selectFile(files[0].filename);
-              }
-            }}
           >
             <img
               src={commit.author?.avatar_url || commit.committer?.avatar_url}
@@ -4677,7 +4671,20 @@ function CommitsTab({
             />
             <div className="flex-1 min-w-0">
               <div className="flex items-baseline min-w-0">
-                <span className="text-sm font-medium truncate">{subject}</span>
+                <BlockLink.Link asChild>
+                  <button
+                    onClick={async () => {
+                      await store.setSelectedCommitSha(commit.sha);
+                      const { files } = store.getSnapshot();
+                      if (files.length > 0) {
+                        store.selectFile(files[0].filename);
+                      }
+                    }}
+                    className="text-sm font-medium truncate text-left"
+                  >
+                    {subject}
+                  </button>
+                </BlockLink.Link>
                 {hasBody && (
                   <button
                     onClick={(e) => {
@@ -4720,6 +4727,7 @@ function CommitsTab({
                 href={`https://github.com/${owner}/${repo}/commit/${commit.sha}`}
                 target="_blank"
                 rel="noopener noreferrer"
+                onClick={(e) => e.stopPropagation()}
                 className="text-xs font-mono text-muted-foreground hover:text-blue-400"
               >
                 {commit.sha.slice(0, 7)}
@@ -4735,7 +4743,7 @@ function CommitsTab({
                 <Copy className="w-3.5 h-3.5" />
               </button>
             </div>
-          </div>
+          </BlockLink.Root>
         );
       })}
     </div>