From 3b1d034979a25764770043071ec6f1002d26f018 Mon Sep 17 00:00:00 2001 From: Luke Curley Date: Wed, 23 Sep 2026 13:21:31 -0700 Subject: [PATCH] Round the nav's community counts, exact count on hover Co-Authored-By: Claude Opus 5.5 --- src/stats.ts | 13 ++++++++++--- 1 file changed, 10 insertions(+), 3 deletions(-) diff --git a/src/stats.ts b/src/stats.ts index 76a35a6..1a975a3 100644 --- a/src/stats.ts +++ b/src/stats.ts @@ -71,9 +71,13 @@ async function fetchStats(): Promise { return { stars, chatters }; } +const compact = new Intl.NumberFormat("en", { notation: "compact", maximumFractionDigits: 1 }); +const round = (n: number) => compact.format(n).toLowerCase(); +const TITLES: Record = { stars: "GitHub stars", chatters: "Discord members" }; + // Fills every element with a `data-stat="stars"` / `data-stat="chatters"` -// attribute, e.g. "1,515 stars". Elements stay empty if a fetch fails; the -// links around them still work. +// attribute, e.g. "1.5k stars", and titles the surrounding link with the exact +// count. Elements stay empty if a fetch fails; the links still work. export async function renderStats() { const cached = readCache(); const stats = cached ?? (await fetchStats()); @@ -82,6 +86,9 @@ export async function renderStats() { for (const el of document.querySelectorAll("[data-stat]")) { const key = el.dataset.stat as keyof Stats; const value = stats[key]; - if (typeof value === "number") el.textContent = `${value.toLocaleString()} ${key}`; + if (typeof value !== "number") continue; + el.textContent = `${round(value)} ${key}`; + const link = el.closest("a"); + if (link) link.title = `${value.toLocaleString()} ${TITLES[key]}`; } }