Liam
49daf6f1a4
All checks were successful
Deploy App / docker (ubuntu-latest) (push) Successful in 3m26s
43 lines
1.2 KiB
TypeScript
43 lines
1.2 KiB
TypeScript
"use client";
|
|
|
|
import { ReactElement, useEffect, useState } from "react";
|
|
import { Star } from "lucide-react";
|
|
import Link from "next/link";
|
|
import { cn } from "@/app/common/utils";
|
|
|
|
type GithubStarProps = {
|
|
/**
|
|
* The class name for this component.
|
|
*/
|
|
className?: string;
|
|
};
|
|
|
|
export function GithubStar({ className }: GithubStarProps): ReactElement {
|
|
const [starCount, setStarCount] = useState(0);
|
|
|
|
const getStarCount = async () => {
|
|
const res = await fetch("https://api.github.com/repos/RealFascinated/MinecraftUtilities");
|
|
const data = await res.json();
|
|
return data.stargazers_count;
|
|
};
|
|
|
|
useEffect(() => {
|
|
getStarCount().then(setStarCount);
|
|
}, []);
|
|
|
|
return (
|
|
<Link
|
|
className={cn(
|
|
"bg-github-green px-2 py-1 rounded-lg items-center gap-1 hover:opacity-85 transform-gpu transition-all hidden md:flex",
|
|
className,
|
|
)}
|
|
href="https://github.com/RealFascinated/MinecraftUtilities"
|
|
target="_blank"
|
|
>
|
|
<p className="text-white text-sm bg-github-green-accent py-[3px] px-[4px] rounded-lg leading-none">{starCount}</p>
|
|
<Star size={18} />
|
|
<p className="text-white text-sm leading-none">Star us!</p>
|
|
</Link>
|
|
);
|
|
}
|