Merge pull request #977 from tysoncung/fix/918-github-stars-loading-state

fix(ui): show skeleton instead of fake star count while loading
This commit is contained in:
Rohan Verma 2026-03-25 12:34:41 -07:00 committed by GitHub
commit dfe3e7b43f
No known key found for this signature in database
GPG key ID: B5690EEEBB952194

View file

@ -4,6 +4,7 @@ import { IconBrandGithub } from "@tabler/icons-react";
import { motion, useMotionValue, useSpring } from "motion/react"; import { motion, useMotionValue, useSpring } from "motion/react";
import * as React from "react"; import * as React from "react";
import { cn } from "@/lib/utils"; import { cn } from "@/lib/utils";
import { Skeleton } from "@/components/ui/skeleton";
// --------------------------------------------------------------------------- // ---------------------------------------------------------------------------
// Per-digit scrolling wheel // Per-digit scrolling wheel
@ -277,12 +278,16 @@ function NavbarGitHubStars({
)} )}
> >
<IconBrandGithub className="h-5 w-5 text-neutral-700 dark:text-neutral-300 shrink-0" /> <IconBrandGithub className="h-5 w-5 text-neutral-700 dark:text-neutral-300 shrink-0" />
<AnimatedStarCount {isLoading ? (
value={isLoading ? 10000 : stars} <Skeleton className="h-4 w-10" />
itemSize={ITEM_SIZE} ) : (
isRolling={isLoading} <AnimatedStarCount
className="text-sm font-semibold tabular-nums text-neutral-700 dark:text-neutral-300 group-hover:text-neutral-900 dark:group-hover:text-neutral-100 transition-colors" value={stars}
/> itemSize={ITEM_SIZE}
isRolling={false}
className="text-sm font-semibold tabular-nums text-neutral-700 dark:text-neutral-300 group-hover:text-neutral-900 dark:group-hover:text-neutral-100 transition-colors"
/>
)}
</a> </a>
); );
} }