Skip to content

Commit 4eda964

Browse files
committed
update link in ContributionCard to link to Contribution page
1 parent 7446d5a commit 4eda964

File tree

3 files changed

+59
-52
lines changed

3 files changed

+59
-52
lines changed

web/src/components/contribution-card.tsx

Lines changed: 52 additions & 51 deletions
Original file line numberDiff line numberDiff line change
@@ -9,67 +9,68 @@ import { getElapsedTime } from "src/utils/elapsed-time";
99
export function ContributionCard({
1010
contribution,
1111
compact = false,
12+
onClick,
1213
}: {
1314
contribution: GetContributionsResponse["contributions"][number];
1415
compact?: boolean;
16+
onClick?: () => void;
1517
}) {
1618
const { localize } = useLocale();
1719

1820
return (
19-
<div dir="ltr" className="card card-compact bg-base-300 flex-auto w-full max-w-xs sm:max-w-sm">
20-
<Link href={getContributionURL(contribution)}>
21-
<div className="card-body markdown">
22-
<div className="card-body">
23-
<h2 className="card-title">
24-
<Markdown content={contribution.title} />
25-
</h2>
26-
<span className="flex-1" />
21+
<Link
22+
className="card card-compact bg-base-300 flex-auto w-full max-w-xs sm:max-w-sm"
23+
dir="ltr"
24+
href={getContributionURL(contribution)}
25+
// TODO-OB: there's a bug here: when passing onClick to Link, the link no longer work as a SPA link, and instead causes a full reload of the page
26+
onClick={onClick}
27+
>
28+
<div className="card-body markdown">
29+
<div className="card-body">
30+
<h2 className="card-title">
31+
<Markdown content={contribution.title} />
32+
</h2>
33+
<span className="flex-1" />
34+
{!compact && (
35+
<>
36+
<span className="card-normal">{contribution.repository.project.name}</span>
37+
<span className="card-normal">
38+
{contribution.repository.owner}/{contribution.repository.name}
39+
</span>
40+
</>
41+
)}
42+
<div className="card-actions justify-end mt-4 gap-4">
2743
{!compact && (
28-
<>
29-
<span className="card-normal">{contribution.repository.project.name}</span>
30-
<span className="card-normal">
31-
{contribution.repository.owner}/{contribution.repository.name}
32-
</span>
33-
</>
44+
<img className="w-6 h-6 rounded-full" src={contribution.contributor.avatarUrl} />
45+
)}
46+
<div className="flex-1" />
47+
{contribution.activityCount > 0 && (
48+
<div className="flex flex-row">
49+
<svg
50+
xmlns="http://www.w3.org/2000/svg"
51+
fill="none"
52+
viewBox="0 0 24 24"
53+
strokeWidth={1.5}
54+
stroke="currentColor"
55+
className="size-6"
56+
>
57+
<path
58+
strokeLinecap="round"
59+
strokeLinejoin="round"
60+
d="M20.25 8.511c.884.284 1.5 1.128 1.5 2.097v4.286c0 1.136-.847 2.1-1.98 2.193-.34.027-.68.052-1.02.072v3.091l-3-3c-1.354 0-2.694-.055-4.02-.163a2.115 2.115 0 0 1-.825-.242m9.345-8.334a2.126 2.126 0 0 0-.476-.095 48.64 48.64 0 0 0-8.048 0c-1.131.094-1.976 1.057-1.976 2.192v4.286c0 .837.46 1.58 1.155 1.951m9.345-8.334V6.637c0-1.621-1.152-3.026-2.76-3.235A48.455 48.455 0 0 0 11.25 3c-2.115 0-4.198.137-6.24.402-1.608.209-2.76 1.614-2.76 3.235v6.226c0 1.621 1.152 3.026 2.76 3.235.577.075 1.157.14 1.74.194V21l4.155-4.155"
61+
/>
62+
</svg>
63+
<span className="">{contribution.activityCount}</span>
64+
</div>
65+
)}
66+
{!compact && (
67+
<div className="flex flex-row">
68+
{getElapsedTime(contribution.updatedAt, localize("elapsed-time-suffixes"))}
69+
</div>
3470
)}
35-
<div className="card-actions justify-end mt-4 gap-4">
36-
{!compact && (
37-
<img className="w-6 h-6 rounded-full" src={contribution.contributor.avatarUrl} />
38-
)}
39-
<div className="flex-1" />
40-
{contribution.activityCount > 0 && (
41-
<div className="flex flex-row">
42-
<svg
43-
xmlns="http://www.w3.org/2000/svg"
44-
fill="none"
45-
viewBox="0 0 24 24"
46-
strokeWidth={1.5}
47-
stroke="currentColor"
48-
className="size-6"
49-
>
50-
<path
51-
strokeLinecap="round"
52-
strokeLinejoin="round"
53-
d="M20.25 8.511c.884.284 1.5 1.128 1.5 2.097v4.286c0 1.136-.847 2.1-1.98 2.193-.34.027-.68.052-1.02.072v3.091l-3-3c-1.354 0-2.694-.055-4.02-.163a2.115 2.115 0 0 1-.825-.242m9.345-8.334a2.126 2.126 0 0 0-.476-.095 48.64 48.64 0 0 0-8.048 0c-1.131.094-1.976 1.057-1.976 2.192v4.286c0 .837.46 1.58 1.155 1.951m9.345-8.334V6.637c0-1.621-1.152-3.026-2.76-3.235A48.455 48.455 0 0 0 11.25 3c-2.115 0-4.198.137-6.24.402-1.608.209-2.76 1.614-2.76 3.235v6.226c0 1.621 1.152 3.026 2.76 3.235.577.075 1.157.14 1.74.194V21l4.155-4.155"
54-
/>
55-
</svg>
56-
<span className="">{contribution.activityCount}</span>
57-
</div>
58-
)}
59-
{!compact && (
60-
<div className="flex flex-row">
61-
{getElapsedTime(contribution.updatedAt, localize("elapsed-time-suffixes"))}
62-
</div>
63-
)}
64-
<Link href={contribution.url} className="link">
65-
{contribution.type === "ISSUE"
66-
? localize("contribute-read-issue")
67-
: localize("contribute-review-changes")}
68-
</Link>
69-
</div>
7071
</div>
7172
</div>
72-
</Link>
73-
</div>
73+
</div>
74+
</Link>
7475
);
7576
}

web/src/components/project-card.tsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,7 @@ export function ProjectCard({
1717
href={getProjectURL(project)}
1818
dir="ltr"
1919
className="bg-base-300 w-full max-w-xs sm:max-w-sm flex flex-col rounded-lg border-base-200 border-2 overflow-hidden"
20+
// TODO-OB: there's a bug here: when passing onClick to Link, the link no longer work as a SPA link, and instead causes a full reload of the page
2021
onClick={onClick}
2122
>
2223
<h2 className="card-title p-4">{project.name}</h2>

web/src/components/search.tsx

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -132,7 +132,12 @@ export function Search(): JSX.Element {
132132
</h3>
133133
<div className="flex flex-row flex-wrap gap-4 justify-center p-4 max-w-7xl">
134134
{contributionsList.map((contribution) => (
135-
<ContributionCard contribution={contribution} key={contribution.id} compact />
135+
<ContributionCard
136+
contribution={contribution}
137+
key={contribution.id}
138+
compact
139+
onClick={hideModal}
140+
/>
136141
))}
137142
</div>
138143
</div>

0 commit comments

Comments
 (0)