Skip to content

Commit 31c9785

Browse files
authored
[BE][HUD] Create unified CommitInfo component (#6920)
There's one for commit and one for PR, but they're mostly the same Only difference I found: * Commit has commit title - so I added an `isCommitPage` param to CommitInfo (there's already one in the CommitStatus component so I figured why not) * data fetch in PR checks if sha is null - changed to sha && url to get the same functionality Should have no UI changes
1 parent 3426378 commit 31c9785

File tree

3 files changed

+66
-114
lines changed

3 files changed

+66
-114
lines changed
Lines changed: 61 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,61 @@
1+
import CommitStatus from "components/commit/CommitStatus";
2+
import { fetcher } from "lib/GeneralUtils";
3+
import { CommitApiResponse } from "pages/api/[repoOwner]/[repoName]/commit/[sha]";
4+
import { IssueLabelApiResponse } from "pages/api/issue/[label]";
5+
import useSWR from "swr";
6+
7+
export function CommitInfo({
8+
repoOwner,
9+
repoName,
10+
sha,
11+
isCommitPage,
12+
}: {
13+
repoOwner: string;
14+
repoName: string;
15+
sha: string;
16+
isCommitPage: boolean;
17+
}) {
18+
const { data: commitData, error } = useSWR<CommitApiResponse>(
19+
sha && `/api/${repoOwner}/${repoName}/commit/${sha}`,
20+
fetcher,
21+
{
22+
refreshInterval: 60 * 1000, // refresh every minute
23+
// Refresh even when the user isn't looking, so that switching to the tab
24+
// will always have fresh info.
25+
refreshWhenHidden: true,
26+
}
27+
);
28+
29+
const { data: unstableIssuesData } = useSWR<IssueLabelApiResponse>(
30+
`/api/issue/unstable`,
31+
fetcher,
32+
{
33+
dedupingInterval: 300 * 1000,
34+
refreshInterval: 300 * 1000, // refresh every 5 minutes
35+
}
36+
);
37+
38+
if (error != null) {
39+
return <div>Error occured</div>;
40+
}
41+
42+
if (commitData === undefined) {
43+
return <div>Loading...</div>;
44+
}
45+
46+
const { commit, jobs } = commitData;
47+
48+
return (
49+
<div>
50+
{isCommitPage && <h2>{commit.commitTitle}</h2>}
51+
<CommitStatus
52+
repoOwner={repoOwner}
53+
repoName={repoName}
54+
commit={commit}
55+
jobs={jobs}
56+
isCommitPage={isCommitPage}
57+
unstableIssues={unstableIssuesData ?? []}
58+
/>
59+
</div>
60+
);
61+
}

torchci/pages/[repoOwner]/[repoName]/commit/[sha].tsx

Lines changed: 2 additions & 59 deletions
Original file line numberDiff line numberDiff line change
@@ -1,64 +1,6 @@
1-
import CommitStatus from "components/commit/CommitStatus";
1+
import { CommitInfo } from "components/commit/CommitInfo";
22
import { useSetTitle } from "components/layout/DynamicTitle";
3-
import { fetcher } from "lib/GeneralUtils";
43
import { useRouter } from "next/router";
5-
import { CommitApiResponse } from "pages/api/[repoOwner]/[repoName]/commit/[sha]";
6-
import { IssueLabelApiResponse } from "pages/api/issue/[label]";
7-
import useSWR from "swr";
8-
9-
export function CommitInfo({
10-
repoOwner,
11-
repoName,
12-
sha,
13-
}: {
14-
repoOwner: string;
15-
repoName: string;
16-
sha: string;
17-
}) {
18-
const { data: commitData, error } = useSWR<CommitApiResponse>(
19-
`/api/${repoOwner}/${repoName}/commit/${sha}`,
20-
fetcher,
21-
{
22-
refreshInterval: 60 * 1000, // refresh every minute
23-
// Refresh even when the user isn't looking, so that switching to the tab
24-
// will always have fresh info.
25-
refreshWhenHidden: true,
26-
}
27-
);
28-
29-
const { data: unstableIssuesData } = useSWR<IssueLabelApiResponse>(
30-
`/api/issue/unstable`,
31-
fetcher,
32-
{
33-
dedupingInterval: 300 * 1000,
34-
refreshInterval: 300 * 1000, // refresh every 5 minutes
35-
}
36-
);
37-
38-
if (error != null) {
39-
return <div>Error occured</div>;
40-
}
41-
42-
if (commitData === undefined) {
43-
return <div>Loading...</div>;
44-
}
45-
46-
const { commit, jobs } = commitData;
47-
48-
return (
49-
<div>
50-
<h2>{commit.commitTitle}</h2>
51-
<CommitStatus
52-
repoOwner={repoOwner}
53-
repoName={repoName}
54-
commit={commit}
55-
jobs={jobs}
56-
isCommitPage={true}
57-
unstableIssues={unstableIssuesData ?? []}
58-
/>
59-
</div>
60-
);
61-
}
624

635
export default function Page() {
646
const router = useRouter();
@@ -86,6 +28,7 @@ export default function Page() {
8628
repoOwner={repoOwner as string}
8729
repoName={repoName as string}
8830
sha={sha as string}
31+
isCommitPage={true}
8932
/>
9033
)}
9134
</div>

torchci/pages/[repoOwner]/[repoName]/pull/[prNumber].tsx

Lines changed: 3 additions & 55 deletions
Original file line numberDiff line numberDiff line change
@@ -1,67 +1,14 @@
11
import { Stack } from "@mui/material";
2-
import CommitStatus from "components/commit/CommitStatus";
2+
import { CommitInfo } from "components/commit/CommitInfo";
33
import DrCIButton from "components/common/DrCIButton";
44
import ErrorBoundary from "components/common/ErrorBoundary";
55
import { useSetTitle } from "components/layout/DynamicTitle";
6+
import { fetcher } from "lib/GeneralUtils";
67
import { PRData } from "lib/types";
78
import { useRouter } from "next/router";
8-
import { CommitApiResponse } from "pages/api/[repoOwner]/[repoName]/commit/[sha]";
9-
import { IssueLabelApiResponse } from "pages/api/issue/[label]";
109
import { useEffect, useState } from "react";
1110
import useSWR from "swr";
1211

13-
const fetcher = (url: string) => fetch(url).then((res) => res.json());
14-
15-
function CommitInfo({
16-
repoOwner,
17-
repoName,
18-
sha,
19-
}: {
20-
repoOwner: string;
21-
repoName: string;
22-
sha: string;
23-
}) {
24-
const { data: commitData, error } = useSWR<CommitApiResponse>(
25-
sha != null ? `/api/${repoOwner}/${repoName}/commit/${sha}` : null,
26-
fetcher,
27-
{
28-
refreshInterval: 60 * 1000, // refresh every minute
29-
// Refresh even when the user isn't looking, so that switching to the tab
30-
// will always have fresh info.
31-
refreshWhenHidden: true,
32-
}
33-
);
34-
35-
const { data: unstableIssuesData } = useSWR<IssueLabelApiResponse>(
36-
`/api/issue/unstable`,
37-
fetcher,
38-
{
39-
dedupingInterval: 300 * 1000,
40-
refreshInterval: 300 * 1000, // refresh every 5 minutes
41-
}
42-
);
43-
44-
if (error != null) {
45-
return <div>Error occurred</div>;
46-
}
47-
48-
if (commitData === undefined) {
49-
return <div>Loading...</div>;
50-
}
51-
const { commit, jobs } = commitData;
52-
53-
return (
54-
<CommitStatus
55-
repoOwner={repoOwner}
56-
repoName={repoName}
57-
commit={commit}
58-
jobs={jobs}
59-
isCommitPage={false}
60-
unstableIssues={unstableIssuesData ?? []}
61-
/>
62-
);
63-
}
64-
6512
function CommitHeader({
6613
repoOwner,
6714
repoName,
@@ -171,6 +118,7 @@ function Page() {
171118
repoOwner={repoOwner as string}
172119
repoName={repoName as string}
173120
sha={selectedSha}
121+
isCommitPage={false}
174122
/>
175123
)}
176124
</ErrorBoundary>

0 commit comments

Comments
 (0)