fetch GitHub star count dynamically in docs header (#1202)
* fetch GitHub star count dynamically in docs header Replace the hardcoded "27k" star count with a live fetch from the GitHub API, revalidated every 24 hours via Next.js fetch caching. Gracefully hides the count if the API is unreachable. * remove GITHUB_TOKEN usage from star count fetch
This commit is contained in:
@@ -1,10 +1,10 @@
|
|||||||
"use client";
|
|
||||||
|
|
||||||
import Link from "next/link";
|
import Link from "next/link";
|
||||||
import { ThemeToggle } from "./theme-toggle";
|
import { ThemeToggle } from "./theme-toggle";
|
||||||
import { Search } from "./search";
|
import { Search } from "./search";
|
||||||
|
import { getStarCount } from "@/lib/github";
|
||||||
|
|
||||||
export function Header() {
|
export async function Header() {
|
||||||
|
const stars = await getStarCount();
|
||||||
return (
|
return (
|
||||||
<header className="sticky top-0 z-50 bg-white/90 backdrop-blur-sm dark:bg-neutral-950/90">
|
<header className="sticky top-0 z-50 bg-white/90 backdrop-blur-sm dark:bg-neutral-950/90">
|
||||||
<div className="flex h-14 items-center justify-between px-4 gap-6">
|
<div className="flex h-14 items-center justify-between px-4 gap-6">
|
||||||
@@ -68,7 +68,7 @@ export function Header() {
|
|||||||
>
|
>
|
||||||
<path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.013 8.013 0 0016 8c0-4.42-3.58-8-8-8z" />
|
<path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.013 8.013 0 0016 8c0-4.42-3.58-8-8-8z" />
|
||||||
</svg>
|
</svg>
|
||||||
<span>27k</span>
|
{stars && <span>{stars}</span>}
|
||||||
</a>
|
</a>
|
||||||
<a
|
<a
|
||||||
href="https://www.npmjs.com/package/agent-browser"
|
href="https://www.npmjs.com/package/agent-browser"
|
||||||
|
|||||||
@@ -0,0 +1,20 @@
|
|||||||
|
const REPO = "vercel-labs/agent-browser";
|
||||||
|
const REVALIDATE = 86400;
|
||||||
|
|
||||||
|
export async function getStarCount(): Promise<string> {
|
||||||
|
try {
|
||||||
|
const res = await fetch(`https://api.github.com/repos/${REPO}`, {
|
||||||
|
headers: { Accept: "application/vnd.github.v3+json" },
|
||||||
|
next: { revalidate: REVALIDATE },
|
||||||
|
});
|
||||||
|
if (!res.ok) return "";
|
||||||
|
const data = await res.json();
|
||||||
|
const count = data.stargazers_count;
|
||||||
|
if (typeof count !== "number") return "";
|
||||||
|
if (count >= 1000)
|
||||||
|
return `${(count / 1000).toFixed(count >= 10000 ? 0 : 1)}k`;
|
||||||
|
return String(count);
|
||||||
|
} catch {
|
||||||
|
return "";
|
||||||
|
}
|
||||||
|
}
|
||||||
Reference in New Issue
Block a user