mirror of
https://github.com/langbot-app/LangBot.git
synced 2025-11-25 19:37:36 +08:00
feat: add GitHub star count component to sidebar (#1636)
* feat: add GitHub star count component to sidebar - Add GitHub star component to sidebar bottom section - Fetch star count from space.langbot.app API - Display star count with proper internationalization - Open GitHub repository in new tab when clicked - Follow existing sidebar styling patterns Co-Authored-By: Rock <rockchinq@gmail.com> * perf: ui * chore: remove githubStars text --------- Co-authored-by: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com> Co-authored-by: Rock <rockchinq@gmail.com>
This commit is contained in:
committed by
GitHub
parent
d9fa1cbb06
commit
46b4482a7d
@@ -9,7 +9,7 @@ import {
|
||||
import { useRouter, usePathname } from 'next/navigation';
|
||||
import { sidebarConfigList } from '@/app/home/components/home-sidebar/sidbarConfigList';
|
||||
import langbotIcon from '@/app/assets/langbot-logo.webp';
|
||||
import { systemInfo } from '@/app/infra/http/HttpClient';
|
||||
import { systemInfo, spaceClient } from '@/app/infra/http/HttpClient';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { Moon, Sun, Monitor } from 'lucide-react';
|
||||
import { useTheme } from 'next-themes';
|
||||
@@ -22,6 +22,7 @@ import {
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { ToggleGroup, ToggleGroupItem } from '@/components/ui/toggle-group';
|
||||
import { LanguageSelector } from '@/components/ui/language-selector';
|
||||
import { Badge } from '@/components/ui/badge';
|
||||
import PasswordChangeDialog from '@/app/home/components/password-change-dialog/PasswordChangeDialog';
|
||||
|
||||
// TODO 侧边导航栏要加动画
|
||||
@@ -44,6 +45,7 @@ export default function HomeSidebar({
|
||||
const [popoverOpen, setPopoverOpen] = useState(false);
|
||||
const [passwordChangeOpen, setPasswordChangeOpen] = useState(false);
|
||||
const [languageSelectorOpen, setLanguageSelectorOpen] = useState(false);
|
||||
const [starCount, setStarCount] = useState<number | null>(null);
|
||||
|
||||
useEffect(() => {
|
||||
initSelect();
|
||||
@@ -51,6 +53,16 @@ export default function HomeSidebar({
|
||||
localStorage.setItem('token', 'test-token');
|
||||
localStorage.setItem('userEmail', 'test@example.com');
|
||||
}
|
||||
|
||||
spaceClient
|
||||
.get('/api/v1/dist/info/repo')
|
||||
.then((response) => {
|
||||
const data = response as { repo: { stargazers_count: number } };
|
||||
setStarCount(data.repo.stargazers_count);
|
||||
})
|
||||
.catch((error) => {
|
||||
console.error('Failed to fetch GitHub star count:', error);
|
||||
});
|
||||
return () => console.log('sidebar.unmounted');
|
||||
// eslint-disable-next-line react-hooks/exhaustive-deps
|
||||
}, []);
|
||||
@@ -150,6 +162,30 @@ export default function HomeSidebar({
|
||||
</div>
|
||||
|
||||
<div className={`${styles.sidebarBottomContainer}`}>
|
||||
{starCount !== null && (
|
||||
<div
|
||||
onClick={() => {
|
||||
window.open('https://github.com/langbot-app/LangBot', '_blank');
|
||||
}}
|
||||
className="flex justify-center cursor-pointer p-2 rounded-lg hover:bg-accent/30 transition-colors"
|
||||
>
|
||||
<Badge
|
||||
variant="outline"
|
||||
className="hover:bg-secondary/50 px-3 py-1.5 text-sm font-medium transition-colors border-border relative overflow-hidden group"
|
||||
>
|
||||
<svg
|
||||
className="w-4 h-4 mr-2"
|
||||
viewBox="0 0 24 24"
|
||||
fill="currentColor"
|
||||
>
|
||||
<path d="M12 2C6.477 2 2 6.477 2 12c0 4.42 2.865 8.17 6.839 9.49.5.092.682-.217.682-.482 0-.237-.008-.866-.013-1.7-2.782.604-3.369-1.34-3.369-1.34-.454-1.156-1.11-1.464-1.11-1.464-.908-.62.069-.608.069-.608 1.003.07 1.531 1.03 1.531 1.03.892 1.529 2.341 1.087 2.91.831.092-.646.35-1.086.636-1.336-2.22-.253-4.555-1.11-4.555-4.943 0-1.091.39-1.984 1.029-2.683-.103-.253-.446-1.27.098-2.647 0 0 .84-.269 2.75 1.025A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.294 2.747-1.025 2.747-1.025.546 1.377.203 2.394.1 2.647.64.699 1.028 1.592 1.028 2.683 0 3.842-2.339 4.687-4.566 4.935.359.309.678.919.678 1.852 0 1.336-.012 2.415-.012 2.743 0 .267.18.578.688.48C19.138 20.167 22 16.418 22 12c0-5.523-4.477-10-10-10z" />
|
||||
</svg>
|
||||
<div className="absolute inset-0 -translate-x-full bg-gradient-to-r from-transparent via-white/20 to-transparent group-hover:translate-x-full transition-transform duration-1000 ease-out"></div>
|
||||
{starCount.toLocaleString()}
|
||||
</Badge>
|
||||
</div>
|
||||
)}
|
||||
|
||||
<SidebarChild
|
||||
onClick={() => {
|
||||
// open docs.langbot.app
|
||||
|
||||
Reference in New Issue
Block a user