1import {
 2    Card,
 3    CardTitle,
 4    CardContent,
 5    CardDescription,
 6    Button,
 7} from "@marzneshin/components"
 8import {
 9    useGithubRepoStatsQuery
10} from "./services";
11import { type FC } from "react";
12import {
13    GithubIcon,
14    StarIcon,
15} from "lucide-react";
16import { projectInfo } from "@marzneshin/utils";
17
18interface GithubRepoProps {
19    variant?: "full" | "mini"
20}
21
22export const GithubRepo: FC<GithubRepoProps> = ({ variant = "full" }) => {
23    const { data: stats } = useGithubRepoStatsQuery()
24    return (
25        <Button variant="secondary" className="bg-gray-800 border-0 dark:text-primary text-secondary dark:hover:text-secondary dark:hover:bg-primary hover:bg-secondary hover:text-primary p-2" asChild>
26            <Card>
27                <a href={projectInfo.github} target="_blank">
28                    <CardContent className="hstack size-fit p-0 gap-2 items-center">
29                        <GithubIcon className="size-fit" />
30                        {variant === "full" ? (<div className="vstack items-start">
31                            <CardTitle className="font-mono text-xs hstack justify-between w-full">
32                                {stats.full_name}
33                                <div className="hstack gap-1 font-bold items-center text-xs">
34                                    <StarIcon className="size-3" />
35                                    {stats.stargazers_count}
36                                </div>
37                            </CardTitle>
38                            <CardDescription className="text-xs">
39                                {stats.description}
40                            </CardDescription>
41                        </div>
42                        ) : (
43                            <CardDescription className="hstack gap-1 font-bold items-center text-xs">
44                                <StarIcon className="size-3" />
45                                {stats.stargazers_count}
46                            </CardDescription>
47                        )}
48                    </CardContent>
49                </a>
50            </Card>
51        </Button>
52    )
53}