1
- "use client" ;
2
- import React , { useEffect , useState } from "react" ;
3
1
import Link from "next/link" ;
4
2
5
3
interface SocialLinksProps {
6
4
className ?: string ;
7
5
}
8
6
9
- export default function SocialLinks ( { className = "" } : SocialLinksProps ) {
10
- const [ stars , setStars ] = useState < number | null > ( null ) ;
11
- const [ loading , setLoading ] = useState ( true ) ;
12
-
13
- useEffect ( ( ) => {
14
- async function fetchStars ( ) {
15
- try {
16
- const response = await fetch (
17
- "https://api.github.com/repos/APIs-guru/openapi-directory" ,
18
- ) ;
19
- if ( response . ok ) {
20
- const data = await response . json ( ) ;
21
- setStars ( data . stargazers_count ) ;
22
- }
23
- } catch ( error ) {
24
- console . error ( "Failed to fetch GitHub stars:" , error ) ;
25
- } finally {
26
- setLoading ( false ) ;
27
- }
7
+ async function fetchStars ( ) {
8
+ const response = await fetch (
9
+ "https://api.github.com/repos/APIs-guru/openapi-directory" ,
10
+ {
11
+ next : { revalidate : 604800 } ,
28
12
}
13
+ ) ;
14
+ if ( ! response . ok ) {
15
+ console . error ( "Failed to fetch GitHub stars:" , response . statusText ) ;
16
+ return 4200 ;
17
+ }
18
+ const data = await response . json ( ) ;
19
+ return data . stargazers_count || 4200 ;
20
+ }
29
21
30
- fetchStars ( ) ;
31
- } , [ ] ) ;
22
+ export default async function SocialLinks ( {
23
+ className = "" ,
24
+ } : SocialLinksProps ) {
25
+ const stars = await fetchStars ( ) ;
32
26
33
27
const formatStars = ( count : number ) : string => {
34
28
if ( count >= 1000 ) {
@@ -54,12 +48,7 @@ export default function SocialLinks({ className = "" }: SocialLinksProps) {
54
48
>
55
49
< path d = "M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23.957-.266 1.983-.399 3.003-.404 1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v3.293c0 .319.192.694.801.576 4.765-1.589 8.199-6.086 8.199-11.386 0-6.627-5.373-12-12-12z" />
56
50
</ svg >
57
- < span className = "text-sm font-medium" >
58
- { loading ? "Star" : `${ formatStars ( stars || 0 ) } Stars` }
59
- </ span >
60
- { loading && (
61
- < span className = "inline-block w-3 h-3 border-2 border-t-transparent border-white rounded-full animate-spin ml-1" > </ span >
62
- ) }
51
+ < span className = "text-sm font-medium" > { formatStars ( stars ) } Stars</ span >
63
52
</ Link >
64
53
< Link
65
54
href = "https://twitter.com/intent/tweet?text=http%3A%2F%2FAPIs.guru%20-%20Wikipedia%20for%20%23Web%20%23APIs%20by%20@APIs_guru%20pic.twitter.com/UhlhbMw1NP"
0 commit comments