diff --git a/src/components/GitHubStarCount.tsx b/src/components/GitHubStarCount.tsx index f6ed15ef7..ef03daf63 100644 --- a/src/components/GitHubStarCount.tsx +++ b/src/components/GitHubStarCount.tsx @@ -1,7 +1,8 @@ 'use client' +import { getStarGazers } from '@/lib/stargazers' import clsx from 'clsx' -import React, { useEffect, useState } from 'react' +import React, { FC, useEffect, useState } from 'react' const STAR_COUNT_KEY = 'nitric_github_star_count' const STAR_COUNT_TIMESTAMP_KEY = 'nitric_github_star_count_timestamp' @@ -18,10 +19,16 @@ const formatStarCount = (count: number) => { return count.toString() } -const DEFAULT_STAR_COUNT = 1150 +interface GitHubStarCountProps { + className: string + defaultStarCount: number +} -const GitHubStarCount = ({ className }: { className: string }) => { - const [starCount, setStarCount] = useState(DEFAULT_STAR_COUNT) +const GitHubStarCount: FC = ({ + className, + defaultStarCount, +}) => { + const [starCount, setStarCount] = useState(defaultStarCount) useEffect(() => { const fetchStarCount = async () => { @@ -35,7 +42,7 @@ const GitHubStarCount = ({ className }: { className: string }) => { cachedTimestamp && currentTime - parseInt(cachedTimestamp) < CACHE_DURATION && // Ensure cached value is at least the new default value - parseInt(cachedStarCount) >= DEFAULT_STAR_COUNT + parseInt(cachedStarCount) >= defaultStarCount ) { setStarCount(JSON.parse(cachedStarCount)) } else { diff --git a/src/components/layout/BaseLayout.tsx b/src/components/layout/BaseLayout.tsx index af7d0d094..f1de210ba 100644 --- a/src/components/layout/BaseLayout.tsx +++ b/src/components/layout/BaseLayout.tsx @@ -1,20 +1,16 @@ -import Link from 'next/link' - import { Footer } from '@/components/Footer' import { Header } from '@/components/layout/Header' -import { Logo } from '@/components/Logo' import { Navigation } from '@/components/nav/Navigation' +import { getStarGazers } from '@/lib/stargazers' -const experimentalRuntimes = ['go', 'dart'] - -const v0Runtimes = ['csharp', 'jvm'] +export async function BaseLayout({ children }: React.PropsWithChildren) { + const defaultStarCount = await getStarGazers() -export function BaseLayout({ children }: React.PropsWithChildren) { return (
-
+
diff --git a/src/components/layout/Header.tsx b/src/components/layout/Header.tsx index 5c8b5b439..a8844293b 100644 --- a/src/components/layout/Header.tsx +++ b/src/components/layout/Header.tsx @@ -43,83 +43,92 @@ function TopLevelNavItem({ ) } -export const Header = forwardRef< - React.ElementRef<'div'>, - React.ComponentPropsWithoutRef ->(function Header({ className, ...props }, ref) { - let { isOpen: mobileNavIsOpen } = useMobileNavigationStore() - let isInsideMobileNavigation = useIsInsideMobileNavigation() +interface HeaderProps + extends React.ComponentPropsWithoutRef { + defaultStarCount?: number +} - let { scrollY } = useScroll() - let bgOpacityLight = useTransform(scrollY, [0, 72], [0.5, 0.9]) - let bgOpacityDark = useTransform(scrollY, [0, 72], [0.2, 0.8]) +export const Header = forwardRef, HeaderProps>( + function Header({ className, defaultStarCount, ...props }, ref) { + let { isOpen: mobileNavIsOpen } = useMobileNavigationStore() + let isInsideMobileNavigation = useIsInsideMobileNavigation() - return ( - -
- - - - -
- - + style={ + { + '--bg-opacity-light': bgOpacityLight, + '--bg-opacity-dark': bgOpacityDark, + } as any + } + > +
+ -
-
- -
-
- +
+ + + + +
+
+ +
+
+ +
+
-
-
- - ) -}) + + ) + }, +) diff --git a/src/lib/stargazers.ts b/src/lib/stargazers.ts new file mode 100644 index 000000000..40c2f4b3c --- /dev/null +++ b/src/lib/stargazers.ts @@ -0,0 +1,21 @@ +const DEFAULT_STARGAZERS = 1250 + +export const getStarGazers = async (): Promise => { + try { + // on next < 15.x fetch will force-cache by default + const response = await fetch( + 'https://api.github.com/repos/nitrictech/nitric', + ) + if (!response.ok) { + console.error('Error fetching star count:', response.statusText) + + return DEFAULT_STARGAZERS + } + + const repoData = await response.json() + return repoData.stargazers_count + } catch (e) { + console.error('Error fetching star count:', e) + return DEFAULT_STARGAZERS + } +}