1
import { Pager } from "@/client/components/Pager";
2
import { type Progress, ProgressBanner } from "@/client/components/ProgressBanner";
3
import { RepoNav } from "@/client/components/RepoNav";
4
import { MergeExpanderIsland } from "@/client/islands/merge-expander";
5
import { IslandHost } from "@/client/server/IslandHost";
6
 
7
type CommitView = {
8
  oid: string;
9
  shortOid: string;
10
  firstLine: string;
11
  authorName: string;
12
  when: string;
13
  isMerge?: boolean;
14
};
15
 
16
type PagerModel = {
17
  perPageLinks: Array<{ text: string; href: string }>;
18
  newerHref?: string;
19
  olderHref?: string;
20
};
21
 
22
export type CommitsPageProps = {
23
  owner: string;
24
  repo: string;
25
  ref: string;
26
  refEnc: string;
27
  commits: CommitView[];
28
  pager?: PagerModel;
29
  progress?: Progress;
30
};
31
 
32
export function CommitsPage({
33
  owner,
34
  repo,
35
  ref,
36
  refEnc,
37
  commits,
38
  pager,
39
  progress,
40
}: CommitsPageProps) {
41
  const refLabel =
42
    ref.length === 40 ? (
43
      <>
44
        <span className="font-mono sm:hidden">{ref.slice(0, 12)}…</span>
45
        <span className="hidden font-mono sm:inline">{ref}</span>
46
      </>
47
    ) : (
48
      <span className="font-mono">{ref}</span>
49
    );
50
 
51
  return (
52
    <div>
53
      <RepoNav owner={owner} repo={repo} refEnc={refEnc} currentTab="commits" />
54
      <ProgressBanner progress={progress} />
55
      <span className="mb-1 inline-block text-xs font-semibold uppercase tracking-wider text-accent-500 dark:text-accent-400">
56
        History
57
      </span>
58
      <h2 className="font-display tracking-tight">Commits on {refLabel}</h2>
59
      <Pager pager={pager} />
60
      <IslandHost name="merge-expander" props={{ owner, repo, commits }}>
61
        <MergeExpanderIsland owner={owner} repo={repo} commits={commits} />
62
      </IslandHost>
63
    </div>
64
  );
65
}