fix: show user info on homepage hero when logged in instead of always showing login button

This commit is contained in:
xiezhouwei 2026-06-22 10:59:30 +08:00
parent 0ab319143b
commit 4f85cad331
1 changed files with 13 additions and 4 deletions

View File

@ -17,10 +17,11 @@ along with this program. If not, see <https://www.gnu.org/licenses/>.
For commercial licensing, please contact support@quantumnous.com For commercial licensing, please contact support@quantumnous.com
*/ */
import React, { useState, useEffect, useCallback, useRef } from 'react'; import React, { useState, useEffect, useCallback, useRef, useContext } from 'react';
import { Link, useNavigate } from 'react-router-dom'; import { Link, useNavigate } from 'react-router-dom';
import { useTranslation } from 'react-i18next'; import { useTranslation } from 'react-i18next';
import { Copy, Check, Code, Terminal, FileCode, Box, Grid3X3, Play, Trophy, PieChart, BookOpen, Search, Sun, Moon, Monitor, Languages } from 'lucide-react'; import { Copy, Check, Code, Terminal, FileCode, Box, Grid3X3, Play, Trophy, PieChart, BookOpen, Search, Sun, Moon, Monitor, Languages } from 'lucide-react';
import { UserContext } from '../../context/User';
/* ================================================================== /* ==================================================================
@ -140,6 +141,7 @@ function HomeLanguageSelector() {
function HeroSection() { function HeroSection() {
const { t } = useTranslation(); const { t } = useTranslation();
const [userState] = useContext(UserContext);
const [copied, setCopied] = useState(false); const [copied, setCopied] = useState(false);
const navigate = useNavigate(); const navigate = useNavigate();
const copyCmd = useCallback(() => { const copyCmd = useCallback(() => {
@ -171,9 +173,16 @@ function HeroSection() {
<div className="flex items-center gap-1"> <div className="flex items-center gap-1">
<HomeThemeToggle /> <HomeThemeToggle />
<HomeLanguageSelector /> <HomeLanguageSelector />
<Link to="/login" className="inline-flex items-center bg-white text-black px-4 py-1.5 text-sm font-mono font-medium uppercase tracking-widest hover:bg-transparent hover:text-white border border-white transition-colors duration-200 ml-2"> {userState.user ? (
{t("登录")} <Link to="/console" className="inline-flex items-center gap-2 bg-white/10 text-white px-4 py-1.5 text-sm font-mono font-medium rounded hover:bg-white/20 border border-white/20 transition-colors duration-200 ml-2">
</Link> <span className="w-5 h-5 rounded-full bg-white/20 flex items-center justify-center text-[11px] font-bold">{userState.user.username?.charAt(0).toUpperCase()}</span>
<span className="hidden sm:inline max-w-[100px] truncate">{userState.user.display_name || userState.user.username}</span>
</Link>
) : (
<Link to="/login" className="inline-flex items-center bg-white text-black px-4 py-1.5 text-sm font-mono font-medium uppercase tracking-widest hover:bg-transparent hover:text-white border border-white transition-colors duration-200 ml-2">
{t("登录")}
</Link>
)}
</div> </div>
</div> </div>
</div> </div>