85 lines
2.7 KiB
JavaScript
85 lines
2.7 KiB
JavaScript
import React from "react";
|
|
|
|
import { useAppStars } from "@site/src/hooks/useAppStars";
|
|
import { useAppRelease } from "@site/src/hooks/useAppRelease";
|
|
|
|
import { AiOutlineGithub, AiOutlineTwitter } from "react-icons/ai";
|
|
import { BiLogoDiscordAlt } from "react-icons/bi";
|
|
|
|
const socials = [
|
|
{
|
|
icon: <AiOutlineTwitter className="text-xl text-white" />,
|
|
href: "https://twitter.com/janframework",
|
|
},
|
|
{
|
|
icon: <BiLogoDiscordAlt className="text-xl text-white" />,
|
|
href: "https://discord.com/invite/FTk2MvZwJH",
|
|
},
|
|
{
|
|
icon: <AiOutlineGithub className="text-lg text-white" />,
|
|
href: "https://github.com/janhq/jan",
|
|
},
|
|
];
|
|
|
|
export default function AnnoncementBanner() {
|
|
const { stargazers } = useAppStars();
|
|
const { release } = useAppRelease();
|
|
|
|
return (
|
|
<div className="h-10 w-full flex-shrink-0 bg-blue-600">
|
|
<div className="px-4 lg:px-10 flex h-full items-center justify-between py-0.5">
|
|
<div className="flex h-6 items-center shadow-sm">
|
|
<a
|
|
href="https://github.com/janhq/jan"
|
|
target="_blank"
|
|
className="flex h-full items-center gap-x-1 rounded-l-sm bg-indigo-50 px-1 py-0.5"
|
|
>
|
|
<AiOutlineGithub className="text-lg text-gray-800" />
|
|
<span className="text-xs font-bold tracking-tight text-gray-800">
|
|
Stars
|
|
</span>
|
|
</a>
|
|
<a
|
|
href="https://github.com/janhq/jan/stargazers"
|
|
target="_blank"
|
|
className="flex h-full items-center rounded-r-sm border-l border-gray-100 bg-white px-1 py-0.5 font-medium"
|
|
>
|
|
<span className="text-xs font-bold text-gray-700">
|
|
{stargazers.count}
|
|
</span>
|
|
</a>
|
|
</div>
|
|
<a
|
|
href="https://github.com/janhq/jan/releases"
|
|
target="_blank"
|
|
className="hidden items-center gap-x-2 lg:flex"
|
|
>
|
|
✨
|
|
<div className="flex items-center rounded bg-white px-2">
|
|
<span className="font-bold uppercase text-blue-600">new</span>
|
|
</div>
|
|
<p className="text-white">
|
|
<span className="font-bold capitalize">{release.tagVersion}</span>
|
|
is now live on GitHub. Check it out!
|
|
</p>
|
|
</a>
|
|
<div className="flex items-center gap-x-3">
|
|
{socials.map((social, i) => {
|
|
return (
|
|
<a
|
|
aria-label={`social-${i}`}
|
|
key={i}
|
|
href={social.href}
|
|
target="_blank"
|
|
rel="noopener"
|
|
>
|
|
{social.icon}
|
|
</a>
|
|
);
|
|
})}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|