Skip to content

Commit d20ab10

Browse files
wip
1 parent 48f7693 commit d20ab10

4 files changed

Lines changed: 123 additions & 15 deletions

File tree

packages/web/src/app/(app)/browse/[...path]/components/commitDiffPanel/commitDiffPanel.tsx

Lines changed: 36 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,15 @@
1+
import { Button } from "@/components/ui/button";
2+
import { Tooltip, TooltipContent, TooltipTrigger } from "@/components/ui/tooltip";
13
import { getCommit, getDiff } from "@/features/git";
24
import { isServiceError } from "@/lib/utils";
35
import { format } from "date-fns";
6+
import { FileCode } from "lucide-react";
7+
import Link from "next/link";
48
import { formatAuthorsText, getCommitAuthors } from "../../../components/commitAuthors";
59
import { AuthorsAvatarGroup } from "../../../components/commitParts";
10+
import { getBrowsePath } from "../../../hooks/utils";
11+
import { CommitHashLine } from "./commitHashLine";
12+
import { CommitMessage } from "./commitMessage";
613
import { computeTotalChangeCounts, DiffStat } from "./diffStat";
714
import { FileDiffList } from "./fileDiffList";
815

@@ -50,7 +57,6 @@ export const CommitDiffPanel = async ({ repoName, commitSha, path }: CommitDiffP
5057
);
5158
}
5259

53-
const isMergeCommit = commitResponse.parents.length > 1;
5460
const baseSha = commitResponse.parents.length > 0 ? commitResponse.parents[0] : null;
5561
const subject = commitResponse.message.split('\n')[0];
5662
const formattedDate = format(new Date(commitResponse.date), 'MMM d, yyyy');
@@ -59,8 +65,30 @@ export const CommitDiffPanel = async ({ repoName, commitSha, path }: CommitDiffP
5965

6066
return (
6167
<div className="flex flex-col h-full">
62-
<div className="flex flex-col gap-2 p-4 border-b shrink-0">
63-
<h1 className="text-lg font-semibold">{subject}</h1>
68+
<div className="flex flex-col gap-2 p-3 border-b shrink-0">
69+
<div className="flex flex-row items-start gap-2">
70+
<div className="flex-1 min-w-0">
71+
<CommitMessage subject={subject} body={commitResponse.body} />
72+
</div>
73+
<Tooltip>
74+
<TooltipTrigger asChild>
75+
<Button asChild variant="outline" size="sm" className="flex-shrink-0">
76+
<Link
77+
href={getBrowsePath({
78+
repoName,
79+
revisionName: commitResponse.hash,
80+
path: '',
81+
pathType: 'tree',
82+
})}
83+
>
84+
<FileCode className="h-4 w-4 mr-1" />
85+
Browse files
86+
</Link>
87+
</Button>
88+
</TooltipTrigger>
89+
<TooltipContent>View code at this commit</TooltipContent>
90+
</Tooltip>
91+
</div>
6492
<div className="flex flex-row items-center gap-2 text-sm text-muted-foreground">
6593
<AuthorsAvatarGroup authors={authors} />
6694
<span
@@ -71,17 +99,11 @@ export const CommitDiffPanel = async ({ repoName, commitSha, path }: CommitDiffP
7199
</span>
72100
<span>committed on {formattedDate}</span>
73101
</div>
74-
<div className="text-xs font-mono text-muted-foreground">
75-
{commitResponse.hash.substring(0, 12)}
76-
{baseSha && (
77-
<> · parent {baseSha.substring(0, 12)}</>
78-
)}
79-
</div>
80-
{isMergeCommit && (
81-
<div className="text-xs text-muted-foreground italic">
82-
Merge commit — diff shown against first parent
83-
</div>
84-
)}
102+
<CommitHashLine
103+
repoName={repoName}
104+
commitHash={commitResponse.hash}
105+
parents={commitResponse.parents}
106+
/>
85107
</div>
86108
<div className="flex flex-row items-center justify-between gap-2 px-4 py-2 border-b shrink-0">
87109
<h2 className="text-sm font-medium">
Lines changed: 55 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,55 @@
1+
'use client';
2+
3+
import { CopyIconButton } from "@/app/(app)/components/copyIconButton";
4+
import { useToast } from "@/components/hooks/use-toast";
5+
import Link from "next/link";
6+
import { Fragment, useCallback } from "react";
7+
import { getBrowsePath } from "../../../hooks/utils";
8+
9+
interface CommitHashLineProps {
10+
repoName: string;
11+
commitHash: string;
12+
parents: string[];
13+
}
14+
15+
export const CommitHashLine = ({ repoName, commitHash, parents }: CommitHashLineProps) => {
16+
const { toast } = useToast();
17+
18+
const onCopyHash = useCallback(() => {
19+
navigator.clipboard.writeText(commitHash).then(() => {
20+
toast({ description: "✅ Copied commit SHA to clipboard" });
21+
});
22+
return true;
23+
}, [commitHash, toast]);
24+
25+
return (
26+
<div className="text-xs font-mono text-muted-foreground flex flex-row items-center gap-1">
27+
{parents.length > 0 && (
28+
<>
29+
<span>
30+
{parents.length} parent{parents.length > 1 ? 's' : ''}
31+
</span>
32+
{parents.map((parent, i) => (
33+
<Fragment key={parent}>
34+
{i > 0 && <span>+</span>}
35+
<Link
36+
href={getBrowsePath({
37+
repoName,
38+
path: '',
39+
pathType: 'commit',
40+
commitSha: parent,
41+
})}
42+
className="underline hover:text-foreground"
43+
title={parent}
44+
>
45+
{parent.slice(0, 7)}
46+
</Link>
47+
</Fragment>
48+
))}
49+
</>
50+
)}
51+
<span>commit {commitHash.slice(0, 7)}</span>
52+
<CopyIconButton onCopy={onCopyHash} />
53+
</div>
54+
);
55+
};
Lines changed: 31 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
'use client';
2+
3+
import { CommitBody, CommitBodyToggle } from "@/app/(app)/browse/components/commitParts";
4+
import { useState } from "react";
5+
6+
interface CommitMessageProps {
7+
subject: string;
8+
body: string;
9+
}
10+
11+
export const CommitMessage = ({ subject, body }: CommitMessageProps) => {
12+
const [isBodyExpanded, setIsBodyExpanded] = useState(false);
13+
const hasBody = body.trim().length > 0;
14+
15+
return (
16+
<>
17+
<div className="flex flex-row items-center gap-2">
18+
<h1 className="text-lg font-semibold">{subject}</h1>
19+
{hasBody && (
20+
<CommitBodyToggle
21+
pressed={isBodyExpanded}
22+
onPressedChange={setIsBodyExpanded}
23+
/>
24+
)}
25+
</div>
26+
{hasBody && isBodyExpanded && (
27+
<CommitBody body={body} className="rounded max-h-[40vh] overflow-y-auto" />
28+
)}
29+
</>
30+
);
31+
};

packages/web/src/app/(app)/browse/[...path]/components/commitDiffPanel/fileDiffRow.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -72,7 +72,7 @@ export const FileDiffRow = ({ file, yOffset, repoName, commitSha, parentSha }: F
7272
return (
7373
<div className="flex flex-col">
7474
<div
75-
className="flex flex-row items-center gap-2 p-2 border-b bg-muted sticky z-10 mr-2"
75+
className="flex flex-row items-center gap-2 py-2 px-3 border-b bg-muted sticky z-10"
7676
style={{ top: `-${yOffset}px` }}
7777
>
7878
<StatusBadge status={status} />

0 commit comments

Comments
 (0)