mirror of https://github.com/sgoudham/website.git
You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
70 lines
2.1 KiB
TypeScript
70 lines
2.1 KiB
TypeScript
1 year ago
|
import { fetchUserRepositories } from "@/app/lib/api";
|
||
|
|
import { Star } from "./icons/Star";
|
||
|
|
import Link from "next/link";
|
||
|
|
import { H2 } from "./utils/Titles";
|
||
|
|
import { ExternalLink } from "./icons/ExternalLink";
|
||
|
|
import { Archived } from "./icons/Archived";
|
||
|
|
|
||
|
|
export const Projects = async () => {
|
||
|
|
const projects = await fetchUserRepositories().then((res) =>
|
||
|
|
res
|
||
|
|
.filter(
|
||
|
|
(data) =>
|
||
|
|
!data.fork &&
|
||
|
|
data.name !== "uwuifyy" &&
|
||
|
|
data.name !== "Enso-Bot" &&
|
||
|
|
!data.archived
|
||
|
|
)
|
||
|
|
.sort((a, b) => (b.stargazers_count ?? 0) - (a.stargazers_count ?? 0))
|
||
|
|
.slice(0, 6)
|
||
|
|
);
|
||
|
|
|
||
|
|
return (
|
||
|
|
<section className="flex flex-col items-center space-y-3 px-5">
|
||
|
|
<H2>Favourite Projects</H2>
|
||
|
|
<div className="rounded-lg text-md lg:text-lg xl:text-xl">
|
||
|
|
<div className="flex flex-col space-y-4">
|
||
|
|
{projects.map((project) => (
|
||
|
|
<Project key={project.name} project={project} />
|
||
|
|
))}
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</section>
|
||
|
|
);
|
||
|
|
};
|
||
|
|
|
||
|
|
export const Project = ({ project }: { project: RepositoryData }) => {
|
||
|
|
return (
|
||
|
|
<Link
|
||
|
|
rel="noopener noreferrer"
|
||
|
|
target="_blank"
|
||
|
|
href={project.html_url}
|
||
|
|
className="bg-base w-full rounded-xl outline-2 outline-mantle focus:ring-2 focus:ring-blue ring-offset-0 shadow-lg hover:scale-105 motion-safe:duration-300 p-3"
|
||
|
|
>
|
||
|
|
<div className="flex flex-col space-y-1 h-full justify-between">
|
||
|
|
<div>
|
||
|
|
<span className="font-semibold hover:underline">
|
||
|
|
{project.name} 
|
||
|
|
<ExternalLink />
|
||
|
|
</span>
|
||
|
|
{project.description && (
|
||
|
|
<div className="text-sm lg:text-md xl:text-lg text-subtext1">
|
||
|
|
{project.description}
|
||
|
|
</div>
|
||
|
|
)}
|
||
|
|
</div>
|
||
|
|
<div className="self-end flex flex-row gap-x-1">
|
||
|
|
{project.archived && (
|
||
|
|
<p className="text-md font-medium bg-mantle rounded-xl px-3">
|
||
|
|
<Archived />
|
||
|
|
</p>
|
||
|
|
)}
|
||
|
|
<p className="text-md font-medium bg-mantle rounded-xl px-3">
|
||
|
|
{project.stargazers_count} <Star />
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</Link>
|
||
|
|
);
|
||
|
|
};
|