40 lines
1.6 KiB
TypeScript
40 lines
1.6 KiB
TypeScript
|
import Skeleton, { SkeletonTheme } from "react-loading-skeleton";
|
||
|
|
import { getContributors } from "../lib/contributors";
|
||
|
|
import Link from 'next/link';
|
||
|
|
import { faExternalLinkAlt } from "@fortawesome/free-solid-svg-icons";
|
||
|
|
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
|
||
|
|
|
||
|
|
export default async function Contributors() {
|
||
|
|
try {
|
||
|
|
const contributors = await getContributors();
|
||
|
|
if (!contributors || contributors.length < 1) return (
|
||
|
|
<SkeletonTheme baseColor="#000" highlightColor="#000" width="25%">
|
||
|
|
<Skeleton count={1} enableAnimation={false} />
|
||
|
|
</SkeletonTheme>
|
||
|
|
)
|
||
|
|
const contributorList = contributors.map((contributor, index) => (
|
||
|
|
<span key={index}>
|
||
|
|
{contributor.attributes.url ? (
|
||
|
|
<Link href={contributor.attributes.url} target="_blank">
|
||
|
|
<span className="mr-1">{contributor.attributes.name}</span>
|
||
|
|
<FontAwesomeIcon
|
||
|
|
icon={faExternalLinkAlt}
|
||
|
|
className="fab fa-external-link-alt"
|
||
|
|
></FontAwesomeIcon>
|
||
|
|
</Link>
|
||
|
|
) : (
|
||
|
|
contributor.attributes.name
|
||
|
|
)}
|
||
|
|
{index !== contributors.length - 1 ? ", " : ""}
|
||
|
|
</span>
|
||
|
|
));
|
||
|
|
return (
|
||
|
|
<>{contributorList}</>
|
||
|
|
)
|
||
|
|
} catch (e) {
|
||
|
|
if (e instanceof Error) {
|
||
|
|
console.error(e)
|
||
|
|
}
|
||
|
|
return <p>Failed to fetch contributor list</p>
|
||
|
|
}
|
||
|
|
}
|