'use client'
|
import React, { useEffect, useState } from 'react'
|
import { Github } from '@/app/components/base/icons/src/public/common'
|
import type { GithubRepo } from '@/models/common'
|
|
const getStar = async () => {
|
const res = await fetch('https://api.github.com/repos/langgenius/dify')
|
|
if (!res.ok)
|
throw new Error('Failed to fetch data')
|
|
return res.json()
|
}
|
|
const GithubStar = () => {
|
const [githubRepo, setGithubRepo] = useState<GithubRepo>({ stargazers_count: 6000 })
|
const [isFetched, setIsFetched] = useState(false)
|
useEffect(() => {
|
(async () => {
|
try {
|
if (process.env.NODE_ENV === 'development')
|
return
|
|
await setGithubRepo(await getStar())
|
setIsFetched(true)
|
}
|
catch (e) {
|
|
}
|
})()
|
}, [])
|
|
if (!isFetched)
|
return null
|
|
return (
|
<a
|
href='https://github.com/langgenius/dify'
|
target='_blank' rel='noopener noreferrer'
|
className='flex items-center leading-[18px] border border-gray-200 rounded-md text-xs text-gray-700 font-semibold overflow-hidden'>
|
<div className='flex items-center px-2 py-1 bg-gray-100'>
|
<Github className='mr-1 w-[18px] h-[18px]' />
|
Star
|
</div>
|
<div className='px-2 py-1 bg-white border-l border-gray-200'>{`${githubRepo.stargazers_count}`.replace(/\B(?=(\d{3})+(?!\d))/g, ',')}</div>
|
</a>
|
)
|
}
|
|
export default GithubStar
|
